Screen

h1 要素

  • h1の中ですべて同じスタイルなら h1.c-heading だけ
  • 2種スタイルなら .c-text と .c-highlight
  • 3種なら .c-text と .c-highlight に加えて .c-medium
  • おまけ、用途にあわせて .c-pre, .c-medium, .c-sub
<h1 class="c-heading">
  <span class="c-pre">.c-pre</span>
  <span class="c-text">.c-text</span>
  <span class="c-medium">.c-medium</span>
  <span class="c-highlight">.c-highlight</span>
  <span class="c-sub">.c-sub</span>
  <span class="c-link">.c-link 途中にリンク</span>
</h1>

section-visual-a

  • 左右背景、画面いっぱい
  • 左右背景、画面いっぱい

或る日例のごとく吾輩と
黒は暖かい茶畠ちゃばた中で寝転
純粋の黒猫中で寝転 車屋の黒はこの近辺で知らぬ


.section-visual-b

  • 背景色全面、窓幅いっぱい

竹垣が破れていなかったなら雨が降って 吾輩は再びお


.section-visual-b 背景グラデーション

  • 背景色全面、窓幅いっぱい

コーヒー


.section-visual-c

  • 背景仕様
  • .p-main 左側にメインエリア、透明の背景色
  • .p-sub 右の空いているスペースに画像(座標指定)
  • .p-sub の画像が飛び出るときは .type-out-of-bounds


コーヒー

  • 特徴サンプルサンプル
  • 特徴サンプルサンプルサンプル
  • 特徴サンプルサンプル
  • 特徴サンプルサンプルサンプル

.section-visual-d

  • 背景仕様
  • 左右半分ずつ、透明の背景色 (.c-bg-01, .c-bg-02)

コーヒー

コロンビア
グァテマラ

.section-visual-e

  • 背景 .bg-ut-gray.type-pale
  • 左右のエリアは.grid-utで .type-3to2
  • 右がメイン .unit-ut.p-main

かっこうのヴァイオリンをなおる

さっきは穴のおかげのそのいっしょをかっこうのヴァイオリンをなおるや虎がやるたまし。


.section-visual-どれでも とびでる背景柄

  • xxx

吾輩は人間と同居して彼等を観察すればするほど

ところがそこの家うちの書生が三日目にそいつを裏の池へ持って行って四疋ながら棄てて来たそうだ。白君は涙を流してその一部始終を話した上


.section-visual-e かこまれ

  • xxx

のいっしょをかっこうのヴァイオリンをなおるや虎がやる


.section-visual-e かこまれ2

  • xxx

FREE English Online
consultation is available!

さて邸やしきへは忍び込んだもののこれから先どうして善いいか分らない。そのうちに暗くなる、腹は減る、寒さは寒し、雨が降って来る


.section-visual-e かこまれ3

  • xxx

How it works

Ordering

Lorem ipsum dolor sit amet, consectetur
adipiscing elit, sed do eiusmod tempor incididunt ut labore


.section-visual-f

  • 画像 .c-bg-01 が左側に飛び出る
  • メインは右側 .p-main

玉手箱 左にある画像は左に飛び出ている

  • どこでも受け取り
  • 自在なプラン
  • 期間も選べる
  • サポートも充実

.section-visual-g

  • 背景仕様
  • 背景写真。わりと自由

.pic-ut-arrange-parts

  • 画像の上に部品を配置

.section-visual-h

前見出し .heading-ut-pre

かっこうのヴァイオリン

さて邸やしきへは忍び込んだもののこれから先どうして善いいか分らない。そのうちに暗くなる、腹は減る、寒さは寒し、雨が降って来る

3,500
(税込 3,850円)