メール文例集

誕生日

「*|〇〇|*」の部分はカスタマイズしてご使用ください。
差し込みタグとして本文に挿入することも可能です。

件名

  • デザイン
  • コード
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<meta name="format-detection" content="telephone=no,address=no,email=no,date=no">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<meta name="copyright" content="*|自社名|*">
<!--[if mso]><meta http-equiv="X-UA-Compatible" content="IE=edge" /><![endif]-->
<title></title>
<style type="text/css" class="general">
.l-wrapper { margin: 30px 0; }
@media screen and (max-width: 480px) {
.body { font-size: 75%; }
.l-wrapper { margin: 0; }
.l-oneColumn { padding: 0; }
}
</style>

<style type="text/css" class="individual">
.s-overlay {
font-size: 40px;
margin-top: 187px;
}
.s-overlay span { font-size: 27px; }
@media screen and (max-width: 480px) {
.s-image {
height: 285px;
background: #ddd url('https://files.ecumerun.com/email-templates/promotion/anniversary/birthday/main_image.gif') no-repeat center center / auto 285px !important;
}
.s-overlay {
font-size: 30px !important;
margin-top: 135px !important;
}
.s-overlay span { font-size: 20px !important; }
}
</style>
</head>
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" bgcolor="#f2f2f2" class="body" style="font-family: YuGothic, 'Hiragino Kaku Gothic ProN', Meiryo, sans-serif; margin: 0 !important; padding: 0;">
<center class="l-wrapper" style="-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; padding: 0; table-layout: fixed; width: 100%;">
<div class="l-wrapperInner" style="margin: 0 auto; max-width: 640px;">
<!--[if mso]>
<table width="640" align="center">
<tr>
<td>
<![endif]-->
<table class="l-main" align="center" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF" style="background: #fff; border-collapse: collapse; border-spacing: 0; max-width: 680px; mso-table-lspace: 0; mso-table-rspace: 0;">
<tr>
<td style="background: #ddd url('https://files.ecumerun.com/email-templates/promotion/anniversary/birthday/main_image.gif') no-repeat center center; border-collapse: collapse; font-size: 0; mso-table-lspace: 0; mso-table-rspace: 0; vertical-align: top;" valign="top" align="center" bgcolor="#DDDDDD" height="380" class="s-image">
<!--[if mso]>
<v:rect xmlns:v="urn:schemas-microsoft-com:vml" style="width:640;height:380;" strokecolor="none">
<v:fill type="tile" color="#DDDDDD" src="https://files.ecumerun.com/email-templates/promotion/anniversary/birthday/main_image.gif" /></v:fill>
</v:rect>
<v:shape id="theText" style="position:absolute;width:640;height:380;">
<table border="0" width="640" cellpadding="0" cellspacing="0">
<tr><td style="font-size: 0;"><img src="https://files.ecumerun.com/email-templates/promotion/anniversary/birthday/spacer.gif" alt="" width="100%" height="185" border="0" class="spacer" /></td>
</tr>
<tr><td style="text-align: center; font-size: 40px; font-weight: bold; color: #954b13; line-height: 46px;">
<![endif]-->
<div class="s-overlay" style="color: #954b13; font-size: 40px; font-weight: bold; line-height: 46px; margin-top: 187px;">*|名前|*<span style="font-size: 27px;">さま</span></div>
<!--[if mso]>
</td></tr></table>
</v:shape>
<![endif]-->
</td>
</tr>
<tr>
<td class="l-oneColumn" style="border-collapse: collapse; mso-table-lspace: 0; mso-table-rspace: 0; padding: 0 15px;">
<table width="100%" cellpadding="0" cellspacing="0" style="border-collapse: collapse; border-spacing: 0; mso-table-lspace: 0; mso-table-rspace: 0;">
<tr>
<td class="u-center" style="border-collapse: collapse; mso-table-lspace: 0; mso-table-rspace: 0; text-align: center;">
<div class="s-title" style="color: #f44336; font-size: 190%; font-weight: bold; line-height: 1.25; margin: 29px 0 8px; text-align: center;">お誕生日おめでとうございます♪</div>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td class="l-oneColumn" style="border-collapse: collapse; mso-table-lspace: 0; mso-table-rspace: 0; padding: 0 15px;">
<!--[if mso]>
<table width="460" align="center">
<tr>
<td>
<![endif]-->
<table width="100%" cellpadding="0" cellspacing="0" class="s-columnInner" align="center" style="border-collapse: collapse; border-spacing: 0; max-width: 460px; mso-table-lspace: 0; mso-table-rspace: 0;">
<tr>
<td class="u-center" style="border-collapse: collapse; mso-table-lspace: 0; mso-table-rspace: 0; text-align: center;">
<p class="s-text" style="font-size: 100%; line-height: 1.5; margin: 16px 0 10px;">いつも○○○○○をご利用いただき、ありがとうございます。</p>
<p class="s-text" style="font-size: 100%; line-height: 1.5; margin: 16px 0 10px;">ささやかではございますが、お誕生日のお祝いとしてバースデープレゼントをお届けいたします。</p>
</td>
</tr>
</table>
<!--[if mso]>
</td>
</tr>
</table>
<![endif]-->
</td>
</tr>
<tr>
<td class="u-fullWidthImage s-garland--top" style="border-collapse: collapse; mso-table-lspace: 0; mso-table-rspace: 0; padding-top: 16px;">
<img src="https://files.ecumerun.com/email-templates/promotion/anniversary/birthday/garland.png" width="640" alt="" style="border: 0 none; height: auto; line-height: 1; max-width: 640px; outline: none; text-decoration: none; width: 100%;">
</td>
</tr>
<tr>
<td class="l-oneColumn" style="border-collapse: collapse; mso-table-lspace: 0; mso-table-rspace: 0; padding: 0 15px;">
<!--[if mso]>
<table width="460" align="center">
<tr>
<td>
<![endif]-->
<table width="100%" cellpadding="0" cellspacing="0" class="s-columnInner" align="center" style="border-collapse: collapse; border-spacing: 0; max-width: 460px; mso-table-lspace: 0; mso-table-rspace: 0;">
<td class="u-center" style="border-collapse: collapse; mso-table-lspace: 0; mso-table-rspace: 0; text-align: center;">
<!--[if mso]>
<table width="100%" cellpadding="0" cellspacing="0">
<tr>
<td style="font-size: 0;"><img src="https://files.ecumerun.com/email-templates/promotion/anniversary/birthday/spacer.gif" alt="" width="1" height="25" border="0" class="spacer" /></td>

</tr>
<tr>
<td bgcolor="#f44336" style="color: #fff; font-weight: bold; font-size: 130%; text-align: center; padding: 20px; background: #f44336;">
<![endif]-->
<a class="s-button" href="https://www" title="バースデープレゼントはこちら" target="_blank" style="background: #f44336; border-radius: 6px; color: #fff; display: block; font-size: 130%; font-weight: bold; line-height: 1.5; margin: 24px auto 0; max-width: 420px; padding: 20px; text-align: center; text-decoration: none;">バースデープレゼントはこちら</a>
<!--[if mso]>
</td>
</tr>
</table>
<![endif]-->
<p class="s-small" style="color: #757575; font-size: 88%; line-height: 1.25; margin: 28px 0 18px;">*|名前|*様のお誕生日【*|MM月DD日|*】から 1 週間有効です。<br>お買いあげ時に、上記 URL からアクセスした画面をスタッフにお見せください。<br>その他の割引クーポンとの併用はできません。</p>
</td>
</table>
<!--[if mso]>
</td>
</tr>
</table>
<![endif]-->
</td>
</tr>
<tr>
<td class="u-fullWidthImage s-garland--bottom" style="border-collapse: collapse; mso-table-lspace: 0; mso-table-rspace: 0; padding: 5px 0 10px;">
<img src="https://files.ecumerun.com/email-templates/promotion/anniversary/birthday/garland.png" width="640" alt="" style="border: 0 none; height: auto; line-height: 1; max-width: 640px; outline: none; text-decoration: none; width: 100%;">
</td>
</tr>
<tr>
<td class="l-oneColumn" style="border-collapse: collapse; mso-table-lspace: 0; mso-table-rspace: 0; padding: 0 15px;">
<!--[if mso]>
<table width="460" align="center">
<tr>
<td>
<![endif]-->
<table width="100%" cellpadding="0" cellspacing="0" class="s-columnInner" align="center" style="border-collapse: collapse; border-spacing: 0; max-width: 460px; mso-table-lspace: 0; mso-table-rspace: 0;">
<tr>
<td class="u-center" style="border-collapse: collapse; mso-table-lspace: 0; mso-table-rspace: 0; text-align: center;">
<p class="s-text" style="font-size: 100%; line-height: 1.5; margin: 16px 0 10px;">*|名前|*様のご来店を、スタッフ一同こころよりお待ちしております。<br>そして、最高に素敵な 1 年になりますように。</p>
</td>
</tr>
</table>
<!--[if mso]>
</td>
</tr>
</table>
<![endif]-->
</td>
</tr>
<tr>
<td class="u-fullWidthImage" style="border-collapse: collapse; mso-table-lspace: 0; mso-table-rspace: 0;">
<img src="https://files.ecumerun.com/email-templates/promotion/anniversary/birthday/footer_03.png" width="640" alt="" style="border: 0 none; height: auto; line-height: 1; max-width: 640px; outline: none; text-decoration: none; width: 100%;">
</td>
</tr>
<tr>
<td class="l-copyright s-copyright" style="background: #f2f2f2; border-collapse: collapse; mso-table-lspace: 0; mso-table-rspace: 0;">
<table width="100%" cellpadding="0" cellspacing="0" style="border-collapse: collapse; border-spacing: 0; mso-table-lspace: 0; mso-table-rspace: 0;">
<tr>
<td style="border-collapse: collapse; mso-table-lspace: 0; mso-table-rspace: 0;">
<p style="font-size: 81.25%; margin: 10px 0; text-align: center;">*|自社名|* &copy; 2017</p>
</td>
</tr>
</table>
</td>
</tr>
</table>
<!--[if mso]>
</td>
</tr>
</table>
<![endif]-->
</div>
</center>
</body>
</html>