﻿/*--------------------------------------------------------
	固定ﾎﾞｯｸｽの設定
----------------------------------------------------------*/
ul.fixed{
	margin: 0 auto;			/*--要素自体を中央に設定--*/
	z-index: 1;			/*--最前面に設定--*/
	display: flex;
		display: -webkit-flex; /* ★Safari、Chromeブラウザに対応★ */
		display: -ms-flexbox; /* ★IEブラウザに対応★ */
	justify-content: center;
		-webkit-box-pack: center; /* ★Safari、Chromeブラウザに対応★ */
		-ms-flex-pack: center; /* ★IEブラウザに対応★ */
	align-items: center;
		-webkit-box-align: center; /* ★Safari、Chromeブラウザに対応★ */
		-ms-flex-align: center; /* ★IEブラウザに対応★ */
}
ul.fixed li {
	flex-grow: 1;			/*　伸長率を指定　*/
		-webkit-box-flex: 1; /* ★Safari、Chromeブラウザに対応★ */
		-ms-flex-positive: 1; /* ★IEブラウザに対応★ */
}
ul.fixed li img{
	width: 95%;			/*--ﾘｽﾄ内の使用領域を設定--*/
}
ul.fixed li video {
	width: 100%;			/*--ﾘｽﾄ内の使用領域を設定--*/
}
ul.fixed li:nth-of-type(1) {
}
ul.fixed li:nth-of-type(2) {
}
ul.fixed li:nth-of-type(3) {
}

.snsimg img {
	margin: 0 auto;			/*--要素自体を中央に設定--*/
	max-width: 250px;		/*--ｲﾒｰｼﾞの横幅の最大値を指定--*/
}
.telimg img {
	margin: 0 auto;			/*--要素自体を中央に設定--*/
	max-width: 300px;		/*--ｲﾒｰｼﾞの横幅の最大値を指定--*/
}
.pr-av video {
	margin: 0 auto;			/*--要素自体を中央に設定--*/
	max-width: 400px;		/*--ｲﾒｰｼﾞの横幅の最大値を指定--*/
}

/*--------------------------------------------------------
	ﾌﾚｯｸｽ可動ﾎﾞｯｸｽの設定
----------------------------------------------------------*/
ul {
	list-style: none;		/*--リストの”・”を表示しない--*/
}
ul.flexbox {
	display: flex;
		display: -webkit-flex; /* ★Safari、Chromeブラウザに対応★ */
		display: -ms-flexbox; /* ★IEブラウザに対応★ */
	justify-content: center space-around;		/*　ﾎﾞｯｸｽ内均等配置（上下の隙間あり）　*/
		-ms-flex-pack: distribute; /* ★IEブラウザに対応★ */
	flex-wrap: wrap;			/*　改行可　*/
		-webkit-flex-wrap: wrap; /* ★Safari、Chromeブラウザに対応★ */
		-ms-flex-wrap: wrap;		/* ★IEブラウザに対応★ */
	overflow: hidden;			/*　はみ出した部分は表示しない　*/
		-webkit-overflow: hidden;
}
ul.flexbox li {
	margin: 0 auto;			/*--要素自体をユニット内の中央に設定--*/
	flex-grow: 1;			/*　伸長率を指定　*/
		-webkit-box-flex: 1; /* ★Safari、Chromeブラウザに対応★ */
		-ms-flex-positive: 1; /* ★IEブラウザに対応★ */
	padding-bottom: 3px;		/*　ﾎﾞｰﾀﾞｰ内の余白　*/
}
ul.flexbox li img {
	margin: 0 auto;			/*--要素自体をリスト内の中央に設定--*/
	width: 90%;			/*　ﾌﾚｯｸｽﾎﾞｯｸｽ内の90％で表示　*/
}
ul.flexbox li video {
	margin: 0 auto;			/*--要素自体をリスト内の中央に設定--*/
	width: 90%;			/*　ﾌﾚｯｸｽﾎﾞｯｸｽ内の90％で表示　*/
}
ul.flexbox li iframe {
	margin: 0 auto;			/*--要素自体をリスト内の中央に設定--*/
	width: 100%;			/*　ﾌﾚｯｸｽﾎﾞｯｸｽ内の100％で表示　*/
}
ul.flexbox li.block4 {
	margin: 0 auto;
}
ul.flexbox p {
	margin: auto;
}
/*--画面サイズが450px以上の場合に可変--*/
@media screen and (min-width: 451px) {
ul.flexbox li.block4 {
	width: 50%;			/*　ﾌﾚｯｸｽﾎﾞｯｸｽ内の50％で表示　*/
}}
/*--画面サイズが767px以上の場合に可変--*/
@media screen and (min-width: 767px) {
ul.flexbox li.block4 {
	width: 25%;			/*　ﾌﾚｯｸｽﾎﾞｯｸｽ内の25％で表示　*/
}}
/*--------↓↓↓　imgｻｲｽﾞ設定　↓↓↓---------*/
.linkimg img {	/*-ｲﾒｰｼﾞの周りを囲む設定-*/
	margin: auto;
	max-width: 110px;		/*　最大でも150pxで表示　*/
	width: 95%;			/*　ﾌﾚｯｸｽﾎﾞｯｸｽ内の95％で表示　*/
	text-align: center;		/*　ﾃｷｽﾄ位置　*/
	margin: 0 auto;			/*　外側の余白なし　*/
	border: solid 2px blue;		/*　囲み線の幅と色　*/
	border-radius: 5px;		/*　ﾎﾞｰﾀﾞｰの角を丸める　*/
	padding: 0 auto;		/*　ﾎﾞｰﾀﾞｰ内の余白　*/
	background: white;		/*　塗りつぶし　*/
}
.messeimg img {
	margin: 0 auto;			/*--要素自体を中央に設定--*/
	max-width: 380px;		/*--ｲﾒｰｼﾞの横幅の最大値を指定--*/
}
img {
	max-width: initial;		/*--ｲﾒｰｼﾞの横幅値の指定解除--*/
}
