サンプルページ
.ff-lato
.ff-lato.fw-bold
.ff-lato-italic
.ff-lato-italic.fw-bold
ABOUT US
株式会社友和会について
COMPANY
会社概要
CONSULTATION
地域の皆様のご相談お待ちしております
https://www.yuuwakai.co.jp/recruit/entry/?kinds=求人への応募&occupation=事務職
https://www.yuuwakai.co.jp/wp-content/themes/yuuwakai/assets/images
https://www.yuuwakai.co.jp/wp-content/themes/yuuwakai
Bootstrap
Build fast, responsive sites with Bootstrap
Currently v5.1.3
home.php
文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文
文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文
文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文
文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文文字文字文字
文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文字文文字文字文字
文字文字文字文文字
文字文字文
文字文字文字文文字
文字文字文
文字文字文字文文字
文字文字文
文字文字文字文文字
文字文字文
Title
p fs-16
<p></p>
Container
Link color & target="_new"
<a href="https://getbootstrap.com/" target="_new" rel="noopener">https://getbootstrap.com/</a>Color
.text-default
.text-main
.text-accent
$default-text: #212121;
$mainColor: #692326;Font Family
.ff-gothic 游ゴシック
.ff-mincyo 游明朝体
Font Weight
Bold text.
Bolder weight text (relative to the parent element).
Semibold weight text.
Medium weight text.
Normal weight text.
Light weight text.
Lighter weight text (relative to the parent element).
Italic text.
Text with normal font style
Regular weight text. .fw-regular
Demibold weight text. .fw-demibold
Web Font
ff-futura fw-light Futura PT (Typekit)[Light]
ff-futura fw-normal Futura PT (Typekit)[Book]
ff-futura fw-medium Futura PT (Typekit)[Medium]
ff-futura fw-bold Futura PT (Typekit)[Bold]
Line Height
Anchor Link img-max.lh-season fs-14 ホテルの一流シェフたちが自信をもって贈る多彩な料理。うれしい「飲み放題」の特典も付いたお得なプラン。
.lh-season fs-14 mincyo 熊本ホテルキャッスルでは、
おすすめご宿泊プランをご用意しております。
//フォントサイズ+10px
.lh-season{
line-height: calc(1em + #{10 / $font-size-root-num}rem);
}Reset color
reset link.
Muted text with a reset link.
<p class="text-danger">
<a href="#" class="text-decoration-underline">reset link</a>.<br>
Muted text with a <a href="#" class="text-reset text-decoration-underline">reset link</a>.
</p>Text decoration
This text has a line underneath it.
This text has a line going through it.
<p class="text-decoration-underline">This text has a line underneath it.</p>
<p class="text-decoration-line-through">This text has a line going through it.</p>
<a href="#" class="">This link has its text decoration removed</a>
<a href="#" class="td-hover-underline">This link has its hover text decoration</a>
<a href="#" class="text-decoration-underline">This link has its text decoration removed</a>Inview
no class data-inview
.inview-up data-inview
.inview-left data-inview
.inview-right data-inview
.inview-blocks data-inview span.char
.inview-lettering data-inview data-lettering
data-inview data-shuffle
お客様とのご縁に、心より感謝。
<h2 class="" data-inview>no class data-inview</h2>
<h2 class="inview-up" data-inview>.inview-up data-inview</h2>
<h2 class="inview-left" data-inview>.inview-left data-inview</h2>
<h2 class="inview-right" data-inview>.inview-right data-inview</h2>
<h2 class="inview-blocks" data-inview><span class="char">.inview-blocks data-inview span.char</span></h2>
<h2 class="inview-lettering" data-inview data-lettering>.inview-lettering data-inview data-lettering</h2>
<h2 class="" data-inview data-shuffle>data-inview data-shuffle</h2>