@charset "UTF-8";
/* CSS Document */

/* 全体設定 */
body{background: #000;
color: #fff}

.css-carousel-slider2 {
    width: 100%;
    overflow: hidden;
    position: relative;
}
.css-carousel-slider2 img {
    width: 100%;
    height: auto;
    vertical-align: top;
}

/* スライド設定 */
.css-carousel-slider2 .slide-wrap {
    width: 200%;
    position: absolute;
    display: flex;
    top: 0;
    left: 0;
    z-index: 0;
    animation: css-carousel-slider2 10s infinite;
    animation-delay: 2s;
}
.css-carousel-slider2 .slide-wrap-main {
    width: 100%;
    z-index: 1;
    animation: css-carousel-slider-main2 10s infinite;
    animation-delay: 2s;
}
.css-carousel-slider2 .slide {
    width: 100%;
}

/* スライダーアニメーションの設定 */
@keyframes css-carousel-slider2 {
    0% { transform: translateX(0); }

    40% { transform: translateX(calc(1 / 2 * -100%)); }
    50% { transform: translateX(calc(1 / 2 * -100%)); }

    90% { transform: translateX(calc(2 / 2 * -100%)); }
    100% { transform: translateX(calc(2 / 2 * -100%)); }
}

@keyframes css-carousel-slider-main2 {
    0% { transform: translateX(100%); }
    50% { transform: translateX(100%); }
    90% { transform: translateX(0%);}
}

/*フッター
---------------------------------------------------------------------------*/
#footer2-parts * {margin: 0;padding: 0;}
#footer2-parts ul {list-style: none;}

/*ブロック全体*/
#footer2-parts {
	background: #eee;	/*背景色*/
	color: #555;		/*文字色*/
	padding: var(--content-space);	/*フッター内の余白。css冒頭のcontent-spaceを読み込みます。*/
}

/*ロゴやSNSアイコンが入ったブロック*/
#footer2-parts div.footer2-1-parts {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 1rem;	/*このブロック内のボックス同士の間に空ける余白。１文字分。*/
}

/*メニューブロック*/
#footer2-parts div.footer2-2-parts {
    flex: 1;
}

	/*画面700px以上の追加指定*/
	@media screen and (min-width:700px) {

	#footer2-parts {
		display: flex;
		gap: 2rem;		/*ロゴのブロックとメニューのブロックとの間の余白。2文字分。*/
	}

	/*ロゴやSNSアイコンが入ったブロック*/
	#footer2-parts div.footer2-1-parts {
		text-align: left;
		width: 40%;	/*幅。40%。*/
	}

	/*メニューブロック*/
	#footer2-parts div.footer2-2-parts {
		/*margin-bottom: 0;	下の余白をなくす*/
	}

	}/*追加指定ここまで*/


/*Copyright部分*/
#footer2-parts small {
	display: block;
	text-align: right;
	margin-top: 2rem;
}


/*SNSアイコン
---------------------------------------------------------------------------*/
.sns1-parts {
	list-style: none;
	margin: 0;padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;		/*アイコン同士のマージン的な要素。１文字分。*/
}

.sns1-parts i {
	font-size: 30px;	/*アイコンサイズ*/
}


/*Google Map用
---------------------------------------------------------------------------*/
.iframe-box1-parts {
	width: 100%;
	height: 0;
	padding-top: 56.25% !important;	/*マップの高さを増やしたい場合は、ここの数値を上げてみて下さい。*/
	position: relative;
	overflow: hidden;
}
.iframe-box1-parts iframe {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
}

/*テーブル
---------------------------------------------------------------------------*/
/*テーブル１行目に入った見出し部分（※caption）*/
.ta2-parts caption {
	font-weight: bold;		/*太字に*/
	padding: 0.2rem 1rem;	/*ボックス内の余白*/
	margin-bottom: 15px;	/*下に空けるスペース*/
	border-radius: 5px;		/*角を丸くする指定*/
	background: #555;		/*背景色*/
	color: #fff;			/*文字色*/
}

/*テーブルブロック設定*/
.ta2-parts {
	table-layout: block;
	width: 100%;
	margin-bottom: 2rem;		/*テーブルの下に空けるスペース。２文字分。*/
	background: #000;		/*テーブル全体の背景色*/
	color: #fff;			/*テーブル全体の文字色*/
}

/*th（左側）、td（右側）の共通設定*/
.ta2-parts th, .ta2-parts td {
	padding: 1rem;		/*ボックス内の余白*/
	word-break: break-all;	/*英語などのテキストを改行で自動的に折り返す設定。これがないと、テーブルを突き抜けて表示される場合があります。*/
}

/*th（左側）のみの設定*/
.ta2-parts th {
	width: 50%;			/*幅*/
	text-align: left;	/*左よせにする*/
	background: #eee;	/*背景色*/
}
