動作確認：IE6-9、Firefox、Safari、Opera、SoftBank

お遊びテンプレートですがCSS多いです…。改行を<br>に変換「しない」です。
IE6ではメニューが表示されないため非対応。IE7はメニューの文字が下に出ずに重なります。背景画像の写真はIE8以下では表示しません。斜めのハイライトはIE9以下では表示しません。
全部フルで表示できたときはこうなります。[Firefoxでの見本]

スマホでは幅480px以上、かつ高さ800px以上のとき、PCでは幅320px以上、高さ550px以上のときにスマホ風の画面になります。
高さ制限は広告が下の場合を考慮してのことなので、広告を上にしていて高さの制限は必要ない方は、HEADにある
@media screen and (max-width:480px) , screen and (max-height:800px) {（略）
@media screen and (max-width:320px) , screen and (max-height:550px) {（略）
の赤字部分を削除してください。
でも作った人としてもちょっと不安なので広告上推奨。

あくまでもスマホ「っぽい」なので画面上のアイコン（リンク）にハイライトがかかってないとかには目を瞑っていただけると嬉しいです…（ハイライトを上にかけるとリンクがクリックできなくなるため）
中がスクロールしないので内容の少ないページにしか使えません。

メニュー部分のリンクにはid属性が指定されているので、独自タグではなくリンク先URLを入れてください。独自タグが「page3_リンク文字」であれば/ID/page/3/がリンク先URLになります。

素材は自作と再配布可のフリー素材を切り抜いたものとフリーフォント（SIL OPEN FONT LICENSE）です。
写真素材：フリー素材タウンさま（http://sozai.yutorilife.com/）
フォント：PulsarJS(http://xperiments.es/blog/en/free-pulsarjs-fontface-iconfont/)
斜めのピンストライプはご自由にどうぞ。
説明が長くてごめんなさい。