/* ロゴ アニメーション画面
=========================================================================
=========================================================================*/
#logo_bg {
	overflow: hidden;
	display: none;
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	background: #FFF;
	z-index: 100;
}

#logo_bg #logo {
	display: none;
	position: fixed;
	top: 50%;
	left: 50%;
	width: 240px;
	height: 52px;
	margin-left: -120px;
	margin-top: -26px;
	overflow: hidden;
}

#logo_bg #logo svg {
	width: 240px;
	height: 52px;
}

/* ヒーロースペース：スライドショー
=========================================================================
=========================================================================*/
#hero_space {
	overflow: hidden;
	position: relative;
	margin: 0;
	padding: 0;
	width: 100%;
	font-size: 0;
}

#hero_space #slide01 {
	width: 100%;
	background: url(../img/home/slider01.jpg) center center no-repeat;
	background-size: cover;
}

#hero_space #slide02 {
	width: 100%;
	background: url(../img/home/slider02.jpg) center center no-repeat;
	background-size: cover;
}

#hero_space #slide03 {
	width: 100%;
	background: url(../img/home/slider03.jpg) center center no-repeat;
	background-size: cover;
}

#hero_space #top_copy img {
	overflow: hidden;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	width: 475px;
	z-index: 2;
}


/* ----- Conceptボタン ----- */
#hero_space_concept {
	position: absolute;
	bottom: 43px;
	left: 0;
	right: 0;
	margin: 0 auto;
	width: 952px;
	height: 73px;
	z-index: 2;
}

@media (max-width:992px) {
	#hero_space_concept {
		width: 100%;
		padding: 0 20px;
	}
}

#hero_space_concept a.button_concept {
	position: absolute;
	right: 14px;
	overflow: hidden;
	display: block;
	width: 208px;
	height: 73px;
	text-align: left;
	text-indent: 100%;
	white-space: nowrap;
	background: url(../img/home/top_button_concept.png) center center no-repeat;
	background-size: contain;
}

/* ----- スクロールボタン ----- */
#hero_space_scroll {
	position: absolute;
	bottom: 40px;
	width: 100%;
	height: 11px;
	z-index: 2;
}

#hero_space_scroll a.button_scroll {
	overflow: hidden;
	display: block;
	margin: 0 auto;
	width: 22px;
	height: 11px;
	text-align: left;
	text-indent: 100%;
	white-space: nowrap;
	background: url(../img/home/button_scroll@2x.png) center center no-repeat;
	background-size: contain;
	animation: blink 1s infinite;
}

@keyframes blink {
	0% {
		opacity: 0.2;
	}

	100% {
		opacity: 1;
	}
}

/* カスタマイズ
------------------------------------------------------------------------ */
.slider {
	display: none;
}

.slider.slick-initialized {
	display: block;
}

/* CONCEPT
=========================================================================
=========================================================================*/
#concept {
	overflow: hidden;
	position: relative;
	width: 952px;
	height: 600px;
	margin: 0 auto;
	padding: 0;
	background: #FFF;
}

/* ----- キャッチコピー ----- */
#concept .catch {
	position: absolute;
	top: 119px;
	left: 39px;
	width: 300px;
	height: 87px;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
	background: url(../img/home/concept_cacth.png) center center no-repeat;
	background-size: cover;
}

#concept h1 {
	display: table;
	position: absolute;
	top: 305px;
	left: 57px;
	font-family: 'Spectral', serif;
	font-size: 20px;
	font-size: 2.0rem;
	font-weight: 300;
	line-height: 2.0em;
}

#concept .concept_text {
	display: block;
	position: absolute;
	top: 105px;
	left: 531px;
}

#concept .concept_text h2 {
	margin-bottom: 3em;
	font-size: 20px;
	font-size: 2.0rem;
	line-height: 1.7em;
}

#concept .concept_text p {
	font-size: 15px;
	font-size: 1.5rem;
	line-height: 2.4em;
}

@media (max-width:992px) {
	#concept {
		width: 100%;
		padding: 0 50px;
	}

	#concept .catch,
	#concept h1 {
		left: 50px;
	}

	#concept .concept_text {
		left: auto;
		right: 50px;
	}
}

/* DINING
=========================================================================
=========================================================================*/
#dining {
	overflow: hidden;
	position: relative;
	width: 100%;
	margin: 0 auto;
	padding: 43px 0 50px;
	text-align: left;
	background-color: #EEE;
}

/* ----- 写真 ----- */
#dining ul {
	display: flex;
	gap: 2px;
	margin-bottom: 46px;
}

/* ----- Instagramリンク ----- */
#dining .container {
	display: flex;
	gap: 60px;
	width: 475px;
	margin: 0 auto;
	padding: 0;
}

#dining .container a.instagram {
	display: inline-block;
	padding-top: 100px;
	font-family: 'Spectral', serif;
	font-size: 20px;
	font-size: 2.0rem;
	text-align: center;
	text-decoration: none;
	background: url(../img/home/instagram_logo.png) top center no-repeat;
	background-size: 131px auto;
}

#dining .container p {
	padding-top: 70px;
	padding-bottom: 10px;
	padding-left: 12px;
	font-size: 18px;
	font-size: 1.8rem;
	line-height: 1.7em;
	background: url(../img/home/dinig_followme.png) top left no-repeat;
	background-size: 131px auto;
}

/* ACCESS
=========================================================================
=========================================================================*/
#access {
	overflow: hidden;
	position: relative;
	width: 100%;
	margin: 0 auto;
	padding: 100px 0 0;
	text-align: center;
}

#access h1 {
	margin: 0 auto 67px;
	font-family: 'Spectral', serif;
	font-size: 26px;
	font-size: 2.6rem;
}

/* Google Map */
.map_wrapper {
	max-width: 100%;
	min-width: 540px;
	margin: 0 auto 30px;
	text-align: center;
}

#access #googlemap {
	position: relative;
	padding-bottom: 40%;
	height: 0;
	overflow: hidden;
}


#access #googlemap iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

#access dl {
	overflow: hidden;
	margin: 30px auto 110px;
	width: 880px;
	font-size: 14px;
	font-size: 1.4rem;
	text-align: left;
}

@media (max-width:890px) {
	#access dl {
		padding: 0 20px;
		width: 100%;
	}
}

#access dt {
	float: left;
	width: 110px;
}

#access dd {
	float: left;
}

/* ----- 大滝工務店ボタン ----- */
#access a.button_ohtaki {
	display: block;
	margin: 0 auto 90px;
	padding: 44px 13px;
	width: 600px;
	text-decoration: none;
	text-align: left;
	border-top: 1px solid #C3C3C3;
	border-bottom: 1px solid #C3C3C3;
	background: url(../img/home/ohtaki_logo.png) right 13px center no-repeat;
	background-size: 226px auto;
}

@media (max-width:640px) {
	#access a.button_ohtaki {
		width: 86%;
	}
}

#access a.button_ohtaki .catch_jp {
	margin: 0 0 9px;
	font-family: Georgia, 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
	font-size: 16px;
	font-size: 1.6rem;
	line-height: 1.0em;
}

#access a.button_ohtaki .catch_en {
	font-family: 'EB Garamond', serif;
	font-size: 16px;
	font-size: 1.6rem;
	letter-spacing: 0.03em;
	line-height: 1.0em;
}

/* ----- ボタン ----- */
#access a.button_contact {
	display: block;
	width: 660px;
	height: 95px;
	margin: 0 auto;
	text-decoration: none;
	font-family: 'Spectral', serif;
	font-size: 22px;
	font-size: 2.2rem;
	font-weight: 200;
	line-height: 95px;
	color: #EEE;
	background: #313131;
	border-radius: 3px;
}



/*  デスクトップ&タブレット（741px〜979px）
=========================================================================
=========================================================================*/
@media (max-width:979px) {

	/* ヒーロースペース：スライドショー
	=========================================================================
	=========================================================================*/
	#hero_space {}

	#hero_space #slide01 {
		width: 100%;

		background: url(../img/home/slider01@2x.jpg) center center no-repeat;
		background-size: cover;
	}

	#hero_space #slide02 {
		width: 100%;

		background: url(../img/home/slider02@2x.jpg) center center no-repeat;
		background-size: cover;
	}

	#hero_space #slide03 {
		width: 100%;

		background: url(../img/home/slider03@2x.jpg) center center no-repeat;
		background-size: cover;
	}

}

/*  スマホ（740px以下）
=========================================================================
=========================================================================*/
@media (max-width:740px) {

	/* ヒーロースペース：スライドショー
	=========================================================================
	=========================================================================*/
	#hero_space #slide01 {
		background: url(../img/home/slider01@2x.jpg) center center no-repeat;
		background-size: cover;
	}

	#hero_space #slide02 {
		background: url(../img/home/slider02@2x.jpg) center center no-repeat;
		background-size: cover;
	}

	#hero_space #top_copy img {
		width: calc(352 / 375 * 100%);
		max-width: 352px;
	}

	/* CONCEPT
	=========================================================================
	=========================================================================*/
	#concept {
		height: auto;
		padding: 0 0 45px;
		text-align: center;
	}

	#concept .catch {
		display: table;
		position: relative;
		top: auto;
		left: auto;
		margin: 50px auto;
		width: 173px;
		height: 51px;
		background: url(../img/home/concept_catch@2x.png) center center no-repeat;
		background-size: 173px auto;
	}

	#concept h1 {
		display: table;
		position: relative;
		top: auto;
		left: auto;
		margin: 0 auto 50px;
		font-size: 18px;
		font-size: 1.8rem;
		line-height: 2.0em;
		text-align: left;
		clear: left;
	}

	#concept .concept_text {
		display: table;
		position: relative;
		top: auto;
		left: auto;
		right: auto;
		margin: 0 auto 0;
		text-align: left;
	}

	#concept .concept_text h2 {
		margin-bottom: 2.2em;
		font-size: 20px;
		font-size: 2.0rem;
	}

	#concept .concept_text p {
		font-size: 15px;
		font-size: 1.5rem;
		line-height: 2.4em;
	}

	/* DINING
	=========================================================================
	=========================================================================*/
	#dining {
		padding: 22px 0 45px;
	}

	/* ----- 写真 ----- */
	#dining ul {
		flex-wrap: wrap;
		gap: 0;
		margin-bottom: 46px;
	}

	/* ----- Instagramリンク ----- */
	#dining .container {
		flex-wrap: wrap;
		gap: 0;
		width: 100%;
		margin: 0 auto;
		padding: 0 20px;
	}

	#dining .container a.instagram {
		margin: 0 auto 13px;
	}

	#dining .container p {
		display: inline-block;
		margin: 0 auto;
		padding-top: 70px;
		padding-bottom: 10px;
		padding-left: 12px;
	}

	/* ACCESS
	=========================================================================
	=========================================================================*/
	#access {
		padding: 50px 0 0;
	}

	/* ----- タイトル ----- */
	#access h1 {
		margin: 0 auto 30px;
		font-size: 20px;
		font-size: 2.0rem;
	}

	/* ----- Google Map ----- */
	#access #googlemap {
		padding-bottom: 60%;
	}

	#access p.traffic {
		margin: 0 auto 60px;
		padding: 0 20px;
		font-size: 13px;
		font-size: 1.3rem;
		text-align: left;
	}

	/* ----- 大滝工務店ボタン ----- */
	#access a.button_ohtaki {
		margin: 0 auto 60px;
		padding: 22px 13px;
		width: 86%;
		background: url(../img/home/ohtaki_logo.png) right 13px center no-repeat;
		background-size: 36% auto;
	}

	#access a.button_ohtaki .catch_jp {
		font-size: 2.6vw;
	}

	#access a.button_ohtaki .catch_en {
		font-size: 2.6vw;
	}

	/* ----- ボタン ----- */
	#access a.button_contact {
		width: 94%;
		height: 60px;
		font-size: 15px;
		font-size: 1.5rem;
		line-height: 60px;
	}

}

/*  スマホ（420px以下）
=========================================================================
=========================================================================*/
@media (max-width:420px) {

	/* ----- 大滝工務店ボタン ----- */
	#access a.button_ohtaki {
		margin: 0 auto 60px;
		padding: 22px 0;
		width: 90%;
		background: url(../img/home/ohtaki_logo.png) right 13px center no-repeat;
		background-size: 33% auto;
	}
}
