textcolor.cssの記述内容とカスタマイズ

@charset "Shift_JIS";

/*テキスト、カラー他装飾関連の定義のスタイルシート

※bodyのカラーはcommon.cssで設定します。

■目次：

・リンクカラーの設定
・テキストカラーの設定
・テキストサイズの設定
・テキストの配置
・リンク時装飾
・リスト装飾
・表組
・フォーム
・装飾box

/*---------------icon設定---------------*/

.icon {
vertical-align:middle;
}

/*---------------リンクカラーの設定---------------*/

a:link {
color: #0066FF;
text-decoration: underline;
}

a:visited {
color: #0066FF;
text-decoration: underline;
}

a:hover {
color:#FF0000;
text-decoration: underline;
}

a:active {
color: #333333;
text-decoration: underline;
}
#hnavi a{
text-decoration:none;
}

/*---------------テキストカラーの設定---------------*/

.txt-attention {
color: #FF0000;
}
.attention {
color: #FF0000;
font-weight:bold;
}

.txt-emphasis {
color: #FF6600;
}
.txt-form_att {
color: #0066CB;
}

/*---------------テキストサイズの設定---------------*/

.txt-large {
font-size: 1.2em;
}

.txt-small {
font-size: 0.85em;
}

/*---------------テキストの配置---------------*/

.txt-center {
text-align: center;
}

.txt-right {
text-align: right;
}

/*---------------リンク時装飾---------------*/
.link01{
padding:0 0 0 15px;
background:url(http://ark.under.jp/le-arche/html5/image/p_ya-gray.gif) no-repeat;
}
a.link01:hover {
background:url(http://ark.under.jp/le-arche/html5/image/p_ya-gray_hv.gif) no-repeat;
color:#000000;
}

.link02{
padding:0 0 0 15px;
background:url(http://ark.under.jp/le-arche/html5/image/p_ya-gray2.gif) no-repeat;
}
a.link02:hover {
background:url(http://ark.under.jp/le-arche/html5/image/p_ya-gray2_hv.gif) no-repeat;
color:#000000;
}

/*---------------リスト装飾---------------*/

ul, ul li{
margin:0;
padding:0;
list-style:none;
}

/* 白丸 */
ul.common-ul-circle {
margin:5px 0 8px;
padding:0;
}
ul.common-ul-circle li{
background: url(http://ark.under.jp/le-arche/html5/image/p_circle.jpg) no-repeat left top;
padding: 0px 0px 3px 20px;
line-height:1.4;
}
/* 黒丸 */
ul.common-ul-disc {
margin:5px 0 8px;
padding:0;
}
ul.common-ul-disc li{
background: url(http://ark.under.jp/le-arche/html5/image/p_disc.gif) no-repeat left top;
padding: 0px 0px 3px 20px;
line-height:1.4;
}
/* インデント */
ul.common-ul-indent {
margin:5px 0 8px;
padding:0;
}
ul.common-ul-indent li{
padding: 0px 0px 3px 20px;
line-height:1.4;
}

/* 算用数字 */
ol.common-ol-decimal {
margin:5px 0 8px;
padding:0;
list-style-type:decimal;
list-style-position: outside;
}
ol.common-ol-decimal li{
padding:0 0 3px;
margin:0 0 0 1.5em;
line-height:1.4;
}

/* アルファベット */
ol.common-ol-alpha {
margin:5px 0 8px ;
padding:0;
list-style-type:lower-alpha;
list-style-position: outside;
}
ol.common-ol-alpha li {
padding:0 0 3px;
margin:0 0 0 1.5em;
line-height:1.4;
}

/* アルファベット（大） */
ol.common-ol-alpha_up {
margin:5px 0 8px ;
padding:0;
list-style-type:upper-alpha;
list-style-position: outside;
}
ol.common-ol-alpha_up li {
padding:0 0 3px;
margin:0 0 0 1.5em;
line-height:1.4;
}

/* liのIE6-7対策 */
*:first-child+html ol.common-ol-decimal li, *:first-child+html ol.common-ol-alpha li,
*:first-child+html ol.common-ol-alpha_up li {
margin:0 0 0 2em;
}

* html ol.common-ol-decimal li, * html ol.common-ol-alpha li,
* html ol.common-ol-alpha_up li {
margin:0 0 0 2em;
}

/* リスト内のリスト */
ol.common-ol-decimal li ol.common-ol-alpha,
ol.common-ol-decimal li ol.common-ol-alpha_up,
ol.common-ol-decimal li ul.common-ul-indent {
margin:3px 0 0px ;
}

/* 横並びリスト */
ul.common-ul-float {
margin:5px 10px 8px;
padding:0;
}
ul.common-ul-float li{
padding: 0px 8px 3px;
margin:0;
line-height:1.4;
float:left;
}
/* liのIE6対策 */
* html ul.common-ul-float li{
padding: 0px 4px 3px;
}

#main-2nd ol.sidemgn, #main-2nd ul.sidemgn {
margin-left:15px;
}

/* 定義リスト */

.common-dl, .common-dl-list {
margin: 0px 10px;
}
.common-dl dt{
padding: 5px 0px 3px;
clear: both;
float:none;
line-height:1.4;
}
.common-dl dd{
padding-left: 8px;
padding-bottom: 5px;
line-height:1.4;
clear: both;
float:none;
}
.common-dl dl {
width:770px;
}
.common-dl dl dt, .common-dl-list dt{
font-weight: normal;
padding: 2px 0px;
width: 70px;
float: left;
clear: none;
}
.common-dl dl dd, .common-dl-list dd{
width: 690px;
float: right;
padding: 2px 0px;
clear: none;
}

.common-dl-list dt{
font-weight: normal;
padding: 2px 0px;
width: 50px;
float: left;
clear: none;
text-align:right;
line-height:1.4;
}
.common-dl-list dd{
width: 720px;
float: right;
padding: 2px 0px;
clear: none;
line-height:1.4;
}
.common-dl dl dd.f-clear, .common-dl-list dd.f-clear {
width:770px;
line-height:0;
height:1px;
margin:0;
padding:0;
font-size:1px;
float:none;
clear:both;
}

.common-dl .common-dl-list2 dt{
font-weight: normal;
padding: 2px 0px;
width: 20px;
float: left;
clear: none;
text-align:right;
line-height:1.4;
}
.common-dl .common-dl-list2 dd{
width: 730px;
float: right;
padding: 2px 0px;
clear: none;
line-height:1.4;
}
.common-dl .common-dl-list2 dd.f-clear {
width:750px;
line-height:0;
height:1px;
margin:0;
padding:0;
float:none;
clear:both;
font-size:1px;
}

.common-dl .common-dl-list2 dd dl.common-dl2 {
width: 720px;
}
.common-dl .common-dl-list2 dd dl.common-dl2 dt{
width: 700px;
float: none;
clear: both;
text-align:left;
padding: 0;
margin:5px 0 0;
}
.common-dl .common-dl-list2 dd dl.common-dl2 dd{
width: 700px;
padding: 0;
margin:0 0 0 1em;
float: none;
clear: both;
}

.common-dl .common-dl-list2 dd dl.common-dl-list3 {
width: 720px;
}
.common-dl .common-dl-list2 dd dl.common-dl-list3 dt {
width: 30px;
}
.common-dl .common-dl-list2 dd dl.common-dl-list3 dd {
width: 680px;
}
.common-dl .common-dl-list2 dd dl.common-dl-list3 dd.f-clear {
width:720px;
}

/*---------------表組---------------*/

table.table-normal {
margin: 8px 5px;
width: 790px;
border: 1px solid #DEDEDE;
padding: 0;
border-collapse:collapse;
}

.table-normal caption, .table-normal2 caption, .table-normal3 caption, .table-form caption {
text-align: left;
padding: 0 0 3px 5px;
}
.table-normal th, .table-normal2 th, .table-normal3 th, .table-form th {
background: #EDEDED;
border: 1px solid #DDDDDD;
padding: 5px 8px;
line-height:1.4;
}

.table-normal td, .table-normal2 td, .table-normal3 td, .table-form td {
border: 1px solid #DDDDDD;
padding: 5px 8px;
line-height:1.4;
}
table.table-normal2 {
margin: 8px 5px;
border: 1px solid #DEDEDE;
padding: 0;
border-collapse:collapse;
width: 380px;
}
table.table-normal3 {
margin: 8px 5px;
border: 1px solid #DEDEDE;
padding: 0;
border-collapse:collapse;
width: 170px;
}
.table-normal th.th-large, .table-normal2 th.th-large, .table-normal3 th.th-large {
background: #666666;
color: #FFFFFF;
}

table.table-form {
margin: 8px auto;
width: 600px;
border: 1px solid #DEDEDE;
padding: 0;
border-collapse:collapse;
}

/* 表組内のリスト */
table ul {
margin:0;
padding:0;
}
table ul li{
padding:1px 0;
margin:2px 0 2px 1.5em;
line-height:1.4;
list-style-type:disc;
list-style-position: outside;
}

/* liのIE6-7対策 */
*:first-child+html table ul li {
margin:0 0 0 2em;
}

* html table ul li {
margin:0 0 0 2em;
}

table dl {
margin:1px 0 0;
}
table dl dt {
font-weight: normal;
padding: 2px 0px;
width: 60px;
float: left;
clear: none;
}
table dl dd {
padding: 2px 0px;
clear: none;
line-height:1.4;
}
table dl dd.f-clear {
line-height:0;
height:1px;
margin:0;
padding:0;
font-size:1px;
float:none;
clear:both;
}

table.table-form ol {
list-style-type:none;
}
table.table-form ul.radio_select {
list-style-type:none;
}
table.table-form ul.radio_select li{
list-style-type:none;
width:5em;
float:left;
padding:0;
margin:0 1em 0 0;
}

/*---------------フォーム---------------*/

/*入力フォーム*/

input {
margin: 3px 0;
}
table.table-form .input1 {
width: 200px;
}
table.table-form .input2 {
width: 320px;
}
table.table-form .input3 {
width: 80px;
}
table.table-form .input4 {
width: 150px;
}
input.indent{
margin:5px 0 5px 1.5em;
}
table.table-form textarea {
width: 400px;
margin: 5px 0;
padding:5px;
font-size:1em;
}

/*---------------装飾box---------------*/

/*デザイン1*/

| Kenのムービー計画へ＞動画狂コーナーへ＞HTML5/CSS3.へ |