/*
	common.css（共通レイアウト）
	Author: STUDIO P
*/


/* --- clear fix --- */
.cf:before,
.cf:after,
#content:before,
#content:after {
	content: "";
	display: table;
}

.cf:after,
#content:after { clear: both; }

.cf,
#content { *zoom: 1; }

.cl { clear: both; }


/* --- link hover --- */
a {
	-webkit-transition: opacity 0.2s linear;
	-moz-transition: opacity 0.2s linear;
	transition: opacity 0.2s linear;
}

a:hover {
	-webkit-opacity: 0.8;
	-moz-opacity: 0.8;
	opacity: 0.8;
}


/* --- display none ---*/
.none { display: none; }


/* --- text-align --- */
.aligncenter { text-align: center; }
.alignleft { text-align: left; }
.alignright { text-align: right; }


/* --- float --- */
.f_left { float: left; }
.f_right { float: right; }


/* --- width:100% --- */
.full { width: 100% !important; }


/* --- color --- */
.black { color: #000000 !important; }
.white { color: #FFFFFF !important; }
.red { color: #CC0000 !important; }
.blue { color: #0099FF !important; }
.green { color: #669900 !important; }
.orange { color: #FF6600 !important; }
.yellow { color: #FFCC00 !important; }

.bg-black { background-color: #000000 !important; }
.bg-white { background-color: #FFFFFF !important; }
.bg-red { background-color: #CC0000 !important; }
.bg-blue { background-color: #0099FF !important; }
.bg-green { background-color: #669900 !important; }
.bg-orange { background-color: #FF6600 !important; }
.bg-yellow { background-color: #FFCC00 !important; }


/* --- texture --- */
.tx {}
.tx-top { background-position: left top; background-repeat: repeat-x; }
.tx-bottom { background-position: left bottom; background-repeat: repeat-x; }
.tx-leftTop { background-position: left top; background-repeat: no-repeat; }
.tx-leftBottom { background-position: left bottom; background-repeat: no-repeat; }
.tx-rightTop { background-position: right top; background-repeat: no-repeat; }
.tx-rightBottom { background-position: right bottom; background-repeat: no-repeat; }
.tx-max { background-size: 100% 100%; }
.tx-hmax { background-size: auto 100%; }
.tx-wmax { background-size: 100% auto; }

.tx-mb01 { background-image: url(../img/texture/tx_mb01.png); }
.tx-mb02 { background-image: url(../img/texture/tx_mb02.png); }
.tx-mb03 { background-image: url(../img/texture/tx_mb03.png); }
.tx-b01 { background-image: url(../img/texture/tx_b01.png); }
.tx-b02 { background-image: url(../img/texture/tx_b02.png); }
.tx-b03 { background-image: url(../img/texture/tx_b03.png); }
.tx-b04 { background-image: url(../img/texture/tx_b04.png); }
.tx-b05 { background-image: url(../img/texture/tx_b05.png); }
.tx-b06 { background-image: url(../img/texture/tx_b06.png); }
.tx-b07 { background-image: url(../img/texture/tx_b07.png); }
.tx-b08 { background-image: url(../img/texture/tx_b08.png); }
.tx-b09 { background-image: url(../img/texture/tx_b09.png); }
.tx-b10 { background-image: url(../img/texture/tx_b10.png); }
.tx-b11 { background-image: url(../img/texture/tx_b11.png); }
.tx-b12 { background-image: url(../img/texture/tx_b12.png); }
.tx-b13 { background-image: url(../img/texture/tx_b13.png); }
.tx-b14 { background-image: url(../img/texture/tx_b14.png); }
.tx-b15 { background-image: url(../img/texture/tx_b15.png); }
.tx-b16 { background-image: url(../img/texture/tx_b16.png); }
.tx-b17 { background-image: url(../img/texture/tx_b17.png); }

.tx-mw01 { background-image: url(../img/texture/tx_mw01.png); }
.tx-mw02 { background-image: url(../img/texture/tx_mw02.png); }
.tx-mw03 { background-image: url(../img/texture/tx_mw03.png); }
.tx-w01 { background-image: url(../img/texture/tx_w01.png); }
.tx-w02 { background-image: url(../img/texture/tx_w02.png); }
.tx-w03 { background-image: url(../img/texture/tx_w03.png); }
.tx-w04 { background-image: url(../img/texture/tx_w04.png); }
.tx-w05 { background-image: url(../img/texture/tx_w05.png); }
.tx-w06 { background-image: url(../img/texture/tx_w06.png); }
.tx-w07 { background-image: url(../img/texture/tx_w07.png); }
.tx-w08 { background-image: url(../img/texture/tx_w08.png); }
.tx-w09 { background-image: url(../img/texture/tx_w09.png); }
.tx-w10 { background-image: url(../img/texture/tx_w10.png); }
.tx-w11 { background-image: url(../img/texture/tx_w11.png); }
.tx-w12 { background-image: url(../img/texture/tx_w12.png); }
.tx-w13 { background-image: url(../img/texture/tx_w13.png); }
.tx-w14 { background-image: url(../img/texture/tx_w14.png); }
.tx-w15 { background-image: url(../img/texture/tx_w15.png); }
.tx-w16 { background-image: url(../img/texture/tx_w16.png); }
.tx-w17 { background-image: url(../img/texture/tx_w17.png); }


/* --- font --- */
.fs3S { font-size: 77% !important; }
.fsSS { font-size: 85% !important; }
.fsS { font-size: 93% !important; }
.fsM { font-size: 100% !important; }
.fsL { font-size: 108% !important; }
.fsLL { font-size: 123.1% !important; }
.fs3L { font-size: 138.5% !important; }
.fs4L { font-size: 154% !important; }
.fs5L { font-size: 185% !important; }
.fs6L { font-size: 200% !important; }

.mincho { font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif; }


/* --- margin --- */
.ma0 { margin: 0 !important; }
.mtS { margin-top: 10px !important; }
.mtM { margin-top: 30px !important; }
.mtL { margin-top: 50px !important; }
.mrS { margin-right: 10px !important; }
.mrM { margin-right: 30px !important; }
.mrL { margin-right: 50px !important; }
.mb0 { margin-bottom: 0 !important; }
.mbS { margin-bottom: 10px !important; }
.mbM { margin-bottom: 30px !important; }
.mbL { margin-bottom: 50px !important; }
.mbLL { margin-bottom: 80px !important; }
.mlS { margin-left: 10px !important; }
.mlM { margin-left: 30px !important; }
.mlL { margin-left: 50px !important; }
.space { margin-bottom: 100px !important; }


/* --- padding --- */
.paSS { padding: 5px !important; }
.paS { padding: 10px !important; }
.paM { padding: 20px !important; }
.paL { padding: 30px !important; }


/* --- table --- */
table { margin-bottom: 10px; }

table.t-type1 th,
table.t-type1 td {
	border: 1px solid #CCC;
	padding: 10px;
	vertical-align: top;
}

table.t-type2 th,
table.t-type2 td {
	border: 1px solid #CCC;
	padding: 4px;
	vertical-align: top;
	font-size: 85%;
}

table.t-type3 th,
table.t-type3 td {
	border-bottom: 1px solid #CCC;
	padding: 10px;
	vertical-align: top;
}

table.t-type4 th,
table.t-type4 td {
	border-bottom: 1px dotted #CCC;
	padding: 4px;
	vertical-align: top;
	font-size: 85%;
}


/* --- ol --- */
ol.text {
	list-style: decimal outside;
	padding-left: 40px;
}

.w10{ width: 10%; }
.w20{ width: 20%; }
.w30{ width: 30%; }
.w40{ width: 40%; }
.w50{ width: 50%; }
.w60{ width: 60%; }
.w70{ width: 70%; }
.w80{ width: 80%; }
.w90{ width: 90%; }
.w100{ width: 100%; }