サンプル

<ul class="commonList">
<li>リスト</li>
<li>リスト</li>
<li>リスト</li>
</ul>

<ul class="commonList col2List">
<li>2カラム リスト</li>
<li>2カラム リスト</li>
<li>2カラム リスト</li>
<li>2カラム リスト</li>
</ul>

<ol>
<li>オーダーリスト</li>
<li>オーダーリスト</li>
<li>オーダーリスト</li>
</ol>

<p><a class="icon" href="#.pdf">pdfアイコン</a></p>
<p><a class="icon" href="#.doc(docx)">ワードアイコン</a></p>
<p><a class="icon" href="#.xls(xlsx)">エクセルアイコン</a></p>
<p><a href="#">別窓アイコン<span class="ico_blank"></span></a></p>
※PDF、ワード、エクセルのアイコンは自動で判別されます。

<p><strong>太字</strong></p>
<p class="textred">赤字</p>
<p class="textblue">青字</p>
<p><strong class="textblue">青太字</strong></p>

<p><a href="#" class="common_btn">ボタン</a></p>
<p class="taC"><a href="#" class="common_btn">ボタン</a></p>
<p class="taR"><a href="#" class="common_btn">ボタン</a></p>
<p class="taR"><a href="#" class="more_btn">VIEW MORE</a></p>

<p class="taL">ああああ（基本的には、何も指定しなければ左寄せになります）</p>
<p class="taR">いいいい</p>
<p class="taC">うううう</p>

<p class="taC"><img src="../images/second/dummy.png" alt=""></p>

<ul class="imgLine2 small">
<li><img src="../images/second/dummy.png" alt=""></li>
<li><img src="../images/second/dummy.png" alt=""></li>
</ul>

<ul class="imgLine3">
<li><img src="../images/second/dummy.png" alt=""></li>
<li><img src="../images/second/dummy.png" alt=""></li>
<li><img src="../images/second/dummy.png" alt=""></li>
</ul>

<ul class="imgLine4">
<li><img src="../images/second/dummy.png" alt=""></li>
<li><img src="../images/second/dummy.png" alt=""></li>
<li><img src="../images/second/dummy.png" alt=""></li>
<li><img src="../images/second/dummy.png" alt=""></li>
</ul>

<p class="imgInP"><span class="img right"><img src="../images/second/dummy.png" alt=""><span class="cap">画像のキャプション</span></span>テキスト</p>

<p class="imgInP sp_img_btm"><span class="img right"><img src="../images/second/dummy.png" alt=""><span class="cap">画像のキャプション　画像のキャプション</span></span><span class="text">テキスト</span></p>

<p class="imgInP"><span class="img left"><img src="../images/second/dummy.png" alt=""><span class="cap">画像のキャプション</span></span>テキスト</p>

<p class="imgInP sp_img_btm"><span class="img left"><img src="../images/second/dummy.png" alt=""><span class="cap">画像のキャプション　画像のキャプション</span></span><span class="text">テキスト</span></p>

<div class="twoCol">
<div class="txt">テキストテキストテキスト</div>
<div class="img"><img src="../images/second/dummy.png" alt=""><span class="cap">画像のキャプション</span></div>
</div>

<div class="twoCol">
<div class="img"><img src="../images/second/dummy.png" alt=""><span class="cap">画像のキャプション</span></div>
<div class="txt">テキストテキストテキスト</div>
</div>

<table class="commonTable">
<tr>
<th>中</th>
<td>中</td>
<td>中</td>
</tr>
<tr>
<th>中</th>
<td>中</td>
<td>中</td>
</tr>
</table>

<table class="commonTable">
<tr>
<th>中</th>
<th>中</th>
<th>中</th>
</tr>
<tr>
<td>中</td>
<td>中</td>
<td>中</td>
</tr>
</table>

<table class="commonTable">
<tr>
<th>th</th>
<th class="sub">subth</th>
<th class="sub">subth</th>
<th class="sub">subth</th>
</tr>
<tr>
<th>th</th>
<td>td</td>
<td>td</td>
<td>td</td>
</tr>
</table>

<span class="forSP scrolltext">&#10234; スクロールできます</span>
<div class="scrollTable">
<table class="commonTable">
<tr>
<th width="170">タイトル</th>
<td>テキストテキスト</td>
<td>テキストテキスト</td>
<td>テキストテキストテキストテキストテキストテキストテキスト</td>
</tr>
<tr>
<th>タイトル</th>
<td>テキストテキスト</td>
<td>テキストテキスト</td>
<td>テキストテキストテキストテキストテキストテキストテキスト</td>
</tr>
<tr>
<th>タイトル</th>
<td>テキストテキスト</td>
<td>テキストテキスト</td>
<td>テキストテキストテキストテキストテキストテキストテキスト</td>
</tr>
</table>
</div>

<span class="forSP scrolltext">&#10234; スクロールできます</span>
<div class="scrollTable">
<table class="commonTable">
<tr>
<th>タイトル</th>
<th>タイトル</th>
<th>タイトル</th>
<th>タイトル</th>
</tr>
<tr>
<td>テキストテキスト</td>
<td>テキストテキスト</td>
<td>テキストテキスト</td>
<td>テキストテキストテキストテキストテキストテキストテキスト</td>
</tr>
</table>
</div>

<div class="colorBox">
<span class="title">タイトル</span>
<p class="mT0">補足情報テキスト</p>
</div>

<div class="colorBox blue">
<span class="title">タイトル</span>
<p>補足情報テキスト</p>
</div>

<div class="colorBox round">
<p class="title">タイトルタイトル</p>
<p>補足情報テキスト</p>
</div>

<div class="common_dl_wrap">
<dl>
<dt>タイトル</dt>
<dd>テキストテキストテキストテキストテキストテキスト</dd>
</dl>
<dl>
<dt>タイトル</dt>
<dd>テキストテキストテキストテキストテキストテキスト</dd>
</dl>
</div>

<div class="borderBox">
<span class="title">タイトル</span>
<p>補足情報テキスト</p>
</div>

<div class="ytWrap">
<div class="ytWrap_inner">
<iframe width="100%" src="https://www.youtube.com/embed/02azSAMtZWU" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div>
</div>

<p class="anchor_title mT0">カテゴリーごとに見る</p>
<ul class="anchor_list">
<li><a href="#">お申込み</a></li>
<li><a href="#">挙式</a></li>
<li><a href="#">撮影</a></li>
<li><a href="#">ドレス・ヘアメイク</a></li>
<li><a href="#">ご参列者様へ</a></li>
</ul>

<div class="faq_wrap">
<dl>
<dt>質問が入ります。</dt>
<dd>回答が入ります。</dd>
</dl>
<dl>
<dt>質問が入ります。</dt>
<dd>回答が入ります。</dd>
</dl>
</div>