
/* ------------------------------------------------------------ */
/* ホーム 共通設定 */

body,
td {
	
	color: #ffffff;
	
}

#system_h2,
#concept_h2,
#information_h2 {
	
	font-size: 2.5rem;
	font-family: serif;
	
}

#carousel_h2,
#system_wrap,
#concept_wrap,
#concept_div3,
#information_content {
	
	text-align: center;
	
}

#information_content {
	
	position: absolute;
	
}

#carousel_wrap,
#carousel_smoke,
#carousel_img {
	
	width: 100%;
	
}

#carousel_img,
#promotion_img {
	
	background-repeat: no-repeat;
	
}

#system_wrap,
#concept_wrap,
#summary_wrap {
	
	width: var(--content_width);
	height: 500px;
	
	margin: 80px auto 0;
	
	background-image: url('img/other/summary.avif');
	
	background-repeat: no-repeat;
	background-size: 100% auto;
	background-position: center;
	background-attachment: fixed;
	
}

#system_content,
#concept_content,
#summary_content {
	
	display: flex;
	
	height: 500px;
	
	background-color: #00000033;
	
}

#carousel_smoke,
#system_div1,
#concept_div3,
#summary_table tr,
#information_content {
	
	background-color: #00000066;
	
}

#system_div1,
#concept_div3,
#summary_table,
#information_content {
	
	width: calc(50% - 100px);
	height: 400px;
	
	margin: 50px auto 0;
	
}

/* ------------------------------------------------------------ */
/* ホーム ヘッダー */

#carousel_wrap {
	
	height: 600px;
	
}

#carousel_smoke,
#carousel_img {
	
	height: 100%;
	
}

#carousel_smoke {
	
	z-index: 2;
	
}

#carousel_img {
	
	z-index: 1;
	
	background-image: url('img/header/header1.avif');
	background-size: 1920px 800px;
	background-position: top center;
	
}

#carousel_h2 {
	
	position: absolute;
	
	z-index: 3;
	
	top: 265px;
	left: 0;
	
	width: 100%;
	
	color: #eeeeee;
	
	font-size: 5rem;
	font-family: serif;
	font-style: italic;
	
	text-shadow: 2px 2px 6px #000000;
	
}

/* ------------------------------------------------------------ */
/* ホーム システム */

#system_wrap {
	
}

#system_content {
	
}

#system_div1 {
	
}

#system_h2 {
	
	margin: 40px auto 20px;
	
}

.system_p {
	
	font-size: 1.8rem;
	
	line-height: 2.5;
	
}

#system_p2 {
	
	margin: 20px auto 0;
	
}

#system_div2 {
	
	display: flex;
	
	flex-wrap: wrap;
	
	width: calc(50% + 5px);
	
	background-color: #000000;
	
}

.system_img {
	
	width: calc(var(--content_width) * 0.25 - 7.5px);
	height: 245px;
	
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	
	margin-left: 10px;
	
}

#system_img1,
#system_img2 {
	
	margin-bottom: 5px;
	
}

#system_img3,
#system_img4 {
	
	margin-top: 5px;
	
}

#system_img1 {
	
	background-image: url('img/other/system_l1.avif');
	
}

#system_img2 {
	
	background-image: url('img/other/system_l2.avif');
	
}

#system_img3 {
	
	background-image: url('img/other/system_l3.avif');
	
}

#system_img4 {
	
	background-image: url('img/other/system_l4.avif');
	
}

/* ------------------------------------------------------------ */
/* お店紹介 Concept */

#concept_wrap {
	
}

#concept_content {
	
}

#concept_div1,
#concept_div2 {
	
	width: calc(25% - 7.5px);
	height: 100%;
	
	background-repeat: no-repeat;
	background-size: auto 500px;
	background-position: center;
	
	border-right: 10px solid #000000;
	
}

#concept_div1 {
	
	background-image: url('img/other/concept1.avif');
	
}

#concept_div2 {
	
	background-image: url('img/other/concept2.avif');
	
}

#concept_div3 {
	
}

#concept_h2 {
	
	margin: 40px auto 20px;
	
}

.concept_p {
	
	font-size: 1.8rem;
	
}

#concept_p1,
#concept_p2,
#concept_p3 {
	
	line-height: 3.0;
	
}

#concept_p4 {
	
	margin: 25px auto 0;
	
}

#concept_p7,
#concept_p8,
#concept_p9 {
	
	margin: 0 0 30px;
	
}

/* ------------------------------------------------------------ */
/* お店紹介 Summary 概要＋地図  */

#summary_wrap {
	
}

#summary_content {
	
}

#summary_table {
	
}

#summary_map {
	
	width: calc(50% - 5px);
	
	border-left: 10px solid #000000;
	
}

#summary_h2 {
	
	font-size: 4.0rem;
	
}

#summary_table tr {
	
	margin: 10px 0;
	
}

#summary_table td {
	
	padding: 12px 14px;
	
	font-size: 1.6rem;
	
}

.summary_td1 {
	
	width: 120px;
	
}

/* ------------------------------------------------------------ */
/* お知らせ Information  */

#information_content {
	
	top: 0;
	left: 50px;
	
}

#information_h2 {
	
	margin: 40px auto 20px;
	
}

