@charset "UTF-8";

/**************************************************

　汎用スタイル

**************************************************/


/* -------------------------------------------
	 #clearfix
-------------------------------------------- */

/* For modern browsers */
.cf:before,
.cf:after {
    content:"";
    display:table;
}
.cf:after {
    clear:both;
}
/* For IE 6/7 (trigger hasLayout) */
.cf {
    zoom:1;
}  
/* -------------------------------------------
	 #フロート関連
-------------------------------------------- */
.fl_r {
	float: right;
}
.fl_l {
	float: left;
}
.cl_both {
	clear: both;
}
/* -------------------------------------------
	 #テキスト関連
-------------------------------------------- */
.red {
	color: #FF0000;
}
.bold{
	font-weight: bold;	
}
.red-tb {
	color: #fff;
	background: linear-gradient(transparent 0%, #ff0000 0%);
	padding: 0 3px;
}
.caution-txt,
.caution-txt a {
	color: #ff0000;
}
.txt-bold {
  font-weight: bold;
}
.mark-indent {
	text-indent: -1em;
	margin-left: 1em;
}
.fa-1_5x {
	font-size: 1.5em;
}
.fa-1_8x {
	font-size: 1.8em;
}
/* Rules for sizing the icon. */
.material-icons.md-18 { font-size: 18px; }
.material-icons.md-24 { font-size: 24px; }
.material-icons.md-36 { font-size: 36px; }
.material-icons.md-48 { font-size: 48px; }

/* Rules for using icons as black on a light background. */
.material-icons.md-dark { color: rgba(0, 0, 0, 0.54); }
.material-icons.md-dark.md-inactive { color: rgba(0, 0, 0, 0.26); }

/* Rules for using icons as white on a dark background. */
.material-icons.md-light { color: rgba(255, 255, 255, 1); }
.material-icons.md-light.md-inactive { color: rgba(255, 255, 255, 0.3); }

/* -------------------------------------------
	 #テキスト揃え関連
-------------------------------------------- */
.align_c {
	text-align: center;
}
.align_r {
	text-align:right;
}
.align_l {
	text-align:left;
}
input {
	vertical-align: middle;
}
.li_mark {
	text-indent: -1em;
	padding-left: 1em
}
/* -------------------------------------------
	 #マージン関連
-------------------------------------------- */
.mg_none {
	margin: 0px;
}
.mr_5 {
	margin-right: 5px;
}
.mr_10 {
	margin-right: 10px;
}
.mr_20 {
	margin-right: 20px;
}
.mr_30 {
	margin-right: 30px;
}
.mr_50 {
	margin-right: 50px;
}
.ml_5 {
	margin-left: 5px;
}
.ml_10 {
	margin-left: 10px;
}
.ml_20 {
	margin-left: 20px;
}
.ml_30 {
	margin-left: 30px;
}
.mt_3 {
	margin-top: 3px;
}
.mt_10 {
	margin-top: 10px;
}
.mt_15 {
	margin-top: 15px;
}
.mt_20 {
	margin-top: 20px;
}
.mt_30 {
	margin-top: 30px;
}
.mt_40 {
	margin-top: 40px;
}
.mb_5 {
	margin-bottom: 5px;
}
.mb_10 {
	margin-bottom: 10px;
}
.mb_20 {
	margin-bottom: 20px;
}
.mb_25 {
	margin-bottom: 25px;
}
.mb_30 {
	margin-bottom: 30px;
}
.mb_40 {
	margin-bottom: 40px;
}
.mb_50 {
	margin-bottom: 50px;
}
.mb_60 {
	margin-bottom: 60px;
}
.mb_70 {
	margin-bottom: 70px;
}
.mb_100 {
	margin-bottom: 100px;
}
.mb-1em {
	margin-bottom: 1em;
}
.mb-1_5em {
	margin-bottom: 1.5em;
}

/* -------------------------------------------
	 #パディング関連
-------------------------------------------- */
.pd-t50 {
	padding-top:50px;
}
.pd-b50 {
	padding-bottom:50px;
}
.pd-b40 {
	padding-bottom:40px;
}
/* -------------------------------------------
	 #ボーダー関連
-------------------------------------------- */
.right_border{
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #999999;
}
.bottom_border{
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #999999;
}
/* -------------------------------------------
	 #イメージ関連
-------------------------------------------- */
.img_middle {
	vertical-align: middle;
	margin-right: 5px;
}
.img_texttop {
	vertical-align: text-top;
	margin-right: 5px;
}
.img_w100 {
	width: 100%
}
.cont-h {
	position: relative;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}
a img {
	display: block;
}
/* class
----------------------------------------------------------------------------------------------------*/
.flex { display: flex;}
.flex-s-s { display: flex; align-items: flex-start; justify-content: flex-start;}
.flex-s-c { display: flex; align-items: flex-start; justify-content: center;}
.flex-s-e { display: flex; align-items: flex-start; justify-content: flex-end;}
.flex-s-sa { display: flex; align-items: flex-start; justify-content: space-around;}
.flex-st-s { display: flex; align-items: stretch; justify-content: flex-start;}
.flex-st-sb { display: flex; align-items: stretch; justify-content: space-between;}
.flex-s-sb { display: flex; align-items: flex-start; justify-content: space-between;}
.flex-c-s { display: flex; align-items: center; justify-content: flex-start;}
.flex-c-c { display: flex; align-items: center; justify-content: center;}
.flex-c-e { display: flex; align-items: center; justify-content: flex-end;}
.flex-c-sb { display: flex; align-items: center; justify-content: space-between;}
.flex-e-s { display: flex; align-items: flex-end; justify-content: flex-start;}
.flex-e-c { display: flex; align-items: flex-end; justify-content: center;}
.flex-e-e { display: flex; align-items: flex-end; justify-content: flex-end;}
.flex-e-sa { display: flex; align-items: flex-end; justify-content: space-around;}
.flex-e-sb { display: flex; align-items: flex-end; justify-content: space-between;}
.flex-col { flex-direction: column;}
.flex-wrap { flex-wrap: wrap;}
.flex-col-wrap { flex-flow: column wrap;}

.flex-left { margin-right: auto;}
.flex-center { margin-left: auto; margin-right: auto;}
.flex-right { margin-left: auto;}

.w0 { width: 0;}
.w100 { width: 100%;}
.h0 { height: 0;}
.h100 { height: 100%;}

.ellipsis { white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.indent { white-space: nowrap; overflow: hidden; text-indent: 100%;}
.nowrap { white-space: nowrap;}

/* emmetの記法に合わせる */
.db { display: block;}
.dn { display: none;}
.df { display: flex;}
.di { display: inline;}

.pos-r { position: relative;}
.pos-a { position: absolute;}
.pos-f { position: fixed;}
.pos-s { position: static;}
.pos-t-l { top: 0; left: 0;}
.pos-t-r { top: 0; right: 0;}
.pos-b-l { bottom: 0; left: 0;}
.pos-b-r { bottom: 0; right: 0;}

.poi-n { pointer-events: none;}
.poi-a { pointer-events: auto;}

.tal { text-align: left;}
.tac { text-align: center;}
.tar { text-align: right;}

.ovh { overflow: hidden;}
.ova { overflow: auto;}

.ma { margin-left: auto; margin-right: auto;}

.fwb { font-weight: bold;}

.cursor-p { cursor: pointer;}
.cursor-d { cursor: default;}

/* WordPress テンプレート表示用 */
.wp-template-info {
  position: fixed;
  top: 40px;
  right: 40px;
  z-index: 10000;
  padding: 1em 1.5em;
  background: rgba(0,0,0,.5);
  color: #fff;
}
.wp-template-info p {
  margin: .5em 0;
}
/*--------------------------------------------------------------------------------------------------*/