/* 상단 */
.mypage-main-container .top-wrap { display: flex; gap: 0 3%; padding: 30px; margin-bottom: 24px; border: 1px solid #F35F4C; border-radius: 12px; } 
.mypage-main-container .top-wrap .left-box { width: 25%; text-align: center; } 
.mypage-main-container .top-wrap .left-box .profile-img { position: relative; margin: 0px auto 12px; max-width: 120px; width: 100%; } 
.mypage-main-container .top-wrap .left-box .profile-img .mb-profile-img { width: 100%; } 
.mypage-main-container .top-wrap .left-box .profile-img .mod-btn { position: absolute; bottom: 0; right: 0; } 
.mypage-main-container .top-wrap .left-box .txt-nick { font-size: 24px; font-weight: 700; padding-bottom: 15px; } 
.mypage-main-container .top-wrap .left-box .txt-guest { display: flex; align-items: center; justify-content: space-between; margin: 0 auto; width: 198px; font-size: 16px; } 
.mypage-main-container .top-wrap .left-box .txt-guest .tit { display: inline-flex; align-items: center; gap: 0 7%; width: 38%; font-weight: 500; white-space: nowrap; } 
.mypage-main-container .top-wrap .left-box .txt-guest .cnt { font-weight: 600; color: #F03A23; } 

.mypage-main-container .top-wrap .right-box { width: 75%; display: flex; flex-direction: column; justify-content: space-around; } 
.mypage-main-container .top-wrap .right-box .date-wrap { display: flex; align-items: center; padding-bottom: 15px; font-size: 16px; font-weight: 500; color: #5F5F5F; white-space: nowrap; } 
.mypage-main-container .top-wrap .right-box .date-wrap .bar { color: #D3D5D7; padding: 0 20px; } 
.mypage-main-container .top-wrap .right-box .date-wrap .txt1 { padding-right: 10px; } 
.mypage-main-container .top-wrap .right-box .date-wrap .txt2 { font-weight: 600; color: #000; } 

.mypage-main-container .top-wrap .right-box .txt-wrap { display: flex; gap: 0 2%; margin-bottom: 15px; } 
.mypage-main-container .top-wrap .right-box .txt-wrap .txt-box { padding: 16px 20px; width: 100%; height: 112px; border-radius: 12px; background-color: #F7F8F9; line-height: 1.3; } 
.mypage-main-container .top-wrap .right-box .txt-wrap .txt-box .ellispsis { overflow: hidden; height: 100%; overflow-y: auto; } 

.mypage-main-container .top-wrap .right-box .txt-wrap .btn-box { width: 25%; } 
.mypage-main-container .top-wrap .right-box .txt-wrap .btn-box a { padding: 10px; display: flex; justify-content: center; align-items: center; height: 50px; border-radius: 8px; font-size: 16px; font-weight: 600; line-height: 1.3; } 
.mypage-main-container .top-wrap .right-box .txt-wrap .btn-box a img { margin-right: 5px; width: 18px; } 
.mypage-main-container .top-wrap .right-box .txt-wrap .btn-box .subscribe-btn { margin-bottom: 10px; border: 1px solid #1F2124; } 
.mypage-main-container .top-wrap .right-box .txt-wrap .btn-box .msg-btn { background-color: #000; color: #fff; } 

.mypage-main-container .top-wrap .right-box .txt-wrap .btn-box.only-msg .msg-btn { height: 100%; max-height: 112px; } 

.mypage-main-container .top-wrap .right-box .info-wrap { display: flex; align-items: center; padding: 17px 30px; border: 1px solid #F35F4C; border-radius: 12px; box-shadow: 0px 2px 8px 0px #F35F4C33; } 
.mypage-main-container .top-wrap .right-box .info-wrap .info-box { display: flex; width: 100%; } 
.mypage-main-container .top-wrap .right-box .info-wrap .info-box .tit-box { display: flex; align-items: center; gap: 0 2%; width: 100%; } 
.mypage-main-container .top-wrap .right-box .info-wrap .info-box .cnt { padding: 2px; width: 100%; border-radius: 8px; background-color: #FEF2F1; font-weight: 600; text-align: center; font-size: 14px; } 
.mypage-main-container .top-wrap .right-box .info-wrap .bar { padding: 0 3%; color: #E7E6E6; } 

/* 목록 */
.mypage-main-container .list-wrap { padding: 24px; border: 1px solid #E7E6E6; border-radius: 12px; margin-bottom: 24px; } 
.mypage-main-container .list-wrap .head-wrap { margin-bottom: 30px; } 
.mypage-main-container .list-wrap .head-wrap ul { display: flex; align-items: center; justify-content: space-between; gap: 0 2%; } 
.mypage-main-container .list-wrap .head-wrap ul li { padding-bottom: 6px; width: 100%; border-bottom: 3px solid #fff; } 
.mypage-main-container .list-wrap .head-wrap ul li a { display: flex; align-items: center; justify-content: center; gap: 0 3px; font-size: 18px; font-weight: 700; color: #000; } 
.mypage-main-container .list-wrap .head-wrap ul li.lock a { color: #9DA5B6; } 
.mypage-main-container .list-wrap .head-wrap ul li.active { border-bottom: 3px solid #F35F4C; } 
.mypage-main-container .list-wrap .head-wrap ul li.active a { color: #F35F4C; } 

/* 펫플루언서 목록 */
.mypage-main-container .list-wrap .content-wrap.petflu { padding-bottom: 30px; } 
.mypage-main-container .list-wrap .content-wrap.petflu ul { display: flex; flex-wrap: wrap; gap: 30px 1.4%; } 
.mypage-main-container .list-wrap .content-wrap.petflu ul li { width: 23.9%; overflow: hidden; border: 1px solid #F2E9E9; border-radius: 12px; box-shadow: 0px 2px 8px 0px #F35F4C33; } 
.mypage-main-container .list-wrap .content-wrap.petflu ul .list-box .img-box { position: relative; } 
.mypage-main-container .list-wrap .content-wrap.petflu ul .list-box .img-box .content-img img { width: 100%; } 
.mypage-main-container .list-wrap .content-wrap.petflu ul .list-box .img-box .content-cate { position: absolute; left: 10px; top: 10px; } 
.mypage-main-container .list-wrap .content-wrap.petflu ul .list-box .img-box .mark { position: absolute; right: 10px; top: 10px; } 
.mypage-main-container .list-wrap .content-wrap.petflu ul .list-box .img-box .heart-box { position: absolute; bottom: 10px; right: 10px; padding: 2px 6px; border-radius: 6px; background: #00000099; color: #fff; } 
.mypage-main-container .list-wrap .content-wrap.petflu ul .list-box .img-box .heart-box img { display: inline-block; } 
.mypage-main-container .list-wrap .content-wrap.petflu ul .list-box .img-box .heart-box span { font-size: 14px; font-weight: 700; } 
.mypage-main-container .list-wrap .content-wrap.petflu ul .list-box .img-box .mb-profile-img { position: absolute; display: inline-block; bottom: -25px; left: 15px; width: 46px; height: 46px; border: 2px solid #fff; border-radius: 50%; } 
.mypage-main-container .list-wrap .content-wrap.petflu ul .list-box .txt-box { padding: 10px 20px 20px; min-width: 0; background-color: #fff; } 
.mypage-main-container .list-wrap .content-wrap.petflu ul .list-box .txt-box .txt1 { font-size: 13px; color:#858894; padding-left: 40px; } 
.mypage-main-container .list-wrap .content-wrap.petflu ul .list-box .txt-box .txt2 { padding: 10px 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 16px; font-weight: 600; } 
.mypage-main-container .list-wrap .content-wrap.petflu ul .list-box .txt-box .txt3 { letter-spacing: -1px; color: #858894; } 
.mypage-main-container .list-wrap .content-wrap.petflu ul .list-box .txt-box .txt3 img { display: inline-block; filter: invert(57%) sepia(11%) saturate(332%) hue-rotate(191deg) brightness(93%) contrast(84%); } 

/* 목록 공용 */
.picker-box { display: flex; align-items: center; gap: 0 5px; margin-bottom: 20px; } 

/* 리스트형 게시판 목록 */
.mypage-main-container .list-wrap .content-wrap.community { border-top: 2px solid #1F2124; border-radius: 2px; padding-bottom: 30px; } 
.mypage-main-container .list-wrap .content-wrap.community .w-img { width: 12%; } 
.mypage-main-container .list-wrap .content-wrap.community .w-sunj { width: 81%; min-width: 0; } 
.mypage-main-container .list-wrap .content-wrap.community .w-rate { width: 6%; } 

.mypage-main-container .list-wrap .content-wrap.community ul { width: 100%; } 
.mypage-main-container .list-wrap .content-wrap.community ul li { box-sizing: border-box; } 
.mypage-main-container .list-wrap .content-wrap.community ul .head-box { display: flex; padding: 12px 30px; width: 100%; border-bottom: 1px solid #E7E6E6; font-size: 15px; font-weight: 600; text-align: center; } 
.mypage-main-container .list-wrap .content-wrap.community ul .list-box { position: relative; display: flex; align-items: center; padding: 10px 30px; border-bottom: 1px solid #E7E6E6; } 
.mypage-main-container .list-wrap .content-wrap.community ul .list-box.ad { background-color: #FEF2F1; } 
.mypage-main-container .list-wrap .content-wrap.community ul .list-box.ad .tag { padding: 2px 6px; border-radius: 6px; font-weight: 700; background-color: #FBCFC9; color: #F03A23; } 
.mypage-main-container .list-wrap .content-wrap.community ul .list-box .thumb-img { width: 70px; min-width: 70px; } 
.mypage-main-container .list-wrap .content-wrap.community ul .list-box .thumb-img img { width: 100%; border-radius: 12px; } 
.mypage-main-container .list-wrap .content-wrap.community ul .list-box .content-box { width: 100%; padding: 0 10px; min-width: 0; box-sizing: border-box; } 

.mypage-main-container .list-wrap .content-wrap.community ul .list-box .content-box .subj-box { display: flex; align-items: center; gap: 0 1%; margin-bottom: 5px; } 
.mypage-main-container .list-wrap .content-wrap.community ul .list-box .content-box .subj-box .cate-box { display: inline-flex; gap: 0 5px; white-space: nowrap; } 
.mypage-main-container .list-wrap .content-wrap.community ul .list-box .content-box .subj-box .cate { padding: 2px 6px; border: 1px solid #D3D5D7; border-radius: 6px; background-color: #F5F6FA; font-weight: 700; color: #5F5F5F; } 
.mypage-main-container .list-wrap .content-wrap.community ul .list-box .content-box .subj-box .subj-area { width: 100%; min-width: 0; } 
.mypage-main-container .list-wrap .content-wrap.community ul .list-box .content-box .subj-box .subj-area .subj { font-size: 16px; line-height: 22px; font-weight: 500; margin-right: 5px; display: -webkit-box; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; text-overflow: ellipsis; } 
.mypage-main-container .list-wrap .content-wrap.community ul .list-box .content-box .subj-box .subj-area .subj .cate-tag-wrap { font-size: 14px; display: inline-block; margin-right: 3px; } 

.mypage-main-container .list-wrap .content-wrap.community ul .list-box .content-box .subj-box .comment-cnt { font-size: 16px; font-weight: 600; color: #F03A23; } 

.mypage-main-container .list-wrap .content-wrap.community ul .list-box .content-box .info-box { display: flex; align-items: center; color: #5F5F5F; } 
.mypage-main-container .list-wrap .content-wrap.community ul .list-box .content-box .info-box .nick .mb-profile-img { width: 20px; height: 20px; border-radius: 40px; } 
.mypage-main-container .list-wrap .content-wrap.community ul .list-box .content-box .info-box .info { display: flex; align-items: center; gap: 0 2px; } 
.mypage-main-container .list-wrap .content-wrap.community ul .list-box .content-box .info-box .info .icon-hit { filter: invert(33%) sepia(90%) saturate(0%) hue-rotate(206deg) brightness(89%) contrast(88%); } 
.mypage-main-container .list-wrap .content-wrap.community ul .list-box .rate { display: flex; align-items: center; justify-content: center; flex-shrink: 0; flex-basis: 50px; width: 70px; height: 26px; padding: 2px 6px; border-radius: 6px; font-weight: 500; color: #fff; background-color: #F35F4C; } 

/* 마이페이지 아이템 목록 */
.mypage-main-container .list-wrap .content-wrap.item{ padding-bottom: 30px; }
.mypage-main-container .mypage-item-list { display: flex; flex-wrap: wrap; gap: 15px; /* 아이템 간 간격 */
 margin-bottom: 50px; } 

.mypage-main-container .mypage-item { flex: 1 1 calc(25% - 15px); /* 한 줄에 4개 (간격 포함) */
 max-width: calc(25% - 11px); background: #fff; overflow: hidden; text-align: center; box-sizing: border-box; margin-bottom: 10px; border-radius: 12px; } 

/* 전체 아이템 클릭 영역 (a 태그) */
.mypage-item .item-desc-wrap { display: flex; flex-direction: column; text-decoration: none; color: #333; transition: filter 0.3s ease; } 

.mypage-item .item-desc-wrap:hover { filter: brightness(90%); } 

/* 이미지 영역 */
.mypage-item .item-desc-wrap .item-image { width: 100%; padding-top: 100%; /* 정사각형 비율 */
 position: relative; border: 1px solid #E7E6E6; border-radius: 12px; overflow: hidden; } 

.mypage-item .item-desc-wrap .item-image img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: contain; border-radius: 8px; } 

.mypage-item .item-status-label { position: absolute; top: 10px; left: 10px; padding: 4px 8px; border-radius: 4px; color: #fff; font-size: 14px; font-weight: bold; } 

/* 상태별 색상 */
.mypage-item .status-pending { background-color: #ff9800; } 

.mypage-item .status-completed { background-color: #4caf50; } 

.mypage-item .status-shipped { background-color: #0099cc; } 

.mypage-item .status-unknown { background-color: #999; } 

.mypage-item .item-type-label { position: absolute; bottom: 10px; left: 10px; padding: 4px 8px; border-radius: 4px; color: #fff; font-size: 14px; font-weight: bold; } 

.mypage-item .type-coupon { background-color: #ff9800; } 

.mypage-item .type-goods { background-color: #4caf50; } 

.mypage-item .type-equip { background-color: #0099cc; } 

.mypage-item .type-unknown { background-color: #999; } 

/* 아이템 정보 영역 */
.mypage-item .item-desc-wrap .item-info { margin-top: 10px; padding: 3px; display: flex; flex-direction: column; } 

.mypage-item .item-desc-wrap .item-name { font-size: 16px; margin-bottom: 8px; text-align: left; } 

.mypage-item .item-desc-wrap .item-datetime { font-size: 14px; margin-bottom: 8px; color: #666; text-align: left; } 

/* "사용하기" 텍스트 영역: 버튼 스타일 적용 */
.mypage-item .item-desc-wrap .item-use-text { display: block; margin: 12px 0; padding: 10px 20px; /* background-color: #007BFF; */
 color: #fff; font-weight: bold; text-align: center; border-radius: 6px; } 

/* 알림 */
.mypage-alram-container .sect-wrap { padding: 24px 30px; border: 1px solid #E7E6E6; border-radius: 12px; margin-bottom: 24px; } 

.mypage-alram-container .sect-wrap .top-wrap { margin-bottom: 20px; } 
.mypage-alram-container .sect-wrap .top-wrap h1 { font-size: 20px; font-weight: 700; } 

.mypage-alram-container .sect-wrap .content-wrap .list { padding-bottom: 30px; } 
.mypage-alram-container .sect-wrap .content-wrap .list li { display: inline-flex; align-items: center; gap: 10px 0; padding: 10px 30px; width: 100%; border-bottom: 1px solid #E7E6E6; font-size: 16px; white-space: nowrap; } 
.mypage-alram-container .sect-wrap .content-wrap .list li .alarm-type { min-width: 100px; } 
.mypage-alram-container .sect-wrap .content-wrap .list li .divi { margin: 0 10px 0 3px; font-weight: 600; font-size: 14px; color: #000; } 
.mypage-alram-container .sect-wrap .content-wrap .list li .mb-profile-img { width: 42px; height: 42px; border-radius: 8px; margin-right: 10px; } 
.mypage-alram-container .sect-wrap .content-wrap .list li .subj-area { display: block; white-space: normal; gap: 0 5px; min-width: 0; line-height: 1.5rem; } 
.mypage-alram-container .sect-wrap .content-wrap .list li .subj-area .mb-profile-img { width: 42px; height: 42px; } 
.mypage-alram-container .sect-wrap .content-wrap .list li .subj-area .subj { color: #F35F4C; } 
.mypage-alram-container .sect-wrap .content-wrap .list li .new { margin-left: 5px; } 
.mypage-alram-container .sect-wrap .content-wrap .list li a { margin: 0 5px; overflow: hidden; text-overflow: ellipsis; } 

/* my구독 */
.mypage-subscribe-container .sect-wrap { padding: 24px 30px; border: 1px solid #E7E6E6; border-radius: 12px; margin-bottom: 24px; } 

.mypage-subscribe-container .sect-wrap .top-wrap { margin-bottom: 20px; } 
.mypage-subscribe-container .sect-wrap .top-wrap h1 { display: flex; align-items: center; gap: 0 1%; font-size: 20px; font-weight: 700; } 

.mypage-subscribe-container .sect-wrap .content-wrap .list { padding-bottom: 30px; } 
.mypage-subscribe-container .sect-wrap .content-wrap .list li { display: flex; align-items: center; justify-content: space-between; gap: 0 10px; padding: 7px 30px; border-bottom: 1px solid #E7E6E6; font-size: 16px; white-space: nowrap; } 
.mypage-subscribe-container .sect-wrap .content-wrap .list li .mb-profile-img { width: 36px; height: 36px; border-radius: 8px; } 
.mypage-subscribe-container .sect-wrap .content-wrap .list li .txt-box { display: flex; align-items: center; gap: 5px 10px; width: 100%; min-width: 0; } 
.mypage-subscribe-container .sect-wrap .content-wrap .list li .txt-box .nick-box a { display: flex; align-items: center; font-size: 16px; font-weight: 600; } 
.mypage-subscribe-container .sect-wrap .content-wrap .list li .txt-box .itd-box { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #5F5F5F; } 
.mypage-subscribe-container .sect-wrap .content-wrap .list li .subs-box { display: flex; align-items: center; text-align: center; font-size: 16px; font-weight: 600; } 
.mypage-subscribe-container .sect-wrap .content-wrap .list li .del-box { text-align: center; } 
.mypage-subscribe-container .sect-wrap .content-wrap .list li .del-box a { padding: 6px 12px; border: 1px solid #000; border-radius: 24px; font-weight: 600; } 

/* 메시지 */
.mypage-msg-container .sect-wrap { padding: 24px 30px; border: 1px solid #E7E6E6; border-radius: 12px; margin-bottom: 24px; } 

.mypage-msg-container .sect-wrap .top-wrap { margin-bottom: 20px; } 
.mypage-msg-container .sect-wrap .top-wrap h1 { display: flex; align-items: center; gap: 0 1%; font-size: 20px; font-weight: 700; } 

.mypage-msg-container .sect-wrap .content-wrap .list { padding-bottom: 30px; } 
.mypage-msg-container .sect-wrap .content-wrap .list li { display: flex; align-items: center; gap: 0 10px; padding: 7px 30px; border-bottom: 1px solid #E7E6E6; font-size: 16px; } 
.mypage-msg-container .sect-wrap .content-wrap .list li .message-link { display: flex; align-items: center; width: 100%; } 
.mypage-msg-container .sect-wrap .content-wrap .list li .txt-box { display: flex; gap: 1px 20px; align-items: center; flex-grow: 1; min-width: 0; } 
.mypage-msg-container .sect-wrap .content-wrap .list li .mb-profile-img { width: 42px; height: 42px; border-radius: 8px; flex-shrink: 0; margin-right: 10px; } 
.mypage-msg-container .sect-wrap .content-wrap .list li .nick { font-size: 16px; font-weight: 600; max-width: 222px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; flex-shrink: 0; } 
.mypage-msg-container .sect-wrap .content-wrap .list li .cnt { display: inline-flex; align-items: center; justify-content: center; min-width: 22px; width: 22px; height: 22px; border-radius: 50%; background-color: #F35F4C; font-size: 12px; font-weight: 600; color: #fff; flex-shrink: 0; } 
.mypage-msg-container .sect-wrap .content-wrap .list li .cnt.plus-cnt { width: 26px; border-radius: 45%; } 
.mypage-msg-container .sect-wrap .content-wrap .list li .txt-box .txt1 { flex-grow: 1; min-width: 0; display: flex; align-items: center; } 
.mypage-msg-container .sect-wrap .content-wrap .list li .txt-box .txt1 .txt1-memo { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; /* flex-grow: 1; */
 min-width: 0; display: block; padding-right: 10px; } 
 .mypage-msg-container .sect-wrap .content-wrap .list li .txt-box .txt1 .txt1-memo span { color: #777; } 

/* 채팅 */
.mypage-cht-container .sect-wrap { padding: 24px 30px; border: 1px solid #E7E6E6; border-radius: 12px; margin-bottom: 24px; } 
.mypage-cht-container .sect-wrap .top-wrap { margin-bottom: 20px; } 
.mypage-cht-container .sect-wrap .top-wrap .tit-box { display: flex; align-items: center; justify-content: space-between; padding-bottom: 16px; } 
/* .mypage-cht-container .sect-wrap .top-wrap .tit-box h1 { display: flex; align-items: center; gap: 0 10px; font-size: 20px; font-weight: 700; } */
.mypage-cht-container .sect-wrap .top-wrap .tit-box a { display: flex; align-items: center; gap: 0 10px; } 
.mypage-cht-container .sect-wrap .top-wrap .tit-box .recv-info { font-weight: 600; } 
.mypage-cht-container .sect-wrap .top-wrap .tit-box .recv-info img { width: 30px; } 
.mypage-cht-container .sect-wrap .top-wrap .txt-box { display: flex; align-items: center; justify-content: center; gap: 0 10px; padding: 12px; margin-bottom: 20px; border: 1px solid #E7E6E6; border-radius: 8px; } 

.mypage-cht-container .sect-wrap .content-wrap .chat-box { margin-bottom: 30px; } 
.mypage-cht-container .sect-wrap .content-wrap .chat-box ul { display: flex; flex-direction: column-reverse; justify-content: end; gap: 20px 0; padding-right: 10px; height: 306px; overflow-y: auto; } 
.mypage-cht-container .sect-wrap .content-wrap .chat-box ul::-webkit-scrollbar { width: 5px; } 
.mypage-cht-container .sect-wrap .content-wrap .chat-box ul::-webkit-scrollbar-thumb { border-radius: 50px; background-color: #e7e6e6; } 

.mypage-cht-container .sect-wrap .content-wrap .chat-box ul li.recipient { display: flex; gap: 0 10px; } 
.mypage-cht-container .sect-wrap .content-wrap .chat-box ul li.recipient img { margin-bottom: auto; width: 42px; height: 42px; } 
.mypage-cht-container .sect-wrap .content-wrap .chat-box ul li.recipient .nick { padding-bottom: 6px; font-weight: 600; } 
.mypage-cht-container .sect-wrap .content-wrap .chat-box ul li.recipient .content { padding: 10px 12px; border-radius: 12px; line-height: 1.5; background-color: #F0F2F4; font-weight: 500; } 

.mypage-cht-container .sect-wrap .content-wrap .chat-box ul li .txt-box .date-box { padding-bottom: 5px; font-size: 12px; } 
.mypage-cht-container .sect-wrap .content-wrap .chat-box ul li.sender .txt-box .date-box { text-align: right; } 

.mypage-cht-container .sect-wrap .content-wrap .chat-box ul li.sender { margin-left: auto; } 
.mypage-cht-container .sect-wrap .content-wrap .chat-box ul li.sender .content { padding: 10px 12px; border-radius: 12px; line-height: 1.5; background-color: #FEF2F1; font-weight: 500; } 

.mypage-cht-container .sect-wrap .content-wrap .form-box { text-align: right; } 
.mypage-cht-container .sect-wrap .content-wrap .form-box textarea { padding: 10px 20px; margin-bottom: 10px; border: 1px solid #D3D5D7; border-radius: 8px; width: 100%; height: 100px; resize: none; } 
.mypage-cht-container .sect-wrap .content-wrap .form-box button { padding: 8px; width: 100px; height: 45px; border: 0; border-radius: 8px; font-size: 16px; font-weight: 600; background-color: #F35F4C; color: #fff; } 

/* 관리자용 추가 */
.mypage-main-container .top-wrap .right-box .admin-wrap { margin-top: 10px; display: flex; gap: 10px; } 

.mypage-main-container .top-wrap .right-box .admin-wrap .mypage-mission-link { width: 100%; display: flex; justify-content: center; align-items: center; color: #fff; background-color: #F35F4C; border-radius: 12px; padding: 12px; font-size: 16px; font-weight: bold; transition: filter 0.3s ease; } 

.mypage-main-container .top-wrap .right-box .admin-wrap .mypage-mission-link:hover { filter: brightness(110%); } 

.mypage-main-container .top-wrap .right-box .admin-wrap .mypage-mission-link:last-of-type { background-color: grey; } 

/* 250326 - 마이페이지 프로필에 더보기 기능 추가 */

.mypage-main-container .top-wrap .right-box .txt-wrap .txt-box { position: relative; /* 더보기 버튼 위치 조정을 위해 */ } 

/* 확장된 경우 높이 제한 해제 */
.mypage-main-container .top-wrap .right-box .txt-wrap .txt-box.expanded { height: auto; } 

/* 더보기 링크 스타일 */
.mypage-main-container .top-wrap .right-box .txt-wrap .txt-box .more-link { display: block; text-align: center; color: #000; font-size: 14px; text-decoration: none; position: absolute; left: 0; bottom: 5px; padding: 5px; padding-top: 10px; width: 100%; background: linear-gradient(to bottom, rgba(247, 248, 249, 0.6) 0%, rgba(247, 248, 249, 1) 100%); } 

/* 더보기 링크의 SVG와 텍스트 사이 여백 (옵션) */
.mypage-main-container .top-wrap .right-box .txt-wrap .txt-box .more-link svg { vertical-align: middle; margin-right: 2px; } 

/* 기존 페이징, 검색 */
.page-wrap { display: flex; justify-content: center; margin-bottom: 20px; } 
.page-wrap ul { display: flex; align-items: center; justify-content: center; width: 100%; } 
.page-wrap ul li { padding: 5px 10px; } 
.page-wrap ul li a { display: flex; align-items: center; color: #858894; border: 1px solid #fff; } 
.page-wrap ul .txt { padding: 5px; } 
.page-wrap ul .txt a { color: #000; } 
.page-wrap ul li.active { border: 1px solid #D3D5D7; border-radius: 4px; box-sizing: border-box; } 
.page-wrap ul li.active a { color: #000; } 
.page-wrap ul .txt a img { filter: invert(0%) sepia(65%) saturate(18%) hue-rotate(308deg) brightness(98%) contrast(104%); } 
.search-wrap { display: flex; justify-content: center; gap: 0 5px; } 
.search-wrap select { padding: 8px 12px; border: 1px solid #D3D5D7; border-radius: 4px; } 
.search-wrap .search-txt-box { position: relative; } 
.search-wrap .search-txt-box input { padding: 8px 12px; width: 280px; border: 1px solid #D3D5D7; border-radius: 4px; box-sizing: border-box; } 
.search-wrap .search-txt-box button { position: absolute; top: 8px; right: 10px; background-color: #fff; border: 0; } 

/* 새 페이징, 검색 관련 (비동기) */
.patpat-pagination { display: flex; align-items: center; justify-content: center; margin-bottom: 20px; } 
.patpat-pagination .patpat-page-link { display: flex; align-items: center; padding: 5px 10px; margin: 0 1px; } 
.patpat-pagination .patpat-page-link.page-prev img { transform: rotate(180deg); } 
.patpat-pagination .patpat-page-link.active { border: 1px solid #D3D5D7; border-radius: 4px; box-sizing: border-box; } 
.patpat-pagination .patpat-page-link a { display: flex; align-items: center; color: #858894; border: 1px solid #fff; } 
.patpat-search-wrap { display: flex; align-items: center; justify-content: center; } 
.patpat-search-wrap .patpat-search { position: relative; } 
.patpat-search-wrap .patpat-search input { padding: 8px 12px; width: 280px; border: 1px solid #D3D5D7; border-radius: 4px; box-sizing: border-box; } 
.patpat-search-wrap .patpat-search select { flex-shrink: 0; padding: 8px 12px; border: 1px solid #D3D5D7; border-radius: 4px; box-sizing: border-box; background-color: #fff; margin-right: 8px; /* input과의 간격 조절 */ } 
.patpat-search-wrap .patpat-search button { position: absolute; top: 8px; right: 10px; background-color: #fff; border: 0; } 
/* 페이징, 검색 관련 E */

/* 배송정보 입력 모달 관련 S */

/* 모달 배경(반투명) 공통 */
.shippingModal { display: none; position: fixed; z-index: 9999; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background-color: rgba(0,0,0,0.5); padding: 0 15px; box-sizing: border-box; /* 중앙 정렬을 위한 flexbox 추가 */
 align-items: center; justify-content: center; } 

/* 모달 컨테이너 공통 */
.shippingModal-wrap { background-color: #fff; padding: 20px; border-radius: 6px; width: 100%; max-width: 420px; position: relative; box-shadow: 0 2px 8px rgba(0,0,0,0.3); box-sizing: border-box; } 

/* 닫기(X) 버튼 */
.shippingModal .close { color: #999; float: right; font-size: 24px; font-weight: bold; cursor: pointer; } 

.shippingModal .close:hover,
.shippingModal .close:focus { color: #000; text-decoration: none; } 

.shippingModal .shippingModal-title { margin-top: 0; margin-bottom: 20px; font-size: 1.2rem; color: #333; } 

.shippingModal .form-group { margin-bottom: 20px; } 

.shippingModal .form-group#group_postal_code { display: none !important; } 

.shippingModal .form-group label { display: inline-block; font-weight: bold; margin-bottom: 10px; font-size: 15px; color: #444; } 

.shippingModal .form-group input[type="text"],
.shippingModal .form-group input[type="tel"] { width: 100%; padding: 10px 12px; box-sizing: border-box; border: 1px solid #ccc; border-radius: 4px; font-size: 0.95rem; } 

.shippingModal .form-group#group_address #iu_address { margin-bottom: 10px; } 

/* form-group 내부에 required input이 있으면 해당 label에 별표 추가 */
.shippingModal .form-group:has(input[required]) label { position: relative; /* 별표의 위치를 조절하기 위해 */ } 

.shippingModal .form-group:has(input[required]) label::after { content: " *"; color: red; font-size: 14px; position: absolute; top: 0px; right: -10px; } 

.shippingModal .modal-buttons { text-align: right; margin-top: 20px; } 

.shippingModal .modal-buttons button { background-color: #007bff; color: #fff; border: none; padding: 10px 14px; margin-left: 5px; cursor: pointer; border-radius: 4px; font-size: 0.9rem; transition: background-color 0.2s; } 

.shippingModal .modal-buttons button:hover { background-color: #0056b3; } 

.shippingModal #searchAddress { background-color: #28a745 !important; } 
.shippingModal #searchAddress:hover { background-color: #218838 !important; } 

.shippingModal #cancelShipping { background-color: #6c757d; } 
.shippingModal #cancelShipping:hover { background-color: #5a6268; } 

.shippingModal-info { margin-top: 15px; text-align: center; } 

.shippingModal-info .privacy-info { font-size: 12px; color: #666; text-align: center; } 

/* 반응형 */
@media (max-width: 480px){
 .shippingModal-wrap { margin: 10% auto; padding: 16px; max-width: 100%; } 
 }
/* 배송정보 입력 모달 관련 E */

/* 반응형 */
@media all and (max-width: 1280px) { /* 알람 */
.mypage-subscribe-container .sect-wrap,
.mypage-msg-container .sect-wrap,
.mypage-alram-container .sect-wrap { padding: 24px 0; border: 0; } 
.mypage-subscribe-container .sect-wrap .content-wrap .list li,
.mypage-msg-container .sect-wrap .content-wrap .list li,
.mypage-alram-container .sect-wrap .content-wrap .list li { padding: 10px 0; } 

.mypage-alram-container .sect-wrap .top-wrap { margin-bottom: 10px; } 
.main-container .main-left.mypage-main-container > section, .main-container .main-left > article { padding-top: 0 !important; } 

.mypage-main-container .top-wrap,
.mypage-main-container .list-wrap { border: 0; margin: 12px; } 

.mypage-main-container .top-wrap { border: 1px solid #F35F4C; } 

.mypage-main-container .list-wrap { margin-top: 0; } 

.mypage-main-container > div { padding: 18px 15px; background-color: #fff; } 
.mypage-main-container > .banner-wrap { padding: 0; }

.mypage-main-container .list-wrap .content-wrap { margin: 0 15px; } 
 
/* 메세지 */
.mypage-msg-container .sect-wrap .content-wrap .list .txt-box { flex-direction: column; } 
 .mypage-msg-container .sect-wrap .content-wrap .list li .nick { max-width: 100%; margin-bottom: 3px; width: fit-content; } 
 .mypage-msg-container .sect-wrap .content-wrap .list li .cnt { min-width: 18px; width: 18px; height: 18px; font-size: 11px; } 
 .mypage-msg-container .sect-wrap .content-wrap .list li .txt-box { align-items: normal; } 
.mypage-msg-container .sect-wrap .content-wrap .list li .txt-box .txt1 { } 
.mypage-msg-container .sect-wrap .content-wrap .list li .txt-box .txt1 .txt1-memo { font-size: 12px; overflow: visible; white-space: normal; text-overflow: clip; } 
.mypage-msg-container .sect-wrap .content-wrap .list li .txt-box .txt1 .txt1-memo span { width: 100%; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } 
.mypage-alram-container .sect-wrap .content-wrap .list li .subj-area { font-size: 15px; } 
 }

@media all and (max-width: 910px) { /* 상단 */
.mypage-main-container .top-wrap { flex-direction: column; align-items: center; padding: 15px; } 
.mypage-main-container .top-wrap .left-box { margin-bottom: 15px; width: auto; } 

.mypage-main-container .top-wrap .left-box .profile-img { max-width: 80px; } 
.mypage-main-container .top-wrap .left-box .profile-img .mod-btn { right: -10px; } 

.mypage-main-container .top-wrap .right-box { width: 100%; display: flex; flex-direction: column; justify-content: space-around; } 
.mypage-main-container .top-wrap .right-box .date-wrap { flex-direction: column; align-items: unset; padding-bottom: 10px; } 
.mypage-main-container .top-wrap .right-box .date-wrap .date-txt { display: flex; justify-content: space-between; font-size: 12px; } 
.mypage-main-container .top-wrap .right-box .date-wrap .date-txt:nth-child(1) { padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px solid #E7E6E6; } 
.mypage-main-container .top-wrap .right-box .date-wrap .bar { display: none; } 

.mypage-main-container .top-wrap .right-box .txt-wrap { flex-direction: column; margin-bottom: 10px; } 
.mypage-main-container .top-wrap .right-box .txt-wrap .txt-box { padding: 10px; margin-bottom: 10px; } 
.mypage-main-container .top-wrap .right-box .txt-wrap .btn-box { display: flex; gap: 0 3%; width: 100%; } 
.mypage-main-container .top-wrap .right-box .txt-wrap .btn-box a { width: 100%; } 

.mypage-main-container .top-wrap .right-box .info-wrap { gap: 0 10px; padding: 0; border: 0; box-shadow: 0px 0px 0px 0px; } 
.mypage-main-container .top-wrap .right-box .info-wrap .bar { display: none; } 
.mypage-main-container .top-wrap .right-box .info-wrap .info-box { flex-direction: column; padding: 8px; border-radius: 8px; background-color: #FEF2F1; font-size: 13px; white-space: nowrap; } 
.mypage-main-container .top-wrap .right-box .info-wrap .info-box .tit-box { padding-bottom: 10px; } 
.mypage-main-container .top-wrap .right-box .info-wrap .info-box .cnt { text-align: start; } 

/* 리스트 */
.mypage-main-container .list-wrap { padding: 24px 0; border: 0; } 

/** 펫플 **/
.mypage-main-container .list-wrap .content-wrap.petflu ul li { width: 32.4%; } 
.mypage-main-container .list-wrap .content-wrap.petflu ul .list-box .txt-box .txt1 { padding-left: 32px; } 
 .mypage-main-container .list-wrap .content-wrap.petflu ul .list-box .img-box .mb-profile-img { width: 35px; height: 35px; } 

/** 리스트형 **/
.mypage-main-container .list-wrap .content-wrap.community { border: 0; } 
.mypage-main-container .list-wrap .content-wrap.community ul .list-box { padding: 15px 0; } 

.mypage-main-container .top-wrap .right-box .info-wrap .info-box .cnt { font-size: 16px; } 
 }

@media all and (max-width: 570px) { /* 리스트 */
/** 펫플 **/
 .mypage-main-container .list-wrap .content-wrap.petflu ul { gap: 30px 2%; } 
.mypage-main-container .list-wrap .content-wrap.petflu ul li { width: 49%; } 
.mypage-main-container .list-wrap .content-wrap.petflu ul .list-box .txt-box { padding: 10px; } 
.mypage-main-container .list-wrap .content-wrap.petflu ul .list-box .txt-box .txt2 { font-size: 15px; } 
.mypage-main-container .list-wrap .content-wrap.petflu ul .list-box .img-box .mb-profile-img { left: 5px } 
.mypage-main-container .list-wrap .content-wrap.petflu ul .list-box .img-box .content-cate { width: 30px; } 
.mypage-main-container .list-wrap .content-wrap.petflu ul .list-box .img-box .mark { width: 30px; } 
 .mypage-main-container .list-wrap .content-wrap.petflu ul .list-box .txt-box .txt1 { padding-left: 32px; } 
.mypage-main-container .list-wrap .content-wrap.petflu ul .list-box .img-box .heart-box img { width: 15px; } 
.mypage-main-container .list-wrap .content-wrap.petflu ul .list-box .img-box .heart-box span { font-size: 12px; } 

/** 리스트형 **/
.mypage-main-container .list-wrap .content-wrap.community ul .list-box .content-box .subj-box { flex-direction: column; align-items: start; gap: 12px 0; } 
.mypage-main-container .list-wrap .content-wrap.community ul .list-box .content-box .info-box { flex-wrap: wrap; } 
.mypage-main-container .list-wrap .content-wrap.community ul .list-box .rate { flex-basis: 39px; font-size: 10px; } 

/* 알람 */
.mypage-alram-container .sect-wrap .content-wrap .list li { flex-direction: column; align-items: unset; gap: 5px 0; } 
.mypage-alram-container .sect-wrap .content-wrap .list li a { margin: 0; } 
.mypage-alram-container .sect-wrap .content-wrap .list li .subj-area .mb-profile-img { width: 30px; height: 30px; margin: 0 7px 0 0; } 
 .mypage-alram-container .sect-wrap .content-wrap .list li .alarm-type img { width: 27px; } 

/* 마이구독 */
.mypage-subscribe-container .sect-wrap .content-wrap .list li .txt-box { align-items: unset; flex-direction: column; } 
.mypage-subscribe-container .sect-wrap .content-wrap .list li .txt-box .itd-box { font-size: 12px; } 
.mypage-subscribe-container .sect-wrap .content-wrap .list li .del-box a,
.mypage-subscribe-container .sect-wrap .content-wrap .list li .subs-box { font-size: 12px; } 

.search-wrap .search-txt-box input { width: auto; } 
.patpat-search-wrap .patpat-search { width: 100%; display: flex; padding: 0 10px;}
.patpat-search-wrap .patpat-search input { width: auto; flex: 1; min-width: 0; /* 오버플로우 방지 */} 
.patpat-search-wrap .patpat-search button { right: 20px; }
.mypage-main-container .top-wrap { margin-bottom: 12px; } 
.mypage-main-container .top-wrap .left-box .txt-nick { font-size: 20px; } 
.mypage-main-container .top-wrap .right-box .info-wrap .info-box .tit-box { padding-bottom: 5px; } 
.mypage-main-container .list-wrap { padding: 12px 0; } 
.mypage-main-container .list-wrap .head-wrap { margin-bottom: 15px; } 
.mypage-main-container .list-wrap .head-wrap ul li a { font-size: 15px; } 
.mypage-main-container .list-wrap .content-wrap.petflu ul { gap: 15px 2%; } 
.mypage-main-container .list-wrap .content-wrap.community ul .list-box .content-box .subj-box .subj-area .subj { font-size: 15px; line-height: 20px; word-break: break-all; } 
.mypage-main-container .list-wrap .content-wrap.community ul .list-box .content-box .subj-box .subj-area .subj .cate-tag-wrap .cate { font-size: 12px; } 
 .mypage-main-container .mypage-item { margin-bottom: 0; } 
.mypage-item .item-desc-wrap .item-info { margin-top: 7px; } 
.mypage-item .item-desc-wrap .item-name { font-size: 15px; margin-bottom: 4px; } 
.mypage-item .item-desc-wrap .item-use-text { margin-top: 8px; font-size: 13px; padding: 10px; } 
.mypage-item .item-status-label { font-size: 12px; } 
 .mypage-item .item-type-label { font-size: 12px; } 
 }

/* 아이템 리스트 관련 미디어 쿼리 */
@media all and (max-width: 910px){
 .mypage-main-container .mypage-item { flex: 1 1 calc((100% / 3) - 15px); /* 한 줄에 3개 (간격 포함) */
 max-width: calc((100% / 3) - 11px); } 
 }

/* 아이템 리스트 관련 미디어 쿼리 */
@media all and (max-width: 660px){
 .mypage-main-container .mypage-item { flex: 1 1 calc((100% / 2) - 15px); /* 한 줄에 2개 (간격 포함) */
 max-width: calc((100% / 2) - 11px); } 
 }