@charset "UTF-8";

body { margin: 0; padding: 0; background: #231816; font-family: 'Noto Serif JP', Helvetica,'Lucida Grande','Hiragino Kaku Gothic Pro','ヒラギノ角ゴ Pro W3',Meiryo,'メイリオ','ＭＳ Ｐゴシック',sans-serif; text-shadow: 1px 1px 0 #fff; line-height: 1.5; -webkit-text-size-adjust: none; }
img { border: 0; -ms-interpolation-mode: bicubic; }
form { margin: 0; padding: 0; }
a { outline: none; }
a:link { color: #; text-decoration: none; }
a:visited { color: #; text-decoration: none; }
a:hover { color: #; text-decoration: underline; }
.clearfix { *zoom: 1; }
.clearfix:after { content: ''; display: block; clear: both; height: 0; }
* { text-shadow: 0px 0px 0px #00000040 !important; }

/* グローバルヘッダー */
div#globalHeader { display: grid; grid-template-rows: 80px; grid-template-columns: 50% 50%; height: 120px; background-color: #fff; }
div.main { grid-row: 1/2; grid-column: 1/2; padding: 10px 0 0 0; }
div.address { grid-row: 1/2; grid-column: 2/3; padding: 20px 20px 0 0; text-align: right; font-size: 18px; font-weight: bold; }
div.address span { font-size: 24px; }
a.logo img { width: 230px; height: auto; margin: 0 0 0 20px; }

/* スマホ用メニュー */
div.globalNavigation_sp { display: none; }

/* PC用メニュー */
div.globalNavigation {  width: 100%; display: block; }
div.globalNavigation ul { margin: 0 auto; width: 980px; list-style: none; text-align: center; }
div.globalNavigation li { width: 245px; height: 40px; float: left; position: relative; font-size: 22px; }
div.globalNavigation li a { color: #fff; }

/* 共通 */
.contents_title { width: 80%; margin: 20px auto; text-align: center; color: #fff; font-size: 24px; position: relative; padding: 10px 0; }
.contents_title::before, .contents_title::after { content: ''; position: absolute; left: 0; width: 100%; height: 3px; background-color: #fff; }
.contents_title::before { top: 0; }
.contents_title::after { bottom: 0; }

/* CONCEPT */
div#concept { text-align: center; width: 100%; }
img.main_photo { width: 100%; }
img.concept_photo01 { width: 80%; display: inline; }
img.concept_photo02 { width: 80%; display: inline; }
img.concept_photo01_sp { width: 80%; display: none; }
img.concept_photo02_sp { width: 80%; display: none; }
div#concept02 { background: #fdedd9; width: 100%; text-align: center; font-weight: bold; font-size: 120%; padding: 30px 0 30px 0; }
.image_grid { display: flex; flex-wrap: wrap; gap: 10px; width: 80%; max-width: 980px; margin: 20px auto; }
.image-item { flex: 1 1 calc(25% - 10px); box-sizing: border-box; }
.image-item img { width: 100%; height: auto; display: block; }
div#concept03 { display: grid; grid-template-rows: 1f; grid-template-columns: 50% 50%; width: 980px; padding: 50px 60px 50px 60px; margin: 0 auto; }
div.party_photo { grid-row: 1/2; grid-column: 1/2; }
div.party_photo img { width: 100%; }
div.party_text { grid-row: 1/2; grid-column: 2/3; color: #fff; padding: 0 0 0 20px; }
span.party_text_title { font-size: 260%; }
span.party_text_sub_title { font-size: 140%; color: #ffe80c; padding-left: 20px;  }

/* LUNCH */
div#lunch  { text-align: center; width: 100%; background: #fff; padding: 40px 0 40px 0; }
img.lunch_title { width: 50%; padding-bottom: 30px; }
div#lunch_grid { display: grid; grid-template-rows: 1f; grid-template-columns: 25% 25% 25% 25%; width: 980px; margin: 0 auto; }
div.lunch_grid01 { grid-row: 1/2; grid-column: 1/2; }
div.lunch_grid02 { grid-row: 1/2; grid-column: 2/3; }
div.lunch_grid03 { grid-row: 1/2; grid-column: 3/4; }
div.lunch_grid04 { grid-row: 1/2; grid-column: 4/5; }
div.lunch_grid01 img { width: 100%; }
div.lunch_grid02 img { width: 100%; }
div.lunch_grid03 img { width: 100%; }
div.lunch_grid04 img { width: 100%; }
div#lunch_grid02 { display: grid; grid-template-rows: 1f; grid-template-columns: 16% 16% 16% 16% 36%; width: 980px; margin: 0 auto; }
div.lunch_grid05 { grid-row: 1/2; grid-column: 1/2; }
div.lunch_grid06 { grid-row: 1/2; grid-column: 2/3; }
div.lunch_grid07 { grid-row: 1/2; grid-column: 3/4; }
div.lunch_grid08 { grid-row: 1/2; grid-column: 4/5; }
div.lunch_grid09 { grid-row: 1/2; grid-column: 5/6; }
div.lunch_grid05 img { width: 90%; }
div.lunch_grid06 img { width: 90%; }
div.lunch_grid07 img { width: 90%; }
div.lunch_grid08 img { width: 90%; }
div.lunch_grid09 img { width: 100%; }

/* DOG */
div#dog  { text-align: center; width: 100%; background: #231816; padding: 40px 0 40px 0; }
div#dog_grid { display: grid; grid-template-rows: 1f; grid-template-columns: 50% 50%; width: 980px; margin: 0 auto; background: #fff; padding: 20px 0 20px 0; }
div.dog_grid01 { grid-row: 1/2; grid-column: 1/2; }
div.dog_grid02 { grid-row: 1/2; grid-column: 2/3; }
div.dog_grid01 img { width: 90%; }
div.dog_grid02 img { width: 90%; }

/* ACCESS */
div#access  { text-align: center; width: 100%; padding: 40px 0 40px 0; }
div#access_grid { display: grid; grid-template-rows: 50% 1f; grid-template-columns: 50% 50%; width: 980px; margin: 0 auto; padding: 20px 0 20px 0; }
div.access_grid01 { grid-row: 1/2; grid-column: 1/2; }
div.access_grid02 { grid-row: 2/3; grid-column: 1/2; }
div.access_grid03 { grid-row: 1/3; grid-column: 2/3; }
div.access_grid03_inner { text-align: left; color: #fff; padding-left: 20px; }
div.access_grid03_inner span { font-size: 140%; }
div.access_grid01 img { width: 100%; }
div.access_grid02 img { width: 100%; }
img.footer_logo { width: 40%; padding: 0; margin: 0; }
div#access_grid03_inner_grid { display: grid; grid-template-rows: 12% 12% 12% 12% 12% 12% 12% 1f; grid-template-columns: 30% 70%; }
div.access_grid03_inner_grid01 { grid-row: 1/2; grid-column: 1/2; border-bottom: 2px solid #fff; padding: 0 0 15px 0; }
div.access_grid03_inner_grid02 { grid-row: 2/3; grid-column: 1/2; border-bottom: 2px solid #fff; padding: 15px 0 15px 0; }
div.access_grid03_inner_grid03 { grid-row: 3/4; grid-column: 1/2; border-bottom: 2px solid #fff; padding: 15px 0 15px 0;  }
div.access_grid03_inner_grid04 { grid-row: 4/5; grid-column: 1/2; border-bottom: 2px solid #fff; padding: 15px 0 15px 0;  }
div.access_grid03_inner_grid05 { grid-row: 5/6; grid-column: 1/2; border-bottom: 2px solid #fff; padding: 15px 0 15px 0;  }
div.access_grid03_inner_grid06 { grid-row: 6/7; grid-column: 1/2; border-bottom: 2px solid #fff; padding: 15px 0 15px 0;  }
div.access_grid03_inner_grid07 { grid-row: 7/8; grid-column: 1/2; border-bottom: 2px solid #fff; padding: 15px 0 15px 0;  }
div.access_grid03_inner_grid01_right { grid-row: 1/2; grid-column: 2/3; border-bottom: 2px solid #fff; padding: 0 0 15px 0; }
div.access_grid03_inner_grid02_right { grid-row: 2/3; grid-column: 2/3; border-bottom: 2px solid #fff; padding: 15px 0 15px 0;  }
div.access_grid03_inner_grid03_right { grid-row: 3/4; grid-column: 2/3; border-bottom: 2px solid #fff; padding: 15px 0 15px 0;  }
div.access_grid03_inner_grid04_right { grid-row: 4/5; grid-column: 2/3; border-bottom: 2px solid #fff; padding: 15px 0 15px 0;  }
div.access_grid03_inner_grid05_right { grid-row: 5/6; grid-column: 2/3; border-bottom: 2px solid #fff; padding: 15px 0 15px 0;  }
div.access_grid03_inner_grid06_right { grid-row: 6/7; grid-column: 2/3; border-bottom: 2px solid #fff; padding: 15px 0 15px 0;  }
div.access_grid03_inner_grid07_right { grid-row: 7/8; grid-column: 2/3; border-bottom: 2px solid #fff; padding: 15px 0 15px 0;  }
.card_img { width: 100%; }

#map { margin: 20px 0 20px 0; position: relative; width: 100%; height: 0; padding-top: 75%; }


/* フッター */
div#globalFooter { width: 100%; padding: 0 0 20px 0; margin: 0 auto; text-align: center; }
div#globalFooter div.copy p { margin: 0; padding: 0; font-size: 90%; color: #fff;}

@media (max-width: 600px) {
	
	/* グローバルヘッダー */
	div#globalHeader { display: grid; grid-template-rows: 120px 1f; grid-template-columns: 100%; height: auto; padding: 10px 0 10px 0; }
	div.main { grid-row: 1/2; grid-column: 1/2; padding: 0; text-align: center; }
	div.address { grid-row: 2/3; grid-column: 1/2; padding: 0; text-align: center; font-size: 80%; }
	div.address span { font-size: 120%; }
	a.logo img { width: 180px; height: auto; margin: 0; padding: 0; }
	
	/* スマホ用メニュー */
	div.globalNavigation_sp { display: block; grid-row: 1/2; grid-column: 1/2; }
	div.globalNavigation_sp { position: fixed; width: 100%; height: 52px; grid-row: 1/2; grid-column: 1/2; z-index: 1000; transition: background-color 0.3s ease-in-out; }
	.menu { list-style: none; position: absolute; width: 100%; height: auto; top: 0; margin-top: 52px; padding: 0 0 10px 0; clear: both; background: rgba(0, 0, 0, 0.7); transition: 0.3192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.1008s; transform: scale(1, 0); transform-origin: top; }
	.menu-btn:checked ~ .menu { transform: scale(1, 1); transform-origin: top; transition: 0.3192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.1008s; }
	.menu a { text-decoration: none; font-weight: 500; letter-spacing: 2px; font-size: 16px; text-transform: capitalize; color: #ddd; opacity: 0; transition: 0.5s; }
	.menu li { border-top: 1px solid #fff; padding: 15px 0; margin: 0 54px; opacity: 0; transition: 0.5s; }
	.menu li:first-child { border-top: none; }
	.menu-btn:checked ~ .menu a,
	.menu-btn:checked ~ .menu li { opacity: 1; transition: 0.3192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.2s; }
	.menu-btn { display: none; }
	.menu-icon { display: inline-block; position: relative; cursor: pointer; padding: 24px 14px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
	.navicon { background: #000; display: block; height: 3px; width: 26px; position: relative; transition: 0.3192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.1008s; }
	.navicon:before,
	.navicon:after { content: ""; display: block; height: 100%; width: 100%; position: absolute; background: #000; transition: 0.3192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.1008s; }
	.navicon:before { top: 9px; }
	.navicon:after { bottom: 9px; }
	.menu-btn:checked ~ .menu-icon .navicon:before { transform: rotate(-45deg); }
	.menu-btn:checked ~ .menu-icon .navicon:after { transform: rotate(45deg); }
	.menu-btn:checked ~ .menu-icon:not(.steps) .navicon:before { top: 0; }
	.menu-btn:checked ~ .menu-icon:not(.steps) .navicon:after { bottom: 0; }
	.menu-btn:checked ~ .menu-icon .navicon { background: rgba(0, 0, 0, 0); transition: 0.2192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.1008s; }
	div.globalNavigation { display: none; }
	
	/* 共通 */
	.contents_title { width: 90%; font-size: 120%; padding: 2px 0 4px 0; margin: 15px auto; }
	.contents_title::before, .contents_title::after { height: 2px; }
	
	/* CONCEPT */
	img.concept_photo01 { display: none; }
	img.concept_photo02 { display: none; }
	img.concept_photo01_sp { width: 100%; display: inline; }
	img.concept_photo02_sp { width: 90%; display: inline; }
	div#concept02 p { font-size: 90%; width: 90%; margin: 0 auto; }
	.image-item { flex: 1 1 calc(50% - 10px); }
	.image-item img { width: 100%; height: auto; }
	div#concept03 { grid-template-rows: 1f 1f; grid-template-columns: 100%; width: 100%; padding: 20px 0 0 0; }
	div.party_photo { grid-row: 1/2; grid-column: 1/2; text-align: center; }
	div.party_photo img { width: 90%; }
	div.party_text { grid-row: 2/3; grid-column: 1/2; padding: 0 auto; width: 90%; }
	div.party_text p br { display: none; }
	span.party_text_title { font-size: 260%; }
	span.party_text_sub_title { font-size: 140%; color: #ffe80c; padding-left: 20px;  }
	
	/* LUNCH */
	div#lunch  { padding: 20px 0 20px 0; }
	img.lunch_title { width: 90%; padding: 0 0 10px 0; }
	div#lunch_grid { grid-template-rows: 1f 1f; grid-template-columns: 50% 50%; width: 90%; margin: 0 auto; }
	div.lunch_grid01 { grid-row: 1/2; grid-column: 1/2; }
	div.lunch_grid02 { grid-row: 1/2; grid-column: 2/3; }
	div.lunch_grid03 { grid-row: 2/3; grid-column: 1/2; }
	div.lunch_grid04 { grid-row: 2/3; grid-column: 2/3; }
	div#lunch_grid02 { display: grid; grid-template-rows: 1f 1f; grid-template-columns: 25% 25% 25% 25%; width: 95%; }
	div.lunch_grid05 { grid-row: 1/2; grid-column: 1/2; }
	div.lunch_grid06 { grid-row: 1/2; grid-column: 2/3; }
	div.lunch_grid07 { grid-row: 1/2; grid-column: 3/4; }
	div.lunch_grid08 { grid-row: 1/2; grid-column: 4/5; }
	div.lunch_grid09 { grid-row: 2/3; grid-column: 1/5; }
	div.lunch_grid09 img { width: 70%; padding-top: 15px; }
	
	/* DOG */
	div#dog_grid { grid-template-rows: 1f 1f; grid-template-columns: 100%; width: 80%; padding: 20px 0 0 0; }
	div.dog_grid01 { grid-row: 1/2; grid-column: 1/2; }
	div.dog_grid02 { grid-row: 2/3; grid-column: 1/2; }
	div.dog_grid01 img { width: 90%; }
	div.dog_grid02 img { width: 90%; }
	
	/* ACCESS */
	div#access  { padding: 0px 0 10px 0; }
	div#access_grid { grid-template-rows: 33% 33% 1f; grid-template-columns: 100%; width: 100%; padding: 10px 0 10px 0; }
	div.access_grid01 { grid-row: 1/2; grid-column: 1/2; }
	div.access_grid02 { grid-row: 3/4; grid-column: 1/2; }
	div.access_grid03 { grid-row: 2/3; grid-column: 1/2; }
	div.access_grid03_inner { padding: 20px 0 0 0; text-align: center; }
	div.access_grid01 img { width: 90%; }
	
	div#access_grid03_inner_grid { width: 90%; margin: 0 auto; grid-template-columns: 20% 80%;}
	div.access_grid03_inner_grid01 { grid-row: 1/2; grid-column: 1/2; border-bottom: 2px solid #fff; padding: 0 0 5px 0; text-align: left; }
	div.access_grid03_inner_grid02 { grid-row: 2/3; grid-column: 1/2; border-bottom: 2px solid #fff; padding: 15px 0 5px 0; text-align: left; }
	div.access_grid03_inner_grid03 { grid-row: 3/4; grid-column: 1/2; border-bottom: 2px solid #fff; padding: 15px 0 5px 0; text-align: left;  }
	div.access_grid03_inner_grid04 { grid-row: 4/5; grid-column: 1/2; border-bottom: 2px solid #fff; padding: 15px 0 5px 0; text-align: left;  }
	div.access_grid03_inner_grid05 { grid-row: 5/6; grid-column: 1/2; border-bottom: 2px solid #fff; padding: 15px 0 5px 0; text-align: left;  }
	div.access_grid03_inner_grid06 { grid-row: 6/7; grid-column: 1/2; border-bottom: 2px solid #fff; padding: 15px 0 5px 0; text-align: left;  }
	div.access_grid03_inner_grid07 { grid-row: 7/8; grid-column: 1/2; border-bottom: none; padding: 15px 0 5px 0; text-align: left;  }
	div.access_grid03_inner_grid01_right { grid-row: 1/2; grid-column: 2/3; border-bottom: 2px solid #fff; padding: 0 0 5px 15px; text-align: left; }
	div.access_grid03_inner_grid02_right { grid-row: 2/3; grid-column: 2/3; border-bottom: 2px solid #fff; padding: 15px 0 5px 15px; text-align: left;  }
	div.access_grid03_inner_grid03_right { grid-row: 3/4; grid-column: 2/3; border-bottom: 2px solid #fff; padding: 15px 0 5px 15px; text-align: left;  }
	div.access_grid03_inner_grid04_right { grid-row: 4/5; grid-column: 2/3; border-bottom: 2px solid #fff; padding: 15px 0 5px 15px; text-align: left;  }
	div.access_grid03_inner_grid05_right { grid-row: 5/6; grid-column: 2/3; border-bottom: 2px solid #fff; padding: 15px 0 5px 15px; text-align: left;  }
	div.access_grid03_inner_grid06_right { grid-row: 6/7; grid-column: 2/3; border-bottom: 2px solid #fff; padding: 15px 0 5px 15px; text-align: left;  }
	div.access_grid03_inner_grid07_right { grid-row: 7/8; grid-column: 2/3; border-bottom: none; padding: 15px 0 5px 15px; text-align: left;  }
	.card_img { width: 80%; padding: 10px 0 30px 0; }
	
	#map { margin: 0 auto; position: relative; width: 90%; height: 0; padding-top: 75%; }
	
	/* フッター */
	div#globalFooter div.copy p { font-size: 70%; }
	
}