@charset "utf-8";

/* ----------------------- Browser Default Initialization */
html {
	//overflow-y: scroll;
}
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td	{
	margin: 0;	padding: 0;
}
address, caption, cite, code, dfn, em, strong, th, var	{
	font-style: normal;
}
table	{
	border-collapse: collapse;	border-spacing: 0;
}
caption, th	{
	text-align: left;
}
q:before ,q:after	{
	content: '';
}
object, embed	{
	vertical-align: top;
}
hr, legend	{
	display: none;
}
h1, h2, h3, h4, h5, h6	{
	font-size: 100%;
}
img, abbr, acronym, fieldset	{
	border: 0;
}
li	{
	list-style-type: none;
}
p, dd, blockquote	{
	text-align: justify;
	text-justify: inter-ideograph;
	line-break: normal; /*禁則処理*/
}

/* ----------------------- Basic Style */
/* ------------ Font Style */
body {
	font-family: "ＭＳ Ｐ明朝", "ヒラギノ明朝 Pro W3", "平成明朝",serif;
	font-size: 120%;
	line-height: 200%;
}
html>/**/body {
	font-size: 13px;
}

* + html body {
	font-family: "ＭＳ Ｐ明朝", "ヒラギノ明朝 Pro W3", "平成明朝",serif;
}
/*all
-----------------------------------------*/
html,body{
	padding-bottom: 50px;
	margin-left:15px; /*余白問題*/
}
a {
	color: #000;
	text-decoration: none;
}
a:hover {
	color:#990033;
}
a:active {
	color:#000;
}
/*
a:hover img{
	opacity:0.5;
	filter: alpha(opacity=50);
}
*/
.clear {
	clear:both;
}
/*contents
-----------------------------------------*/
#wrapper {
	width:1015px; /*本来1000px・余白問題で+15px*/
	margin:70px auto 0 auto;
}
#left_navi {
	position:relative;
	float:left;
	width:320px;
	margin-right:30px;
	height:auto !important;
}
#navi li{
	margin-bottom:5px;
}
li.ind{
	text-indent:10px;
}
#contents {
	float:left;
	width:650px;
	margin-top:25px;
}
ul#slide li {
	height:675px;
}
#contents_gal {
	float:left;
	width:650px;
	height:650px;
}
#company {
	position:absolute;
	bottom:0px;	
}

/*common contents
-----------------------------------------*/

h1.contents {
	position:relative;
	top:-5px;
	left:-84px;
	margin-bottom:20px;
	margin-top:-30px;
}
.pagetop {
	float:left;
	width:650px;
	margin-top:30px;
	padding-bottom:30px;
}
.pagetop_line{
	float:left;
	width:650px;
	margin-top:30px;
	margin-bottom:30px;
	padding-bottom:30px;
	border-bottom:1px dashed #000;
	display:block;
}
/*collection
-----------------------------------------*/
.col p{
	font-size:115%;
	margin-top:15px;
}
.col p.small{
	font-size:100%;
	line-height:160%;
	margin-top:10px;
}
.col b.big{
	font-size:150%;
	font-weight:normal;
}
strong {
	font-size:190%;
	font-weight:normal;
	line-height:120%;
	margin-bottom:50px;
}
h2,h3,h4,img.collection,p#spec {
	margin-bottom:22px;
}
h3.col {
	margin-bottom:-5px;
}
ul#image {
	width:650px;
	margin-bottom:50px;
}
ul#image li{
	float:left;
	margin-top:14px;
}
ul#image li#ht_min{
	line-height:140%;
}
ul.thum {
	width:650px;
	margin-bottom:40px;
}
ul.thum li{
	float:left;
	margin-top:14px;
}
ul.thum li.left{
	margin-right:60px;
}
ul.thum li a:hover img {
	opacity:0.7;
	filter: alpha(opacity=70);
}
ul#col_link {
	margin-bottom:30px;
}
ul#col_link li{
	float:left;
	margin-right:22px;
}
/*concept
-----------------------------------------*/
h3.con {
	margin-bottom:5px;
}
.img_r {
	float:right;
}
.img_l {
	float:left;
	margin-right:30px;
}
.img_r img, .img_l img{
	margin-top:30px;
}
.box {
	width:100%;
	margin-bottom: -20px;
	line-height: 200%;
}
/*furoshikihand
-----------------------------------------*/
.relative {
	position:relative;
}
.hand {
	position:absolute;
	top:760px;
	left:45px;
}
.m_tb {
	margin:30px 0 10px 0;
}
ul#image2 {
	width:650px;
	margin:14px 0 50px 0;
}
ul#image2 li{
	height:320px;
	float:left;
}
/*company
-----------------------------------------*/
p.s110 {
	font-size: 110%;
	line-height: 200%;
}
p.title {
	font-size: 130%;
	margin: 15px 0 15px 0;
}
table#gaiyo {
	width: 100%;
	border-collapse: collapse;
	line-height: 200%;
}
th {
	color: #B8183F;
	vertical-align: top;
}
th,td {
	padding-bottom: 10px;
}




/* レスポンシブ */
* {
	box-sizing: border-box;
	padding: 0;
	margin: 0;
}
html {
	font-size: 62.5%;
}
body {
	font-size: 1.6rem;
	padding: 0 !important;
}
img {
	max-width: 100%;
	height: auto;
}
#contents {
	padding: 4rem 0;
}
#sidebar {
	font-size: 1.3rem;
}
#page_link {
	display: block;
	width: 100%;
	text-align: center;
}
#wrapper {
	width: 100% !important;
	max-width: 1000px !important;
	margin: 0 auto !important;
	padding: 0 10px !important;
}
.nav-toggle {
	display: none;
	appearance: none;
	background-color: transparent;
	border-radius: 0;
	border: none;
	cursor: pointer;
	color: #000;
}
.nav-toggle::after {
	content: "\f0c9";
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	font-size: 3.4rem;
}
.nav-toggle.open::after {
	content: "\f00d";
}
#header {
	padding-top: 2rem;
	margin: 0 calc(50% - 50vw) !important;
	width: 98vw !important;
}
#header h1 {
	float: left;
}
#header ul li {
	font-size: 1.6rem;
	line-height: 1;
	margin-left: 28px !important;
	margin-bottom: 1rem;
}
iframe {
	max-width: 100%;
	aspect-ratio: 16/9;
	width: 100%;
	height: auto;
}
#left_navi {
	float: left;
	width: 200px;
	margin-top: -30px;
}
#contents P {
	margin: 2rem 0;
}

.wpcf7 {
	max-width: 350px;
	margin: 30px auto;
}
.wpcf7 input,
.wpcf7 textarea {
	width: 100%;
	font-size: 16px !important;
	padding: .4rem;
}
.wpcf7-submit {
	padding: 2rem;
}
.wpcf7-not-valid-tip {
	color: red;
}
.screen-reader-response {
	display: none;
}

@media screen and (max-width: 768px) {
	html {
		font-size: 50%;
	}
	html,body {
		margin-left: 0 !important;
	}
	#footlogo {
		text-align: center;
	}
	#footlogo img {
		width: 80px;
	}
	.sp-col-2 {
		flex-wrap: wrap;
		justify-content: flex-start;
	}
	.sp-col-2 > * {
		width: calc(100% / 2 - 5px);
	}
	.en-btn {
		margin-top: 50px;
	}
	.en-btn img {
		max-width: 80px;
	}
	#header {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		display: flex;
		justify-content: space-between;
		padding: .5rem 2rem;
		z-index: 998;
	}
	#header .clear {
		display: none;
	}
	#header ul li {
		font-size: 2.2rem;
		margin-left: 0 !important;
	}
	.nav-toggle {
		display: block;
		z-index: 999;
	}
	.h-nav {
		width: 100vw;
		height: 100vh;
		padding-bottom: 30%;
		opacity: 0;
		visibility: hidden;
		position: fixed;
		top: 0;
		right: -100%;
		transition: .3s;
		overflow-y: auto;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		gap: 3%;
		background-color: #fff;
		margin-top: 0 !important;
		z-index: 998;
	}
	.h-nav.open {
		opacity: 1;
		visibility: visible;
		right: 0;
	}
	.h-nav li {
		margin-left: 0 !important;
	}
	.h-nav img {
		width: 150px !important;
		height: auto !important;
	}
	.post {
		float: none;
		width: 100%;
	}
	.post img {
		height: auto !important;
	}
	#wrapper {
		display: flex;
		flex-direction: column;
		width: 100% !important;
	}
	#left_navi {
		display: block;
		width: 100%;
		margin-top: 60px !important;
		margin-right: 0 !important;
	}
	#sidebar {
		display: block;
		float: none;
		width: 100%;
		margin-top: 6rem;
		border-top: 1px solid #ddd;
	}
	#sub_nav ul {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		gap: 20px 10px;
	}
	#sub_nav li {
		width: calc(100% / 2 - 5px);
		margin-left: 0 !important;
		text-align: center;
	}
	#contents {
		width: 100%;
		float: none;
		height: auto !important;
	}
	#contents > div > img {
		width: 100%;
	}
	#sub_nav.snap-howto li {
		width: 100%;
	}
	#contents table {
		max-width: 100%;
	}
	table.shop-list {
		display: block;
		overflow-x: auto;
	}
	table.shop-list tbody {
		display: table;
		white-space: nowrap;
	}
	table#gaiyo th, table#gaiyo td {
		display: block;
	}
	body.postid_18 div#intro div {
		float: none;
		margin-right: 0;
		text-align: center;
	}
	body.postid_18 #contents P {
		text-align: center;
	}
	body.postid_22 ul#howto_left, ul#howto_center {
		float: none;
		width: 100%;
		margin-right: 0;
	}
	body.postid_22 #howto_center + ul {
		text-align: center;
	}
	ul.thum {
		width: 100% !important;
	}
	ul#image {
		width: 100% !important;
	}
	.pagetop_line,
	.pagetop {
		width: 100% !important;
	}
	ul#image li {
		float: none;
		width: 100%;
	}
	/* #contents strong {
		display: block;
	} */
}