@charset "utf-8";
/* Windows */
@font-face {
  font-family: YuGothicM;
  font-weight: normal;
  src: local('YuGothic-Medium'),  /* Mediumを明示的に指定 */
       local('Yu Gothic Medium'), /* Chrome用 */
       local('YuGothic-Regular'); /* Windows8.1ではMediumがないのでRegularを指定 */
}
@font-face {
  font-family: YuGothicM;
  font-weight: bold;
  src: local('YoGothic-Bold'), /* Boldはそのまま */
       local('Yu Gothic');     /* Chrome用 */
}

/* All Magin + Padding Clear ----- */
* { margin:0; padding:0; }

html {
	width: 100%;
	height: 100%;
	font-size: 100%;
}

body {
	position:relative;
	width: 100%;
	height: 100%;
	font-size: 100%;
	line-height: 1.8em;
	/*font-family: 	"ヒラギノ角ゴ Pro W3",
					"Hiragino Kaku Gothic Pro",
					"メイリオ", Meiryo, Osaka,
					"ＭＳ Ｐゴシック",
					"MS PGothic",
					sans-serif;*/
	/*font-family: -apple-system, blinkMacSystemFont,
				 'Helvetica Neue',
				 'Segoe UI',
				 YuGothicM,
				 YuGothic,
				 Meiryo,
				 sans-serif;*/
	font-family: -apple-system, blinkMacSystemFont, /* Macの欧文はSan Francisco (OS X 10.11以降) */
				 'Helvetica Neue', /* Macの欧文 (OS X 10.10以前) */
				 'Segoe UI',       /* Windowsの欧文 */
				 "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic",
				 "メイリオ", Meiryo,
				 sans-serif;
	font-weight:400;
	-ms-word-wrap: break-word;
	word-wrap: break-word;
}

/* IE8〜11はメイリオ */
@media screen\0 {
	body {
		font-family: 'Segoe UI', /* Windowsの欧文 */
						Meiryo,     /* メイリオ */
						sans-serif;
	}
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
	font-size: inherit;
	font-weight: normal;
	margin: 0;
}

a {
	color: #333;
	-webkit-transition: 0.3s;
	-moz-transition: 0.3s;
	transition: 0.3s;
}
a:hover, a:focus { color: #ff9900; }

.navbar {
	border: none;
	margin-bottom: 0;
}

.navbar-default {
	border-radius: 0;
	box-shadow: none;
}

.block { display: block !important; }
.inline-block { display: inline-block !important; }
.relative { position: relative !important; }



/* Text Bring ----- */

.tAc, .xtAc { text-align: center !important; }
.tAl, .xtAl { text-align: left !important; }
.tAr, .xtAr { text-align: right !important; }



/* Font Size ----- */

/* 10px */
[class*='font--3'] { font-size: 0.625em; }

/* 12px */
[class*='font--2'] { font-size: 0.75em; }

/* 14px */
[class*='font--1'] { font-size: 0.875em; }

/* 16px */
[class*='font-0'] { font-size: 1em; }

/* 18px */
[class*='font-1'] { font-size: 1.125em; }

/* 21px */
[class*='font-2'] { font-size: 1.3125em; }

/* 24px */
[class*='font-3'] { font-size: 1.5em; }

/* 30px */
[class*='font-4'] { font-size: 1.875em; }

/* 36px */
[class*='font-5'] { font-size: 2.25em; }

/* 48px */
[class*='font-6'] { font-size: 3em; }

/* Font Color ----- */
.fff { color: #fff !important; }
.black { color: #333 !important; }


/* Font Weight ----- */

.bold { font-weight: bold; }
.bold-off { font-weight: normal; }



/* Font Style ----- */

.trebuchet { font-family: "Trebuchet MS"; }
.gothic { font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif"; }
.mincho { font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E"; }



/* HR ----- */

hr { border-top-color: #999; margin-top: 1.5%; margin-bottom: 1.5%; }
hr.ccc { border-top-color: #ccc; } 
hr.dark { border-top-color: #333; }
hr.solid { border-top-style: solid; }
hr.dotted { border-top-style: dotted; }
hr.dashed { border-top-style: dashed; }



/* Background Color ----- */

.bg-color-none { background-color: transparent; }
.bg-white { background-color: #fff; }

ul.default { padding-left: 20px; }
ul.decimal { list-style: decimal; }
ul.square { list-style: square; }



/* Force Imaging ----- */

.remove {
	position: relative;
	overflow: hidden;
	display: block;
	width: 100%;
	height: 0;
	font-size: 0.5em;
	text-align: left;
	text-indent: -9999px;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}




.flex[class*='fl-'] {
	position: relative;
}
.flex[class*='fl-'] > * {
	position: relative;
	display: block;
	padding-bottom: 15px;
}
.flex.fl-xs-1 > * { /* flex-basis */ width: 8%; flex-basis: 8%; }
.flex.fl-xs-2 > * { /* flex-basis */ width: 16%; flex-basis: 16%; }
.flex.fl-xs-3 > * { /* flex-basis */ width: 25%; flex-basis: 25%; }
.flex.fl-xs-4 > * { /* flex-basis */ width: 33%; flex-basis: 33%; }
.flex.fl-xs-6 > * { /* flex-basis */ width: 50%; flex-basis: 50%; }
.flex.fl-xs-12 > * { /* flex-basis */ width: 100%; }

@media all and (-ms-high-contrast:none) {
	.flex.fl-xs-1 > * { /* flex-basis */ width: 5%; flex-basis: 5%; }
	.flex.fl-xs-2 > * { /* flex-basis */ width: 12%; flex-basis: 12%; }
	.flex.fl-xs-3 > * { /* flex-basis */ width: 21.3%; flex-basis: 21.3%; }
	.flex.fl-xs-4 > * { /* flex-basis */ width: 29.7%; flex-basis: 29.7%; }
	.flex.fl-xs-6 > * { /* flex-basis */ width: 46%; flex-basis: 46%; }
}

/*Safariだけに適用されるCSSハック*/
@media screen and (-webkit-min-device-pixel-ratio:0) {
	.flex.fl-xs-1 > * { /* flex-basis */ width: 5%; flex-basis: 5%; }
	.flex.fl-xs-2 > * { /* flex-basis */ width: 16.5%; flex-basis: 16.5%; }
	.flex.fl-xs-3 > * { /* flex-basis */ width: 24.9%; flex-basis: 24.9%; }
	.flex.fl-xs-4 > * { /* flex-basis */ width: 33.2%; flex-basis: 33.2%; }
	.flex.fl-xs-6 > * { /* flex-basis */ width: 49.5%; flex-basis: 49.5%; }
}

.flex[class*='fl-'] > * > .fl-h-fix { position: relative; top: 0; bottom: 0; height: 100%; }

.flex[class*='fl-xs-'] > * { padding-top: 15px; }
.flex.fl-xs-1 > *:nth-child(-n+12),
.flex.fl-xs-2 > *:nth-child(-n+6),
.flex.fl-xs-3 > *:nth-child(-n+4),
.flex.fl-xs-4 > *:nth-child(-n+3),
.flex.fl-xs-6 > *:nth-child(-n+2),
.flex.fl-xs-12 > *:first-child { padding-top: 0; }



@media screen and (min-width:768px){
	br.hidden-xs:not(.hidden-sm) { display: inherit !important; }

	.flex[class*='fl-'] {
		display: -webkit-box;
		display: -ms-flexbox;
		display:-moz-box;
		display:box;
		display: -webkit-flex;
		display: flex;
		width: auto !important;
		letter-spacing: -.40em;
	
		-moz-box-orient:horizontal;
		-webkit-box-orient:horizontal;
		flex-direction: row;
	
		-ms-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-webkit-flex-wrap :wrap;
		flex-wrap: wrap;

		-webkit-flex-flow: row wrap;
		flex-flow: row wrap;
	}
	.flex[class*='fl-'] > * {
		float: none !important;
		flex-basis: auto;
		letter-spacing: normal;
		padding-left: 15px;
		padding-right: 15px;
	}

	.flex.fl-sm-1 > * { /* flex-basis */ width: 8%; flex-basis: 8%; }
	.flex.fl-sm-2 > * { /* flex-basis */ width: 16%; flex-basis: 16%; }
	.flex.fl-sm-3 > * { /* flex-basis */ width: 25%; flex-basis: 25%; }
	.flex.fl-sm-4 > * { /* flex-basis */ width: 33%; flex-basis: 33%; }
	.flex.fl-sm-6 > * { /* flex-basis */ width: 50%; flex-basis: 50%; }
	.flex.fl-sm-12 > * { /* flex-basis */ width: 100%; }

	.flex[class*='fl-sm-'] > * { padding-top: 15px; }
	.flex.fl-sm-1 > *:nth-child(-n+12),
	.flex.fl-sm-2 > *:nth-child(-n+6),
	.flex.fl-sm-3 > *:nth-child(-n+4),
	.flex.fl-sm-4 > *:nth-child(-n+3),
	.flex.fl-sm-6 > *:nth-child(-n+2),
	.flex.fl-sm-12 > *:first-child { padding-top: 0; }
}

@media screen and (min-width:768px) and (-ms-high-contrast:none) {
	.flex.fl-sm-1 > * { /* flex-basis */ width: 5%; flex-basis: 5%; }
	.flex.fl-sm-2 > * { /* flex-basis */ width: 12%; flex-basis: 12%; }
	.flex.fl-sm-3 > * { /* flex-basis */ width: 21.3%; flex-basis: 21.3%; }
	.flex.fl-sm-4 > * { /* flex-basis */ width: 29.7%; flex-basis: 29.7%; }
	.flex.fl-sm-6 > * { /* flex-basis */ width: 46%; flex-basis: 46%; }
	.flex.fl-sm-11 > * { /* flex-basis */ width: 87%; flex-basis: 87%; }
}

/*Safariだけに適用されるCSSハック*/
@media screen and (min-width:768px) and (-webkit-min-device-pixel-ratio:0) {
	.flex.fl-sm-1 > * { /* flex-basis */ width: 5%; flex-basis: 5%; }
	.flex.fl-sm-2 > * { /* flex-basis */ width: 16.5%; flex-basis: 16.5%; }
	.flex.fl-sm-3 > * { /* flex-basis */ width: 24.9%; flex-basis: 24.9%; }
	.flex.fl-sm-4 > * { /* flex-basis */ width: 33.2%; flex-basis: 33.2%; }
	.flex.fl-sm-6 > * { /* flex-basis */ width: 49.5%; flex-basis: 49.5%; }
}

@media screen and (min-width:992px){
	br.hidden-sm { display: inherit !important; }

	.flex.fl-md-1 > * { /* flex-basis */ width: 8.333333333333332%; flex-basis: 8.333333333333332%; }
	.flex.fl-md-2 > * { /* flex-basis */ width: 16.666666666666664%; flex-basis: 16.666666666666664%; }
	.flex.fl-md-3 > * { /* flex-basis */ width: 25%; flex-basis: 25%; }
	.flex.fl-md-4 > * { /* flex-basis */ width: 33.33333333333333%; flex-basis: 33.33333333333333%; }
	.flex.fl-md-6 > * { /* flex-basis */ width: 50%; flex-basis: 50%; }
	.flex.fl-md-12 > * { /* flex-basis */ width: 100%; }

	.flex[class*='fl-md-'] > * { padding-top: 15px; }
	.flex.fl-md-1 > *:nth-child(-n+12),
	.flex.fl-md-2 > *:nth-child(-n+6),
	.flex.fl-md-3 > *:nth-child(-n+4),
	.flex.fl-md-4 > *:nth-child(-n+3),
	.flex.fl-md-6 > *:nth-child(-n+2),
	.flex.fl-md-12 > *:first-child { padding-top: 0; }
}

@media screen and (min-width:992px) and (-ms-high-contrast:none) {
	.flex.fl-md-1 > * { /* flex-basis */ width: 5%; flex-basis: 5%; }
	.flex.fl-md-2 > * { /* flex-basis */ width: 12%; flex-basis: 12%; }
	.flex.fl-md-3 > * { /* flex-basis */ width: 21.3%; flex-basis: 21.3%; }
	.flex.fl-md-4 > * { /* flex-basis */ width: 29.7%; flex-basis: 29.7%; }
	.flex.fl-md-6 > * { /* flex-basis */ width: 46%; flex-basis: 46%; }
}

/*Safariだけに適用されるCSSハック*/
@media screen and (min-width:992px) and (-webkit-min-device-pixel-ratio:0) {
	.flex.fl-md-1 > * { /* flex-basis */ width: 5%; flex-basis: 5%; }
	.flex.fl-md-2 > * { /* flex-basis */ width: 16.5%; flex-basis: 16.5%; }
	.flex.fl-md-3 > * { /* flex-basis */ width: 24.9%; flex-basis: 24.9%; }
	.flex.fl-md-4 > * { /* flex-basis */ width: 33.2%; flex-basis: 33.2%; }
	.flex.fl-md-6 > * { /* flex-basis */ width: 49.5%; flex-basis: 49.5%; }
}

@media screen and (min-width:1200px){
	
	.flex.fl-lg-1 > * { /* flex-basis */ width: 8.333333333333332%; flex-basis: 8.333333333333332%; }
	.flex.fl-lg-2 > * { /* flex-basis */ width: 16.666666666666664%; flex-basis: 16.666666666666664%; }
	.flex.fl-lg-3 > * { /* flex-basis */ width: 25%; flex-basis: 25%; }
	.flex.fl-lg-4 > * { /* flex-basis */ width: 33.33333333333333%; flex-basis: 33.33333333333333%; }
	.flex.fl-lg-6 > * { /* flex-basis */ width: 50%; flex-basis: 50%; }
	.flex.fl-lg-12 > * { /* flex-basis */ width: 100%; }

	.flex[class*='fl-lg-'] > * { padding-top: 15px; }
	.flex.fl-lg-1 > *:nth-child(-n+12),
	.flex.fl-lg-2 > *:nth-child(-n+6),
	.flex.fl-lg-3 > *:nth-child(-n+4),
	.flex.fl-lg-4 > *:nth-child(-n+3),
	.flex.fl-lg-6 > *:nth-child(-n+2),
	.flex.fl-lg-12 > *:first-child { padding-top: 0; }

	br.hidden-md { display: inherit !important; }
}

@media screen and (min-width:1200px) and (-ms-high-contrast:none) {
	.flex.fl-lg-1 > * { /* flex-basis */ width: 5%; flex-basis: 5%; }
	.flex.fl-lg-2 > * { /* flex-basis */ width: 12%; flex-basis: 12%; }
	.flex.fl-lg-3 > * { /* flex-basis */ width: 21.3%; flex-basis: 21.3%; }
	.flex.fl-lg-4 > * { /* flex-basis */ width: 29.7%; flex-basis: 29.7%; }
	.flex.fl-lg-6 > * { /* flex-basis */ width: 46%; flex-basis: 46%; }
}

/*Safariだけに適用されるCSSハック*/
@media screen and (min-width:1200px) and (-webkit-min-device-pixel-ratio:0) {
	.flex.fl-lg-1 > * { /* flex-basis */ width: 5%; flex-basis: 5%; }
	.flex.fl-lg-2 > * { /* flex-basis */ width: 16.5%; flex-basis: 16.5%; }
	.flex.fl-lg-3 > * { /* flex-basis */ width: 24.9%; flex-basis: 24.9%; }
	.flex.fl-lg-4 > * { /* flex-basis */ width: 33.2%; flex-basis: 33.2%; }
	.flex.fl-lg-6 > * { /* flex-basis */ width: 49.5%; flex-basis: 49.5%; }
}

@media screen and (max-width:1199px){
}

@media screen and (max-width:991px){
	br.visible-sm, br.visible-sm.visible-xs { display: inherit !important; }

	/* 10px */
	[class*='font-'][class*='-mid--3'] { font-size: 0.625em !important; }

	/* 12px */
	[class*='font-'][class*='-mid--2'] { font-size: 0.75em !important; }

	/* 14px */
	[class*='font-'][class*='-mid--1'] { font-size: 0.875em !important; }

	/* 16px */
	[class*='font-'][class*='-mid-0'] { font-size: 1em !important; }

	/* 18px */
	[class*='font-'][class*='-mid-1'] { font-size: 1.125em !important; }

	/* 21px */
	[class*='font-'][class*='-mid-2'] { font-size: 1.3125em !important; }

	/* 24px */
	[class*='font-'][class*='-mid-3'] { font-size: 1.5em !important; }

	/* 30px */
	[class*='font-'][class*='-mid-4'] { font-size: 1.875em !important; }

	/* 36px */
	[class*='font-'][class*='-mid-5'] { font-size: 2.25em !important; }

	/* 48px */
	[class*='font-'][class*='-mid-6'] { font-size: 3em !important; }
}

@media only screen and (max-width:767px){

	/* Font Size ----- */

	/* 12px */
	.font--3 { font-size: 0.75em; }

	/* 13px */
	.font--2 { font-size: 0.815em; }

	/* 16px */
	.font-1 { font-size: 1.0em; }

	/* 18px */
	.font-2 { font-size: 1.125em; }

	/* 20px */
	.font-3 { font-size: 1.25em; }

	/* 22px */
	.font-4 { font-size: 1.375em; }

	/* 24px */
	.font-5 { font-size: 1.5em; }

	/* 36px */
	.font-6 { font-size: 1.875em; }

	/* 10px */
	[class*='font-'][class*='-min--3'] { font-size: 0.625em !important; }

	/* 12px */
	[class*='font-'][class*='-min--2'] { font-size: 0.75em !important; }

	/* 14px */
	[class*='font-'][class*='-min--1'] { font-size: 0.875em !important; }

	/* 16px */
	[class*='font-'][class*='-min-0'] { font-size: 1em !important; }

	/* 18px */
	[class*='font-'][class*='-min-1'] { font-size: 1.125em !important; }

	/* 21px */
	[class*='font-'][class*='-min-2'] { font-size: 1.3125em !important; }

	/* 24px */
	[class*='font-'][class*='-min-3'] { font-size: 1.5em !important; }

	/* 30px */
	[class*='font-'][class*='-min-4'] { font-size: 1.875em !important; }

	/* 36px */
	[class*='font-'][class*='-min-5'] { font-size: 2.25em !important; }

	/* 48px */
	[class*='font-'][class*='-min-6'] { font-size: 3em !important; }

	.tAc, .tAr { text-align: left !important; }
	br.visible-xs { display: inherit !important; }

	.flex[class*='fl-xs-'] {
		display: block;
		/*display: -webkit-box;*/
		display: -ms-flexbox;
		/*display: -moz-box;*/
		/*display: box;*/
		display: -webkit-flex;
		display: flex;
		width: auto !important;
		letter-spacing: -.40em;
/*
		-moz-box-orient:horizontal;
		-webkit-box-orient:horizontal;
		flex-direction: row;
*/

		-ms-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-webkit-flex-wrap :wrap;
		flex-wrap: wrap;
/*
		-moz-box-pack:justify;
		-ms-box-pack:justify;
		box-pack:justify;
*/
		flex-pack:justify;

		-webkit-justify-content:space-between;
		justify-content:space-between;

		-ms-flex-flow: row wrap;
		-webkit-flex-flow: row wrap;
		flex-flow: row wrap;
	}
	.flex[class*='fl-xs-'] > * {
		float: none !important;
		flex-basis: auto;
		/*flex: 1;*/
		/*width: 100%;*/
		letter-spacing: normal;
		padding-left: 15px;
		padding-right: 15px;
	}
}
