/* 1. 공통 레이아웃 설정 */
p.info, p.tip, p.caution, p.promotion {
    position: relative;
    padding: 1.25rem 1.5rem 1.25rem 3.5rem; /* 아이콘 공간 확보 */
    border-radius: 1rem;         /* 둥근 모서리 */
    margin-bottom: 1.5em;       /* 하단 여백 */
}

/* 2. 아이콘 설정 (CSS 내장 - SVG Mask 방식) */
p.info::before, p.tip::before, p.caution::before, p.promotion::before {
    content: '';
    position: absolute;
    left: 1.2rem;
    top: 1.35rem; /* 텍스트 첫 줄 높이에 맞춤 */
    width: 1.4rem;
    height: 1.4rem;
    background-color: currentColor; /* 텍스트 색상을 아이콘 색상으로 사용 */
    
    /* 아이콘 마스킹 처리 */
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

/* 3. 링크 밑줄 스타일 */
p.info a, p.tip a, p.caution a, p.promotion a {
    text-decoration: none;
    box-shadow: 0 1px 0 0 currentColor;
    color: inherit;
    transition: opacity 0.2s;
}
p.info a:hover, p.tip a:hover, p.caution a:hover, p.promotion a:hover {
    opacity: 0.7;
}

/* --- 개별 컬러 및 새 아이콘 정의 --- */

/* INFO: 정보 (#0A488A / #EDF5FE) */
p.info {
    color: #0A488A;
    background-color: #EDF5FE;
}
/* 아이콘: Info (원형 라인 i) */
p.info::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg%3E%3Cpath d='M11 11h2v6h-2Zm0-4h2v2h-2Z'/%3E%3Cpath d='M12 22c5.51 0 10-4.49 10-10s-4.49-10-10-10C6.49 2 2 6.49 2 12c0 5.51 4.49 10 10 10m0-18c4.41 0 8 3.59 8 8s-3.59 8-8 8 -8-3.59-8-8 3.59-8 8-8'/%3E%3C/g%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg%3E%3Cpath d='M11 11h2v6h-2Zm0-4h2v2h-2Z'/%3E%3Cpath d='M12 22c5.51 0 10-4.49 10-10s-4.49-10-10-10C6.49 2 2 6.49 2 12c0 5.51 4.49 10 10 10m0-18c4.41 0 8 3.59 8 8s-3.59 8-8 8 -8-3.59-8-8 3.59-8 8-8'/%3E%3C/g%3E%3C/svg%3E");
}

/* TIP: 팁 (#1E5D2D / #EFF7F1) */
p.tip {
    color: #1E5D2D;
    background-color: #EFF7F1;
}
/* 아이콘: Lightbulb (전구) */
p.tip::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 8c-3.31 0-6 2.69-6 6 0 1.91.88 2.93 1.72 3.93 .32.37.65.76.95 1.21 .18.27.31.57.4.86H8v2h8v-2h-1.07c.1-.29.22-.59.4-.86 .3-.44.62-.83.94-1.2 .85-1 1.73-2.04 1.73-3.94 0-3.31-2.69-6-6-6m2.74 8.64c-.34.4-.72.84-1.08 1.38 -.43.64-.67 1.35-.81 1.97h-1.72c-.14-.62-.38-1.33-.81-1.97 -.37-.55-.75-1-1.09-1.4 -.75-.88-1.24-1.46-1.24-2.63 0-2.21 1.79-4 4-4s4 1.79 4 4c0 1.16-.5 1.75-1.26 2.64ZM11 4.25V6h2V2.5h-2ZM2.55 7.17L2 8l-.55.83 1.5 1 1.5 1L5 10l.55-.83 -1.5-1Zm4.28-3.72L6 4l-.83.55 1 1.5 1 1.5L8 7l.83-.55 -1-1.5Zm14.62 3.72l-1.5 1 -1.5 1L19 10l.55.83 1.5-1 1.5-1L22 8Zm-5.28-2.22l-1 1.5L16 7l.83.55 1-1.5 1-1.5L18 4l-.83-.55Z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 8c-3.31 0-6 2.69-6 6 0 1.91.88 2.93 1.72 3.93 .32.37.65.76.95 1.21 .18.27.31.57.4.86H8v2h8v-2h-1.07c.1-.29.22-.59.4-.86 .3-.44.62-.83.94-1.2 .85-1 1.73-2.04 1.73-3.94 0-3.31-2.69-6-6-6m2.74 8.64c-.34.4-.72.84-1.08 1.38 -.43.64-.67 1.35-.81 1.97h-1.72c-.14-.62-.38-1.33-.81-1.97 -.37-.55-.75-1-1.09-1.4 -.75-.88-1.24-1.46-1.24-2.63 0-2.21 1.79-4 4-4s4 1.79 4 4c0 1.16-.5 1.75-1.26 2.64ZM11 4.25V6h2V2.5h-2ZM2.55 7.17L2 8l-.55.83 1.5 1 1.5 1L5 10l.55-.83 -1.5-1Zm4.28-3.72L6 4l-.83.55 1 1.5 1 1.5L8 7l.83-.55 -1-1.5Zm14.62 3.72l-1.5 1 -1.5 1L19 10l.55.83 1.5-1 1.5-1L22 8Zm-5.28-2.22l-1 1.5L16 7l.83.55 1-1.5 1-1.5L18 4l-.83-.55Z'/%3E%3C/svg%3E");
}

/* CAUTION: 경고 (#78242D / #FBF0F1) */
p.caution {
    color: #78242D;
    background-color: #FBF0F1;
}
/* 아이콘: Warning (라인 삼각형) */
p.caution::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg%3E%3Cpath d='M11 9h2v6h-2Zm0 8h2v2h-2Z'/%3E%3Cpath d='M12.87 2.51c-.35-.63-1.4-.63-1.75 0l-9.99 18c-.17.31-.17.69.01.99 .18.31.51.49.86.49h20c.35 0 .68-.19.86-.49v0c.17-.31.18-.69.01-.99ZM3.7 20L12 5.06 20.3 20Z'/%3E%3C/g%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg%3E%3Cpath d='M11 9h2v6h-2Zm0 8h2v2h-2Z'/%3E%3Cpath d='M12.87 2.51c-.35-.63-1.4-.63-1.75 0l-9.99 18c-.17.31-.17.69.01.99 .18.31.51.49.86.49h20c.35 0 .68-.19.86-.49v0c.17-.31.18-.69.01-.99ZM3.7 20L12 5.06 20.3 20Z'/%3E%3C/g%3E%3C/svg%3E");
}

/* PROMOTION: 프로모션/강조 (#002DFF / #E6EDFF) */
p.promotion {
    color: #002DFF;
    background-color: #E6EDFF;
}
/* 아이콘: Gift Box (선물상자) */
p.promotion::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 7h-1.21c.13-.41.21-.9.21-1.5C19 3.57 17.43 2 15.5 2c-1.62 0-2.7 1.48-3.4 3.09C11.41 3.58 10.27 2 8.5 2 6.57 2 5 3.57 5 5.5c0 .6.08 1.09.21 1.5H4c-1.1 0-2 .9-2 2v2c0 1.1.9 2 2 2v7c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2v-7c1.1 0 2-.9 2-2V9c0-1.1-.9-2-2-2m-4.5-3c.83 0 1.5.67 1.5 1.5C17 7 16.37 7 16 7h-2.48c.51-1.58 1.25-3 1.98-3M7 5.5C7 4.67 7.67 4 8.5 4c.89 0 1.71 1.53 2.2 3H8c-.37 0-1 0-1-1.5M4 9h7v2H4Zm2 11v-7h5v7Zm12 0h-5v-7h5Zm-5-9V9.08s.01-.06.02-.08H20v2Z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 7h-1.21c.13-.41.21-.9.21-1.5C19 3.57 17.43 2 15.5 2c-1.62 0-2.7 1.48-3.4 3.09C11.41 3.58 10.27 2 8.5 2 6.57 2 5 3.57 5 5.5c0 .6.08 1.09.21 1.5H4c-1.1 0-2 .9-2 2v2c0 1.1.9 2 2 2v7c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2v-7c1.1 0 2-.9 2-2V9c0-1.1-.9-2-2-2m-4.5-3c.83 0 1.5.67 1.5 1.5C17 7 16.37 7 16 7h-2.48c.51-1.58 1.25-3 1.98-3M7 5.5C7 4.67 7.67 4 8.5 4c.89 0 1.71 1.53 2.2 3H8c-.37 0-1 0-1-1.5M4 9h7v2H4Zm2 11v-7h5v7Zm12 0h-5v-7h5Zm-5-9V9.08s.01-.06.02-.08H20v2Z'/%3E%3C/svg%3E");
}