@import "http://";



/*=================　CSS　　==================*/


td,th {font-size: 11px;}


/* ===== シンプルで見やすいテーブル１　====== */


.sample_01{
width: 80%;
margin: 30px 0px 30px 30px;
padding: 0px;
border-collapse: collapse;
}

.sample_01 th{
width: 25%;
padding: 6px;
text-align: left;
vertical-align: top;
color: #333;
background-color: #eee;
border: 1px solid #b9b9b9;
}

.sample_01 td{
padding: 6px;
background-color: #fff;
border: 1px solid #b9b9b9;
}


/* ===== シンプルで見やすいテーブル１　border-collapse: collapse; ====== */


.sample{
width: 80%;
margin: 30px 0px 30px 30px;
padding: 0px;
border-collapse: separate;}

.sample th{
width: 25%;
padding: 6px;
text-align: left;
vertical-align: top;
color: #333;
background-color: #eee;
border: 1px solid #b9b9b9;
}

.sample td{
padding: 6px;
background-color: #fff;
border: 1px solid #b9b9b9;
}




/* ===== シンプルで見やすいテーブル２　グレイ　====== */

.sample_02{
width: 80%;
margin: 30px 0px 30px 30px;
padding:0px;
border-collapse: separate;
border-spacing: 0px;
border-top: 1px solid #ccc;
border-left: 1px solid #ccc;
}

.sample_02 th{
width: 25%;
padding: 4px;
text-align: left;
vertical-align: top;
color: #444;
background-color: #ccc;
border-top: 1px solid #fff;
border-left: 1px solid #fff;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
}

.sample_02 td{
padding: 4px;
background-color: #fafafa;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
}






/* ===== シンプルで見やすいテーブル３　ピンク====== */


.sample_03{
width: 80%;
margin: 30px 0px 30px 30px;
padding: 0px;
border-collapse: separate;
border-spacing: 0px;
border-top: 1px solid #ccc;
border-left: 1px solid #ccc;
}
.sample_03 th{
width:25%;
padding:4px;
text-align: left;
vertical-align: top;
color: #444;
background-color: #feedf3;
border-left: 3px double #999; 
border-top: 1px solid #fff;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
}
.sample_03 td{
width:75%;
padding:4px;
background-color: #fafafa;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
}



/* ===== シンプルで見やすいテーブル４　====== */


.sample_04{
width: 80%;
margin: 30px 0px 30px 30px;
border-collapse: collapse;
border-right: 1px solid #999;}

.sample_04 th{
width: 25%;
padding: 6px;
text-align: left;
vertical-align: top;
color: #fff;
background-color: #555;
border-left: 5px solid #ff6633; 
border-top: 1px solid #fff;
}


.sample_04 td{
width: 25%;
padding: 6px;
background-color: #fff;
border-bottom: 1px solid #999;
border-left: 1px solid #999;}




/* ===== シンプルで見やすいテーブル５　====== */

.sample_05{
width: 80%;
margin: 30px 0px 30px 30px;
padding: 0px;
border-collapse: collapse;
border-top: 1px solid #ccc;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
}

.sample_05 th{
width:25%;
padding: 6px;
text-align: left;
vertical-align: top;
color: #666666;
background: url(bg.jpg) repeat-x top left #eee;
border-bottom: 1px dotted #999;
border-left: 1px solid #ccc;
}

.sample_05 td{
width: 25%;
padding: 6px;
border-bottom: 1px dotted #999;
border-left: 1px solid #ccc;
}