@charset   "UTF-8";
/*---------------------
よく使う汎用css
1)jQuery("セレクタ").css("プロパティ名","値");
2)jQuery("セレクタ").removeClass("cssクラス名");
jQuery("セレクタ").addClass("cssクラス名");
※必要なプロパティだけをクラス名で追加＆削除できる
(長所)
※複数プロパティ可能
※クラスで値管理可能
※css()メソッドだと、スタイルが複雑化すると管理しづらい
----------------------*/
/*マウスカーソル、リンク*/
.pointer{cursor: pointer;}
.href_none{text-decoration:none;}
.href_underline{text-decoration:underline;}
/*IME(IE)*/
.zen{ime-mode : active !important;}/*初期値をON*/
.han{ime-mode : disabled !important;}/*初期値をOFF固定*/
.ank{ime-mode : inactive !important;}/*初期値をOFF変更可*/
/*余白*/
.padding0{padding:0;}
.margin0{margin:0;}
.padding_margin0{padding: 0;margin: 0;}
/*幅*/
.width_auto{width:auto;}
.width100{width:100%;}
.height_auto{height:auto;}
/*表示／非表示*/
.none{display:none;}
.no_display{display:none;}/*非表示時詰める*/
.display{display:block;}
.hidden{visibility:hidden;}/*非表示時詰めない*/
.visible{visibility:visible;}
/*横並べ方法*/
.clear_both{clear:both;}
.float_left{float:left !important;}
.float_right{float:right !important;}
/*文字列横並べ*/
.text_left{text-align: left !important;}
.text_right{text-align: right !important;}
.text_center{text-align: center !important;;}
/*文字列縦並べ(インライン専用)*/
.vertical_top{vertical-align: top;}
.vertical_middle{vertical-align: middle;}
/*スクロール制御、ポジション*/
.pos_rel{position:relative !important;}/*staticからのオフセット位置*/
.pos_fix{position:fixed !important;}/*絶対位置、非スクロール固定*/
.pos_staic{position:static !important;}/*デフォ*/
.pos_abs{position:absolute !important;}/*親からの絶対位置*/
.overflow_hidden{overflow:hidden;}/*はみ出し非表示*/
.overflow_visible{overflow:visible;}/*はみ出し許可*/
.overflow_scroll{overflow:scroll;}/*はみ出しスクロール*/
.overflow_auto{overflow:auto;}/*はみ出し自動制御*/
.overflow_none{
	/*確実にテキストを切り取り表示*/
	/*styleでheightを必ず与える事(100%は不可)*/
	/*対象のタグでfont-sizeを変更するとhiddenが効かないので
	下記「text_overflow」を使用する*/
	display:block;/*span対策*/
	overflow:hidden;/*はみ出し非表示*/
	width:100%;
	margin:0;
	padding:0;
}
.text_overflow{
	display:block;/*span対策*/
    white-space:nowrap;
    width:100%;
    overflow: hidden;
    -o-text-overflow:ellipsis;
    text-overflow: ellipsis;
	margin:0;
	padding:0;
}
/*はみ出しdisplay:none*/
/*はみ出しvisibillity:hidden*/
/*
.overflow_no_display{overflow:no-display;}
.overflow_no_content{overflow:no-content;}
*/
/*height:200px;*/
/*ボールド*/
.vertical_bottom{vertical-align: bottom;}
/*インライン、ブロック、インラインブロック*/
.inline{display:inline;}
.block{display:block;}
.inlineblock{display:inline-block;}
.bold{font-weight: bold;}
.bold_off{font-weight: normal;}

/*--------------------------------------------------*/
/*div水平*/
/*--------------------------------------------------*/

/*----claer_both不要*/
/*親div用*/
.float{
    zoom:1;/*float解除用ie6/7*/
}
/*直下の子div設定*/
.float>div,.float ui,.float li{
    float:left;
}
/*自動clear:both(flex)*/
.float:after,.float:before{
    content:"";
    clear:both;
    display:block;
}

/*確認用枠*/
.waku{
	border:1px solid #eee;
}
/*テキストを折り返さない*/
.nowrap{
	white-space:nowrap;
}

/*--------------------------------------------------*/
/*左右上下配置*/
/*--------------------------------------------------*/
.flex{/*親コンテナ*/
	/*要：上下→高さ、左右→幅*/
	/*height:200px;*/
	display: -webkit-flex;
    display: flex;
}
.flex_left{
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    text-align:left;
}
.flex_center{
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    text-align:center;
}
.flex_right{
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: flex-end;
    justify-content: flex-end;
    text-align:right;
}
.flex_top{
	display: -webkit-flex;
    display: flex;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    vertical-align: top;
}
.flex_middle{
	display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    vertical-align: middle;
}
.flex_bottom{
	display: -webkit-flex;
    display: flex;
    -webkit-align-items: flex-end;
    align-items: flex-end;
    vertical-align: bottom;

}