<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <script th:inline="javascript">

    </script>
    <style>
        @font-face {
            font-family: "Nanum Gothic";
            font-style: normal;
            font-weight: 400;
            src: url("https://www.a-rms.net/reference/light-blue/css/font/NanumGothic/nanum-gothic-v11-latin_korean-regular.eot"); /* IE9 Compat Modes */
            src: local("NanumGothic"),
            url("https://www.a-rms.net/reference/light-blue/css/font/NanumGothic/nanum-gothic-v11-latin_korean-regular.eot?#iefix")
            format("embedded-opentype"),
                /* IE6-IE8 */ url("https://www.a-rms.net/reference/light-blue/css/font/NanumGothic/nanum-gothic-v11-latin_korean-regular.woff2")
            format("woff2"),
                /* Super Modern Browsers */
            url("https://www.a-rms.net/reference/light-blue/css/font/NanumGothic/nanum-gothic-v11-latin_korean-regular.woff") format("woff"),
                /* Modern Browsers */
            url("https://www.a-rms.net/reference/light-blue/css/font/NanumGothic/nanum-gothic-v11-latin_korean-regular.ttf")
            format("truetype"),
                /* Safari, Android, iOS */
            url("https://www.a-rms.net/reference/light-blue/css/font/NanumGothic/nanum-gothic-v11-latin_korean-regular.svg#NanumGothic")
            format("svg"); /* Legacy iOS */
        }

        html,
        body {
            font-family: "Nanum Gothic" !important;
        }

        .gradient_middle_border {
            border-bottom: 1px solid transparent;
            border-image: linear-gradient(0.25turn, rgb(0 0 0 / 0%), #c3c3c3, rgb(0 0 0 / 0%));
            border-image-slice: 1;
        }
        .font13 {
            font-family: "Nanum Gothic" !important;
            font-size: 13px;
            color: #f8f8f8;
        }

        /*--------------------------------------------------------------
        # 버튼 에니메이션
        --------------------------------------------------------------*/
        .more {
            display: inline-block;
            border: 1px solid rgba(255, 255, 255, 0.3);
            letter-spacing: 0;
            z-index: 1;
            position: relative;
            margin-top: 10px;
            color: #fff;
            font-size: 13px;
        }

        .animated-button1 {
            display: inline-block;
            -webkit-transform: translate(0%, 0%);
            transform: translate(0%, 0%);
            overflow: hidden;
            color: #fff;
            font-size: 12px;
            text-decoration: none;
        }

        .animated-button1::before {
            content: "";
            position: absolute;
            top: 0px;
            left: 0px;
            width: 100%;
            height: 100%;
            background-color: #8593ad;
            opacity: 0;
            -webkit-transition: 0.2s opacity ease-in-out;
            transition: 0.2s opacity ease-in-out;
        }

        .animated-button1 span {
            position: absolute;
        }

        @keyframes animateTop {
            0% {
                -webkit-transform: translateX(100%);
                transform: translateX(100%);
            }

            100% {
                -webkit-transform: translateX(-100%);
                transform: translateX(-100%);
            }
        }

        .animated-button1 span:nth-child(1) {
            top: 0px;
            left: 0px;
            width: 100%;
            height: 1px;
            background: -webkit-gradient(linear, right top, left top, from(rgba(43, 8, 8, 0)), to(#fff));
            background: linear-gradient(to left, rgba(43, 8, 8, 0), #fff);
            -webkit-animation: 2s animateTop linear infinite;
            animation: 2s animateTop linear infinite;
        }

        @keyframes animateRight {
            0% {
                -webkit-transform: translateY(100%);
                transform: translateY(100%);
            }

            100% {
                -webkit-transform: translateY(-100%);
                transform: translateY(-100%);
            }
        }

        .animated-button1 span:nth-child(2) {
            top: 0px;
            right: 0px;
            height: 100%;
            width: 1px;
            background: -webkit-gradient(linear, left bottom, left top, from(rgba(43, 8, 8, 0)), to(#fff));
            background: linear-gradient(to top, rgba(43, 8, 8, 0), #fff);
            -webkit-animation: 2s animateRight linear -1s infinite;
            animation: 2s animateRight linear -1s infinite;
        }

        @keyframes animateBottom {
            0% {
                -webkit-transform: translateX(-100%);
                transform: translateX(-100%);
            }

            100% {
                -webkit-transform: translateX(100%);
                transform: translateX(100%);
            }
        }

        .animated-button1 span:nth-child(3) {
            bottom: 0px;
            left: 0px;
            width: 100%;
            height: 1px;
            background: -webkit-gradient(linear, left top, right top, from(rgba(43, 8, 8, 0)), to(#fff));
            background: linear-gradient(to right, rgba(43, 8, 8, 0), #fff);
            -webkit-animation: 2s animateBottom linear infinite;
            animation: 2s animateBottom linear infinite;
        }

        @keyframes animateLeft {
            0% {
                -webkit-transform: translateY(-100%);
                transform: translateY(-100%);
            }

            100% {
                -webkit-transform: translateY(100%);
                transform: translateY(100%);
            }
        }

        .animated-button1 span:nth-child(4) {
            top: 0px;
            left: 0px;
            height: 100%;
            width: 1px;
            background: -webkit-gradient(linear, left top, left bottom, from(rgba(43, 8, 8, 0)), to(#fff));
            background: linear-gradient(to bottom, rgba(43, 8, 8, 0), #fff);
            -webkit-animation: 2s animateLeft linear -1s infinite;
            animation: 2s animateLeft linear -1s infinite;
        }


        @media only screen and (max-width: 480px) {
            .oEQ55c {
                width: 100% !important;
            }

            .zhwgeb {
                width: auto !important;
            }

            .MHCHNe {
                max-width: 100% !important;
            }

        }
    </style>
</head>
<body>
<div dir="ltr">
    <table style="background-color:#404249;padding:0 20px!important" role="presentation" width="100%" border="0" cellspacing="0" cellpadding="0">
        <tbody>
        <tr>
            <td align="center" valign="top" width="800">
                <table width="800" border="0" cellspacing="0" cellpadding="0"
                       style="width:100%;max-width:800px;min-width: 600px;background-color:#404249" bgcolor="#404249"
                       role="presentation">
                    <tbody>
                    <tr>
                        <td>
                            <!-- 로고 영역 -->
                            <table width="100%" border="0" cellspacing="0" cellpadding="0" role="presentation">
                                <tbody>
                                <tr>
                                    <td>
                                        <table align="center" border="0" cellpadding="0" cellspacing="0"
                                               role="presentation" style="border-collapse:collapse; background:#404249; background-color:#404249;width:100%" width="100%">
                                            <tbody>
                                            <tr>
                                                <td align="center" style="border-collapse:collapse;font-size:0;padding:26px 20px;word-break:break-word">
                                                    <img src="https://www.a-rms.net/arms/img/313A-RMS_LOGO_wh_drop.png"
                                                         alt="A-RMS Logo" height="150"
                                                         style="-ms-interpolation-mode: bicubic; display: block; width: auto; height: auto; max-height: 150px; outline: none; text-decoration: none;">
                                                </td>
                                            </tr>
                                            </tbody>
                                        </table>
                                    </td>
                                </tr>
                                </tbody>
                            </table>

                            <!-- POC 알림 헤더 -->
                            <div style="width: 100%; float: left; box-sizing: border-box;">
                                <section style="margin-bottom: 15px; background: rgba(51, 51, 51, 0.425); border-radius: 0.25rem; padding: 15px;">
                                    <header style="margin-bottom: 15px;">
                                        <div style="font-family: 'Nanum Gothic', Arial, sans-serif; font-size: 24px; line-height: 1.4; letter-spacing: 0; text-align: center; color: #ffc107; font-weight: bold;">
                                            🔔 새로운 POC 신청이 접수되었습니다
                                        </div>
                                    </header>
                                </section>
                            </div>

                            <!-- POC 신청 정보 -->
                            <div style="width: 100%; float: left; box-sizing: border-box;">
                                <section style="margin-bottom: 15px; background: rgba(51, 51, 51, 0.425); border-radius: 0.25rem; padding: 15px;">
                                    <header style="margin-bottom: 15px;">
                                        <div style="font-family: 'Nanum Gothic', Arial, sans-serif; font-size: 20px; line-height: 1.4; text-align: left; color: #f8f8f8;">
                                            <span style="font-weight: bold;">📋 신청자 정보</span>
                                        </div>
                                    </header>

                                    <div style="border-bottom: 1px solid #c3c3c3; background: linear-gradient(to right, rgba(0, 0, 0, 0), #c3c3c3, rgba(0, 0, 0, 0)); height: 1px; margin-bottom: 10px;"></div>

                                    <div style="margin: 10px 0; background: rgba(51, 51, 51, 0.425); border-radius: 3px; padding: 15px;">
                                        <table style="width: 100%; color: #f8f8f8; font-family: 'Nanum Gothic', Arial, sans-serif; font-size: 14px;">
                                            <tr style="height: 35px;">
                                                <td style="width: 30%; padding: 8px; color: #a4c6ff; font-weight: bold;">회사명</td>
                                                <td style="padding: 8px;" th:text="${pocEntity.c_poc_company_name}">회사명</td>
                                            </tr>
                                            <tr style="height: 35px; background: rgba(0, 0, 0, 0.1);">
                                                <td style="padding: 8px; color: #a4c6ff; font-weight: bold;">신청자</td>
                                                <td style="padding: 8px;" th:text="${pocEntity.c_poc_full_name}">신청자명</td>
                                            </tr>
                                            <tr style="height: 35px;">
                                                <td style="padding: 8px; color: #a4c6ff; font-weight: bold;">직책</td>
                                                <td style="padding: 8px;" th:text="${pocEntity.c_poc_job_title}">직책</td>
                                            </tr>
                                            <tr style="height: 35px; background: rgba(0, 0, 0, 0.1);">
                                                <td style="padding: 8px; color: #a4c6ff; font-weight: bold;">이메일</td>
                                                <td style="padding: 8px;">
                                                    <a th:href="'mailto:' + ${pocEntity.c_poc_email_address}"
                                                       th:text="${pocEntity.c_poc_email_address}"
                                                       style="color: #ffc107; text-decoration: none;">이메일</a>
                                                </td>
                                            </tr>
                                            <tr style="height: 35px;">
                                                <td style="padding: 8px; color: #a4c6ff; font-weight: bold;">연락처</td>
                                                <td style="padding: 8px;" th:text="${pocEntity.c_poc_contact_number}">연락처</td>
                                            </tr>
                                            <tr style="height: 35px; background: rgba(0, 0, 0, 0.1);">
                                                <td style="padding: 8px; color: #a4c6ff; font-weight: bold;">국가</td>
                                                <td style="padding: 8px;" th:text="${pocEntity.c_poc_country}">국가</td>
                                            </tr>
                                            <tr style="height: 35px;">
                                                <td style="padding: 8px; color: #a4c6ff; font-weight: bold;">회사 규모</td>
                                                <td style="padding: 8px;" th:text="${pocEntity.c_poc_company_size}">회사 규모</td>
                                            </tr>
                                        </table>
                                    </div>
                                </section>
                            </div>

                            <!-- POC 문의 내용 -->
                            <div style="width: 100%; float: left; box-sizing: border-box;">
                                <section style="margin-bottom: 15px; background: rgba(51, 51, 51, 0.425); border-radius: 0.25rem; padding: 15px;">
                                    <header style="margin-bottom: 15px;">
                                        <div style="font-family: 'Nanum Gothic', Arial, sans-serif; font-size: 20px; line-height: 1.4; text-align: left; color: #f8f8f8;">
                                            <span style="font-weight: bold;">💬 문의 내용</span>
                                        </div>
                                    </header>

                                    <div style="border-bottom: 1px solid #c3c3c3; background: linear-gradient(to right, rgba(0, 0, 0, 0), #c3c3c3, rgba(0, 0, 0, 0)); height: 1px; margin-bottom: 10px;"></div>

                                    <div style="margin: 10px 0; background: rgba(51, 51, 51, 0.425); border-radius: 3px; padding: 15px;">
                                        <div style="margin-bottom: 15px;">
                                            <span style="color: #a4c6ff; font-weight: bold; font-family: 'Nanum Gothic', Arial, sans-serif; font-size: 14px;">문의 사유:</span>
                                            <span style="color: #ffc107; font-weight: bold; font-family: 'Nanum Gothic', Arial, sans-serif; font-size: 16px; margin-left: 10px;"
                                                  th:text="${pocEntity.c_poc_inquiry_reason}">문의 사유</span>
                                        </div>

                                        <div style="padding: 15px; background: rgba(0, 0, 0, 0.2); border-radius: 3px; border-left: 3px solid #ffc107;">
                                            <p style="color: #f8f8f8; font-family: 'Nanum Gothic', Arial, sans-serif; font-size: 14px; line-height: 1.6; margin: 0;"
                                               th:text="${pocEntity.c_poc_inquiry_content}">문의 내용</p>
                                        </div>
                                    </div>
                                </section>
                            </div>

                            <!-- 액션 버튼 -->
                            <div style="width: 100%; float: left; box-sizing: border-box; text-align: center; margin: 20px 0;">
                                <a href="https://www.a-rms.net/cover/template.html?page=pocAdmin"
                                   style="display: inline-block; padding: 15px 40px; background: #4179CF; color: #ffffff; text-decoration: none; border-radius: 5px; font-family: 'Nanum Gothic', Arial, sans-serif; font-size: 16px; font-weight: bold;">
                                    A-RMS POC 관리 시스템 바로가기
                                </a>
                            </div>

                            <!-- 푸터 -->
                            <div style="width: 100%; float: left; box-sizing: border-box; margin-top: 30px;">
                                <div style="text-align: center; padding: 20px; border-top: 1px solid #555; color: #999; font-family: 'Nanum Gothic', Arial, sans-serif; font-size: 12px;">
                                    <p>이 메일은 A-RMS POC 신청 알림 메일입니다.</p>
                                    <p style="margin-top: 10px;">© 2024 313 DEVGRP. All rights reserved.</p>
                                </div>
                            </div>
                        </td>
                    </tr>
                    </tbody>
                </table>
            </td>
        </tr>
        </tbody>
    </table>
</div>
</body>
</html>