/*
 Theme Name:   habakiri Child
 Description:  habakiri Child Theme
 Template:     habakiri
 Text Domain:  habakiri-child
*/

body {
 margin:0;
	padding:0;
	font-family: "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", sans-serif;
}
.top-header {
position: relative;
  width: 100%;
	height:160px;
  background-size: cover;
}

.menu {
	position: absolute;
	bottom: 0;
	width:100%;
	height:84px;
	background: url("/wp-content/uploads/2021/01/menuback.png") repeat-x;
}

.menu > .content > ul > li {
	color:#000;
	float:left;
	list-style-type: none;
	margin:10px 10px;
	padding:10px;
	font-size: 12pt;
}

.menu3 {
	width:100%;
	height:84px;
}

.menu3 > .content > ul > li {
	color:#000;
	float:left;
	list-style-type: none;
	margin:80px 10px 0 10px;
	padding:10px;
	font-size: 12pt;
}




/*  メニュー設定 */

#menu img	{
	border: 0; 
	vertical-align: bottom; 
	margin:0;
	padding:0;
}

#menu, #menu ul {
	margin:0 auto;
	padding:0;
	list-style-type:none;
	width:720px;
} 

#menu li	{
	float:left;
	position:relative;
}


/*  メニュー横幅・*/
/*.menu01{
	width:100%;
}

.menu02{
	width:100%;
}

.menu03{
	width:100%;
}*/




/*  メニュー　sub */

.menu01_sub{
	margin:0px;
	width:144px;
	display: none;
	position: absolute;
	top:110px;
	left:0px;
}


.menu01_sub li a {
	display: block;
}



.menu02_sub{
	margin:0px;
	width:252px;
	display: none;
	position: absolute;
	top:35px;
	left:0px;
}


.menu02_sub li a {
	display: block;
	width:252px;
    padding:10px;
	height:50px;
	background:#000;
	color:#000;
	border-bottom:1px solid #fff;
}

.menu02_sub li a:hover {
	background:#ccc;
}

.btn {
	border-radius:0px;
}






.subtitle{
	background:#efefef;
	text-align: center;
}

h1 {
	font-size: 20pt;
	line-height: 30pt;
	font-weight: 100;
	margin-bottom:40px;
}
h2 {
display: block;
font-size: 1.5em;
margin-block-start: 0.83em;
margin-block-end: 0.83em;
margin-inline-start: 0px;
margin-inline-end: 0px;
font-weight: bold;
	}
.content {
	width:1000px;
	margin:0 auto;
	font-size: 10pt;
	line-height: 20pt;
}

.topix {
width:100%;
height:200px;
background:#000;
	margin-top:-20px;
	color:#fff;
}

.topix > .content > h2 {
	padding-top:20px;
}
.topix > .content2 > div {
	border-top:1px solid #ccc;
	border-bottom:1px solid #ccc;
	margin:5px 0px;
}

.footer {
	height:50px;
	margin-top:0px;
	text-align:center;
	color:#000;
}

.footer > a > img {
	margin:40px 10px 0 10px;
}

.cell {display:table; width:100%;}

.cell_left {
	clear:both; 
	display:table-cell; 
	float:left; 
	padding:10px; 
	width:25%; 
	background:#1c2a55; 
	text-align:center; 
	vertical-align:middle; 
	color:#fff; }

.cell_right {
	display:table-cell; 
	float:right; 
	width:75%;
	padding:10px;
	text-align:left; 
	vertical-align:middle;  
}

.tb {border-top:1px solid #000;}
.uw {border-bottom:1px solid #fff;}
.uk {border-bottom:1px solid #1c2a55;}
.lb {border-left:1px solid #000;}
.rb {border-right:1px solid #000;}
.ub {border-bottom:1px solid #000;}

.footerleft {
	display:inline; 
	width:350px; 
	height:350px; 
	background:#fff; 
	float:left; 
	text-align:center;
	display: flex;
  justify-content: center;
  align-items: center;
}

.footerright {
	height:350px; 
	float:left; 
	background:#fff; 
	margin:0 0 0 1px; 
	width:649px; 
	text-align:center;
	display: flex;
  justify-content: center;
  align-items: center;
}

.copytext {
	background-color:rgba(0,0,0,0.6); 
	position:absolute; 
	top:250px; 
	right:200px; 
	color:#fff; 
	width:250px; 
	height:400px; 
	padding:50px; 
	z-index:9999; 
	text-align:center;
}

.copytext_sub {
	-ms-writing-mode: tb-rl; 
	writing-mode: 
	vertical-rl; 
	text-align:left; 
	display: inline-block; 
	font-size:22pt;
}


/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc { display: block !important; }
.sp { display: none !important; }
/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 750px) {
.pc { display: none !important; }
.sp { display: block !important; }
	
.content {
	width:90%;
	margin:0 auto;
	font-size: 10pt;
	line-height: 20pt;
}

.content > img {
	width:100%;
	height:auto;
	}
.content > h1 {
	padding-top:20px;
	text-align: center;
}

	h1 {
	font-size: 14pt;
	line-height: 26pt;
	font-weight: 100;
		text-align:center;
}
h2 {
display: block;
font-size: 1.5em;
margin-block-start: 0.83em;
margin-block-end: 0.83em;
margin-inline-start: 0px;
margin-inline-end: 0px;
font-weight: bold;
		text-align:center;
	}
	
.spmenu {
	position:absolute; 
	width:100%; 
	height:50px; 
	top:50px; 
	right:0px; 
	z-index:1;
}
	
	
ul {
  	display: none;
	width:100%;
	padding: 0;
    background :#f4f4f4;
    list-style: none;
}

#toppaddng {
		margin-top:70px;	
	}

span {
  cursor: pointer;
}

li {
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}
	
li a:hover {
    background:#ccc;
}
	
li a {
	display: block;
	width:100%;
    padding: 15px;
    text-decoration: none;
    color: #000;
	}

/* スマホとグルメニュー暫定 */
.menu2 a {
    display: block;
    padding: 15px;
    text-decoration: none;
    color: #000;
}

#test {
    display: block;
	background: url("/wp-content/uploads/MENU-1.png") no-repeat;
	width:50px; height:50px;
    cursor :pointer;
	position: absolute;
	top:0px; right:10px;
}

#test2 {
    display: block;
    padding: 15px;
    text-decoration: none;
    color: #000;
}

.accordion{
    display: none;
}
.menu2 {
	max-width: 100%;
}

.menu2 ul {
	width:100%;
	margin-top:70px;
	padding: 0;
    background :#f4f4f4;
    list-style: none;
}

.menu2 li {
    height: 0;
    overflow: hidden;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}
	
.menu2 li a:hover {
    background:#ccc;
}

#menu_bar01:checked ~ #links01 li,
#menu_bar02:checked ~ #links02 li  {
    height: 54px;
    opacity: 1;
}

.cell_left {
	padding:10px; 
	width:100%; 
	background:#1c2a55; 
	text-align:center; 
	vertical-align:middle; 
	color:#fff;
	border-top:1px solid #000;
	border-left:1px solid #000;
	border-right:1px solid #000;
	}

.cell_right {
	padding:10px; 
	width:100%; 
	background:#fff; 
	text-align:center; 
	vertical-align:middle; 
	color:#000;
	border-top:1px solid #000;
	border-left:1px solid #000;
	border-right:1px solid #000; 
}

.ub {border-bottom:1px solid #000;}

.footerleft {
	background:#fff; 
	text-align:center;
	display: flex;
  justify-content: center;
  align-items: center;
	width:100%;
	height:200px;
}

.footerright {
	background:#fff; 
	text-align:center;
	display: flex;
  justify-content: center;
  align-items: center;
		width:100%;
	margin:1px 0 0 0;
	padding:10px;
	height:200px;
}

.copytext {
	background-color:rgba(0,0,0,0.6); 
	position:absolute; 
	top:140px; 
	right:20px; 
	color:#fff; 
	width:120px; 
	height:200px; 
	padding:20px; 
	z-index:9999; 
	text-align:center;
}

.copytext_sub {
	-ms-writing-mode: tb-rl; 
	writing-mode: 
	vertical-rl; 
	text-align:left; 
	display: inline-block; 
	font-size:12pt;
}
	
}
