/*
 Theme Name:   habakiri Child
 Description:  habakiri Child Theme
 Template:     habakiri
 Text Domain:  habakiri-child
*/
   @font-face {
     font-family: 'Hiragino Gothic';
     src: url('path/to/hiragino-gothic.woff2') format('woff2'),
          url('path/to/hiragino-gothic.woff') format('woff');
     font-weight: normal;
     font-style: normal;
   }


a {
	color:#000;
}

a:hover {
	color:#ccc;
	text-decoration:none !important;
}
body {
font-family: "a-otf-ryumin-pr6n", serif;
font-weight: 300;
font-style: normal;
}

#container {
	width:1100px;
	background:#f2f2f2;	
	margin:0 auto;
	position:relative;
}

.sub-page-contents {
  margin-left: 50px;
  width: 850px;
  margin-left: 250px;
}

.side_menu {
	width:250px;
	background:#fff;
	position:absolute;
	left:0px;
	top:0px;
	height:100%;
}

.side_menu img {
	width:180px;
 position: absolute;
  top: 50px;
  left: 50%;
  transform: translate(-50%, 0%);
}

.side_menu ul {
	width:250px;
	position:absolute;
	top:150px;
	left:30px;
	margin:0 auto 0;
	padding:0px;
}


.side_menu ul li {
	list-style: none;
	padding:0px;
	margin:20px 0px;
	font-family: 'Hiragino Gothic', sans-serif;
	font-size:10pt;
}

.container {
		font-family: 'Hiragino Gothic', sans-serif;
	font-size:10pt;
	width:100%;
	margin:0;
	padding:0px 80px;
}

.col-md-offset-1 {
	margin:0;
}

.col-md-10 {
	width:100%;
}

.grid {
	width:900px;
  margin: 0 auto;
}

.item {
  width: 213px; /* 3列・2カ所のgutterがあるので40pxを引く */
  margin-bottom: 20px;
  float: left;
}
.item img {
  display: block;
  width: 100%;
  height: auto;
}

h3.inbound_title {
	font-family: 'Hiragino Gothic', sans-serif;
	font-weight:100;
	font-size:20pt;
	color:#172a88;
}

.hrcolor {
	color:#172a88;
}

.fs15 {
	font-size:15pt;
}

.fs15_b {
	font-size:15pt;	
	color:#172a88;
}

.icon1 {
	background:#fff url(/wp-content/uploads/icon1.jpg) no-repeat;
	width:100%;
	height:47px;
	padding:14px 0 0 70px;
}
.icon2 {
	background:#fff url(/wp-content/uploads/icon2.jpg) no-repeat;
	width:100%;
	height:47px;
	padding:14px 0 0 70px;
}
.icon3 {
	background:#fff url(/wp-content/uploads/icon3.jpg) no-repeat;
	width:100%;
	height:47px;
	padding:14px 0 0 70px;
}
.icon4 {
	background:#fff url(/wp-content/uploads/icon4.jpg) no-repeat;
	width:100%;
	height:47px;
	padding:14px 0 0 70px;
}
.hmenu {
	width:500px;
	position:absolute;
	top:10px;
	right:50px;
}
.header {
	background:none !important;
}

.fb {
	position:absolute;
	top:10px;
	right:0px;
}

.catch_r {
	  width: 900px;
  height: 900px;
  background-color: #CA0A15;;
  border-radius: 50%;
  color: #fff;
  text-align: center;
	position:relative;
	left:50%;
	transform: translate(-50%,-12%);
	padding:100px 135px;
}

.catch_r_t {
	text-align:left;
}

.shouhin {
	width:900px;
	display:flex;
  justify-content: space-between; /* 均等に並べる */
  align-items: center; /* 高さを揃える */
	position:relative;
	left:50%;
	transform: translate(-50%,-250px);
}

.shouhin div {
  width: 280px !important;       /* または flex: 1; margin: 0 10px; など */
  object-fit: cover; /* 必要に応じて */
}

.shouhin div img {
	width: 100% !important;       /* または flex: 1; margin: 0 10px; など */
}


.banner {
	width:900px;
	position:relative;
	left:50%;
	transform: translate(-50%,-150px);	
}

.fb_feed {
	width:900px;
	position:relative;
	left:50%;
	transform: translate(-50%,-150px);		
}

.fb_t {
	width:300px;
	margin:50px auto 0px;
	text-align:center;
}

.fotter {
	background:#F0EDE9;
}

.fotter2 {
	background:#F0EDE9;
	position:relative;
	top:-250px;
	margin-bottom:-250px;
}

.fottercontent {
	text-align:center;
	padding:30px 0px;
}

.f_txt {
	margin:50px 0px;
}

.f_txt span {
	font-size:18px;
}

.f_img {
	width:1000px;
	height:345px;
	margin:0 auto !important;
	position:relative;
	top: -250px;
}

.f_img img {
	position:absolute;
	right:0px;
}

.page-header {
	display:none;
}

.col-md-9 {
	width:100%;
}

.product-main {
	display:flex;
	width:100%;
	 justify-content: space-between; /* 均等に並べる */
  	align-items: start; /* 高さを揃える */
	flex-wrap: wrap;
}

.product-main a {
	color:#000;
}
.product-box {
  width: 300px;
	display: flex;
	flex-direction: column;/* または flex: 1; margin: 0 10px; など */
	}

.product-thumbnail {
	width:100%;
}

.product-thumbnail img {
	width:100%;
}

.related {
	display:none;
}

.product_meta {
	display:none;
}

.fs_16 {
	font-size:16pt;
	border-bottom:1px solid #000;
	margin-bottom:10px;
	padding-bottom:10px;
}

.txt_13 {
	font-size:13.5pt;
	line-height:23pt;
}
.pc { display: block !important; }
.sp { display: none !important; }


	.product-title {
		font-size:16pt !important;
	}

bdi {
	font-size:14pt;
}

.cff-wrapper-ctn {
	font-family:sans-serif;
}

.post-list-item {
	width:100%;
	padding:10px;
	flex:25%;
}

.post-thumbnail{
	width:100%;
}

.post-thumbnail img {
	width:100% !important;
}



@media only screen and (max-width: 765px) {
	
	
a {
	color:#000;
}

a:hover {
	color:#ccc;
	text-decoration:none;
}
body {
font-family: "a-otf-ryumin-pr6n", serif;
font-weight: 300;
font-style: normal;
}

#container {
	width:100%;
	background:#f2f2f2;	
	margin:0 auto;
	position:relative;
}

.sub-page-contents {
  margin-left: 0px;
  width: 100%;
  margin-left: 0px;
}

.side_menu {
	width:250px;
	background:#fff;
	position:absolute;
	left:0px;
	top:0px;
	height:100%;
}

.side_menu img {
	width:180px;
 position: absolute;
  top: 50px;
  left: 50%;
  transform: translate(-50%, 0%);
}

.side_menu ul {
	width:250px;
	position:absolute;
	top:150px;
	left:30px;
	margin:0 auto 0;
	padding:0px;
}


.side_menu ul li {
	list-style: none;
	padding:0px;
	margin:20px 0px;
	font-family: 'Hiragino Gothic', sans-serif;
	font-size:10pt;
}

.container {
		font-family: 'Hiragino Gothic', sans-serif;
	font-size:10pt;
	width:100%;
	margin:0;
	padding:0px 20px;
}

.col-md-offset-1 {
	margin:0;
}

.col-md-10 {
	width:100%;
}

.grid {
	width:100%;
  margin: 0 auto;
}

.item {
  width: 100%; /* 3列・2カ所のgutterがあるので40pxを引く */
  margin-bottom: 20px;
  float: left;
}
.item img {
  display: block;
  width: 100%;
  height: auto;
}

h3.inbound_title {
	font-family: 'Hiragino Gothic', sans-serif;
	font-weight:100;
	font-size:20pt;
	color:#172a88;
}

.hrcolor {
	color:#172a88;
}

.fs15 {
	font-size:15pt;
}

.fs15_b {
	font-size:15pt;	
	color:#172a88;
}

.icon1 {
	background:#fff url(/wp-content/uploads/icon1.jpg) no-repeat;
	width:100%;
	height:47px;
	padding:14px 0 0 70px;
}
.icon2 {
	background:#fff url(/wp-content/uploads/icon2.jpg) no-repeat;
	width:100%;
	height:47px;
	padding:14px 0 0 70px;
}
.icon3 {
	background:#fff url(/wp-content/uploads/icon3.jpg) no-repeat;
	width:100%;
	height:47px;
	padding:14px 0 0 70px;
}
.icon4 {
	background:#fff url(/wp-content/uploads/icon4.jpg) no-repeat;
	width:100%;
	height:47px;
	padding:14px 0 0 70px;
}
.hmenu {
	width:500px;
	position:absolute;
	top:10px;
	right:50px;
}
.header {
	background:#fff !important;
	height:90px;
}
	
	.splogo {
		position:absolute;
		top:25px;
		left:20px;
	}

.fb {
	position:absolute;
	top:10px;
	right:0px;
}

.catch_r {
	  width: 900px;
  height: 900px;
  background-color: #CA0A15;;
  border-radius: 50%;
  color: #fff;
  text-align: center;
	position:relative;
	left:50%;
	transform: translate(-50%,-12%);
	padding:100px 135px;
}

.catch_r_t {
	text-align:left;
}

.shouhin {
	width:900px;
	display:flex;
  justify-content: space-between; /* 均等に並べる */
  align-items: center; /* 高さを揃える */
	position:relative;
	left:50%;
	transform: translate(-50%,-250px);
}

.shouhin div {
  width: 280px !important;       /* または flex: 1; margin: 0 10px; など */
  object-fit: cover; /* 必要に応じて */
}

.shouhin div img {
	width: 100% !important;       /* または flex: 1; margin: 0 10px; など */
}


.banner {
	width:900px;
	position:relative;
	left:50%;
	transform: translate(-50%,-150px);	
}

.fb_feed {
	width:900px;
	position:relative;
	left:50%;
	transform: translate(-50%,-150px);		
}

.fb_t {
	width:300px;
	margin:50px auto 0px;
	text-align:center;
}

.fotter {
	background:#F0EDE9;
}

.fotter2 {
	background:#F0EDE9;
	position:relative;
	top:-250px;
	margin-bottom:-250px;
}

.fottercontent {
	text-align:center;
	padding:30px 0px;
}

.f_txt {
	margin:50px 0px;
}

.f_txt span {
	font-size:18px;
}

.f_img {
	width:1000px;
	height:345px;
	margin:0 auto !important;
	position:relative;
	top: -250px;
}

.f_img img {
	position:absolute;
	right:0px;
}

.page-header {
	display:none;
}

.col-md-9 {
	width:100%;
}

.product-main {
	display:flex;
	width:100%;
	 justify-content: space-between; /* 均等に並べる */
  	align-items: start; /* 高さを揃える */
	flex-wrap: wrap;
}

.product-main a {
	color:#000;
}
.product-box {
  width: 300px;
	display: flex;
	flex-direction: column;/* または flex: 1; margin: 0 10px; など */
	}

.product-thumbnail {
	width:100%;
}

.product-thumbnail img {
	width:100%;
}

.related {
	display:none;
}

.product_meta {
	display:none;
}

.fs_16 {
	font-size:16pt;
	border-bottom:1px solid #000;
	margin-bottom:10px;
	padding-bottom:10px;
}

.txt_13 {
	font-size:13.5pt;
	line-height:23pt;
}

	.pc { display: none !important; }
.sp { display: block !important; }
	



/* ナビゲーション */

#g-nav{
    /*position:fixed;にし、z-indexの数値を小さくして最背面へ*/
    position:fixed;
	z-index: -9999;
	opacity: 0;/*はじめは透過0*/
    /*ナビの位置と形状*/
	top:0;
	width:100%;
    height: 100vh;/*ナビの高さ*/
	background:#fff;
    /*動き*/
	transition: all 0.3s;
	display:none !important;
}

/*アクティブクラスがついたら透過なしにして最前面へ*/
#g-nav.panelactive{
	opacity: 0.9;
	z-index:2;
	background-image:url('/wp-content/uploads/flogo.png');
	background-repeat:no-repeat;
	background-position: 50px 85px;
	display:block !important;
}

/*ナビゲーションの縦スクロール*/
#g-nav.panelactive #g-nav-list{
    /*ナビの数が増えた場合縦スクロール*/
    position: fixed;
    z-index: 999; 
    width: 100%;
    height: 100vh;/*表示する高さ*/
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}

/*ナビゲーション*/
#g-nav ul {
    display: none;
    /*ナビゲーション天地中央揃え*/
    position: absolute;
    z-index: 999;
    top:100px;
    left:50%;
	transform: translate(-50%,0px);
	padding-left:0px !important;
}

#g-nav.panelactive ul {
    display: block;
}

/*リストのレイアウト設定*/

#g-nav li{
	list-style: none;
    text-align: center; 
	margin:30px 0px;
}

#g-nav li a{
	color: #333;
	text-decoration: none;
	padding:10px;
	display: block;
font-family: yu-mincho-pr6n, sans-serif;
font-style: normal;
font-weight: 700;
	font-size:16pt;
}

#g-nav li img{
	height:auto;
}


/*========= ボタンのためのCSS ===============*/
.openbtn{
	position:fixed;
    z-index: 9999;/*ボタンを最前面に*/
	top:20px;
	right: 40px;
	cursor: pointer;
    width: 40px;
    height:40px;
}
	
/*×に変化*/	
.openbtn span{
    display: inline-block;
    transition: all .4s;
    position: absolute;
    left: 14px;
    height: 3px;
    border-radius: 2px;
	background-color: #000;
  	width: 100%;
  }

.openbtn span:nth-of-type(1) {
	top:15px;	
}

.openbtn span:nth-of-type(2) {
	top:23px;
}

.openbtn span:nth-of-type(3) {
	top:31px;
}

.openbtn.active span:nth-of-type(1) {
    top: 18px;
    left: 18px;
    transform: translateY(6px) rotate(-45deg);
    width: 50%;
}

.openbtn.active span:nth-of-type(2) {
	opacity: 0;
}

.openbtn.active span:nth-of-type(3){
    top: 30px;
    left: 18px;
    transform: translateY(-6px) rotate(45deg);
    width: 50%;
}
	
	.fs_16 {
	font-size:13pt;
	border-bottom:1px solid #000;
	margin-bottom:10px;
	padding-bottom:10px;
}

.txt_13 {
	font-size:10pt;
	line-height:18pt;
}

	.post-list-item {
	width:100%;
}

.post-thumbnail{
	width:100%;
}

.post-thumbnail img {
	width:100% !important;
}
	
	.sns {
		position: absolute;
		bottom:10px;
		text-align:center;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);		
	}
	
	.sns img {
		width:50px;
		padding:10px;
	}
	
}

.wpcf7 {
  max-width: 100%;
  margin: 0 auto;
}

.wpcf7-form {
  padding: 1.5rem;
}

.wpcf7 label, .wpcf7 input, .wpcf7 textarea {
  font-size: 16px;
}

.wpcf7 label {
  font-weight: 300;
}

.wpcf7 input, .wpcf7 textarea {
  width: 100%;
  -webkit-appearance: none;
          appearance: none;
  border-radius: 5px;
border: none;
  padding: 12px;
  font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
}

.wpcf7 input[type="submit"] {
  max-width: 200px;
  margin: 0 auto;
  display: block;
}

.inputimg {
	width:297px !important;
	margin:0 auto;
	display:block;
}