@charset "UTF-8";

/* テキストがwidth指定のある親枠をはみ出した場合に自動的に「…」に置換する */
.truncate {
overflow:hidden;
white-space: nowrap;
text-overflow: ellipsis;
}

/* ――――――――――――――――――――――
 float
―――――――――――――――――――――― */
.floLeft {float: left;}
.floRight {float: right;}

/* ――――――――――――――――――――――
 font
―――――――――――――――――――――― */
.bold {font-weight: bold;}
.fs8  {font-size: 8px;}
.fs9  {font-size: 9px;}
.fs10 {font-size: 10px;}
.fs11 {font-size: 11px;}
.fs12 {font-size: 12px;}
.fs13 {font-size: 13px;}
.fs14 {font-size: 14px;}
.fs15 {font-size: 15px;}
.fs16 {font-size: 16px;}
.fs18 {font-size: 18px;}
.fs20 {font-size: 20px;}
.fs21 {font-size: 21px;}
.fs24 {font-size: 24px;}
.fs30 {font-size: 30px;}
.fs50 {font-size: 50px;}

.txtl {text-align: left;}
.txtc {text-align: center;} 
.txtr {text-align: right;}



/* ――――――――――――――――――――――
 font-color
―――――――――――――――――――――― */
.fc1 {color: #111;}
.fc2 {color: #222;}
.fc3 {color: #333;}
.fc4 {color: #444;}
.fc5 {color: #555;}
.fc6 {color: #666;}
.fc7 {color: #777;}
.fc8 {color: #888;}
.fc9 {color: #999;}
.fca {color: #aaa;}
.fcb {color: #bbb;}
.fcc {color: #ccc;}
.fcd {color: #ddd;}
.fce {color: #eee;}

.white {color: #ffffff;}
.black {color: #000000;}
.red {color: #ff0000;}
.orange {color: #ffa500;}
.yellow {color: #ffff00;}
.yellowgreen {color: #9acd32;}
.green {color: #008000;}
.blue {color: #0000ff;}
.water {color: #00A9F8;}
.navy {color: #000080;}
.purple {color: #800080;}
.pink {color: #ff1493;}
.tan {color: #d2b48c;}
.khaki {color: #f0e68c;}
.gray {color: #808080;}
.lightblue {color: #4cacff;}

/* ――――――――――――――――――――――
 margin
―――――――――――――――――――――― */
.mgn3 {margin: 3px;}
.mgn5 {margin: 5px;}
.mgn10 {margin: 10px;}
.mgn15 {margin: 15px;}
.mgn20 {margin: 20px;}
.mgn30 {margin: 30px;}
.mgn40 {margin: 40px;}
.mgn50 {margin: 50px;}

.mt3 {margin-top: 3px;}
.mt5 {margin-top: 5px;}
.mt10 {margin-top: 10px;}
.mt15 {margin-top: 15px;}
.mt20 {margin-top: 20px;}
.mt30 {margin-top: 30px;}
.mt40 {margin-top: 40px;}
.mt50 {margin-top: 50px;}

.mr3 {margin-right: 3px;}
.mr5 {margin-right: 5px;}
.mr8 {margin-right: 8px;}
.mr10 {margin-right: 10px;}
.mr15 {margin-right: 15px;}
.mr20 {margin-right: 20px;}
.mr30 {margin-right: 30px;}
.mr40 {margin-right: 40px;}
.mr50 {margin-right: 50px;}

.mb3 {margin-bottom: 3px;}
.mb5 {margin-bottom: 5px;}
.mb10 {margin-bottom: 10px;}
.mb15 {margin-bottom: 15px;}
.mb20 {margin-bottom: 20px;}
.mb30 {margin-bottom: 30px;}
.mb40 {margin-bottom: 40px;}
.mb50 {margin-bottom: 50px;}

.ml3 {margin-left: 3px;}
.ml5 {margin-left: 5px;}
.ml10 {margin-left: 10px;}
.ml15 {margin-left: 15px;}
.ml20 {margin-left: 20px;}
.ml30 {margin-left: 30px;}
.ml40 {margin-left: 40px;}
.ml50 {margin-left: 50px;}

/* ――――――――――――――――――――――
 padding
―――――――――――――――――――――― */
.pdg3 {padding: 3px;}
.pdg5 {padding: 5px;}
.pdg10 {padding: 10px;}
.pdg15 {padding: 15px;}
.pdg20 {padding: 20px;}
.pdg30 {padding: 30px;}
.pdg40 {padding: 40px;}
.pdg50 {padding: 50px;}

.pt3 {padding-top: 3px;}
.pt5 {padding-top: 5px;}
.pt10 {padding-top: 10px;}
.pt20 {padding-top: 20px;}
.pt30 {padding-top: 30px;}
.pt40 {padding-top: 40px;}
.pt50 {padding-top: 50px;}

.pr3 {padding-right: 3x;}
.pr5 {padding-right: 5px;}
.pr10 {padding-right: 10px;}
.pr20 {padding-right: 20px;}
.pr30 {padding-right: 30px;}
.pr40 {padding-right: 40px;}
.pr50 {padding-right: 50px;}

.pl3 {padding-left: 3px;}
.pl5 {padding-left: 5px;}
.pl10 {padding-left: 10px;}
.pl20 {padding-left: 20px;}
.pl30 {padding-left: 30px;}
.pl40 {padding-left: 40px;}
.pl50 {padding-left: 50px;}

/* ――――――――――――――――――――――
 vertical
―――――――――――――――――――――― */
.vat {vertical-align: top;}
.vam {vertical-align: middle;}
.vab {vertical-align: bottom;}

/* ――――――――――――――――――――――
 list
―――――――――――――――――――――― */
.list_circle {
list-style-type: circle;
list-style-position: outside;
margin-left: 24px;
}
.list_square {
list-style-type: square;
list-style-position: outside;
margin-left: 1.2em;
}
.list_disc {
list-style-type: disc;
list-style-position: outside;
margin-left: 20px;
}
.list_decimal {
list-style-type: decimal;
list-style-position: outside;
margin-left: 20px;
}

/* ――――――――――――――――――――――
 opacity
―――――――――――――――――――――― */
.opa5:hover {
filter: alpha(opacity=50);
-moz-opacity:0.5;
opacity:0.5;
}
.opa8:hover {
filter: alpha(opacity=80);
-moz-opacity:0.8;
opacity:0.8;
}