@charset "UTF-8";

* {
	margin: 0;
	padding: 0;
}

#fixedTop {
			/*　↓　絶対*/
			display: none; 
			width: 1em;
			line-height: 1em;
			/*padding: 3px;*/
			background: #333333;
			border-radius: 50%;
			text-align: center;
			color: white;
			font-size: 50px;
			/*　↓　絶対*/
			position: fixed;
			right: 0;
			bottom: 30px;
			z-index: 999;
		}


/*clearfix*/
.clearfix:after {
	content: "";
	display: block;
	clear: both;
}

/*all*/
body {
	background: snow;
}
ul {
	list-style: none;
}
/*wrap*/
#wrap {
	width: 100%;
	color: gray;
	font-family: 'Kosugi', sans-serif;
}

/*header*/
header {
	position: relative;
}


/*mainrogo*/
#main img {
	width: 100%;
}

/*nav*/
nav {
	z-index: 999999999;
}
nav p {
	position: absolute;
	bottom: 0;
	right: 0;
}
nav ul {
	display: none;
	width: 100%;
	position: absolute;
	z-index: 999999999;
}
nav p span {
	display: inline-block;
	text-indent: -999999px;
}
nav a {
	display: block;
	width: 100%;
	color: gray;
	line-height: 60px;
	background: lightgrey;
	text-decoration: none;
	text-align: center;
}
nav a:hover {
	background: gainsboro;
	color: black;
}

nav li {
	margin-bottom: 3px;
}

nav p:after,nav p.off:after {
	content: "\f0c9";
	display: block;
	width: 1.5em;
	line-height: 1.5em;
	color: white;
	background: black;
	font-size: 25px;
	text-align: center;
}
nav p.off:after {
	content: "\f00d";
}
/*コンテンツ全体*/
#contents a {
	text-decoration: none;
	color: black;
}
#contents h2,
#contents h3 {
	text-align: center;
}
.text {
	line-height: 30px;
	text-align: center;
	margin: 0 10px;
}

	

/*product*/
#tab1 ul a {
	display: block;
	line-height:50px;
	margin-bottom: 1px;
	text-align: center;
	background: #D1D7E6;
}
#tab1 ul a:hover {
	color: snow;
	background: lightsteelblue;
}
.p-pic {
	width: 100%;	
}
.p-pic img {
	width: 100%;
}

/*アクセサリー*/
#akuse,
#kawa,
#wedding {
	margin-top: 100px;
}
.swiper-container {
      width: 100%;
      height: 300px;

    }
.swiper-slide {
      background-size: cover;
      background-position: center center;

      /* Center slide text vertically */
      display: -webkit-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      -webkit-align-items: center;
      align-items: center;
    }
	/*レザークラフト*/
/*ウエディング*/
#wedding-oader {
	text-align: center;
	margin: 30px auto;
}
#wedding-oader ul {
	text-align: center;
	margin: 20px auto;
}
#wedding-oader h4 {
	font-size: 1.5em;
}


/*about*/
#unfavori,
	#sakka,
	#shop,
	#ordermade {
		margin-top: 100px;
	}
#tab2 ul a {
	display: block;
	line-height:50px;
	margin-bottom: 1px;
	text-align: center;
	background: #D1D7E6;
}
#tab2 ul a:hover {
	color: snow;
	background: lightsteelblue;
}
.subpic {
	width: 100%;
}
.subpic img {
	width: 100%;
}

#shop img {
	width: 100%;
}
	/*un favori*/
	/*作家紹介*/
	/*SHOP*/
/*オーダーメイド*/
.order_subpic {
	width: 100%;
	height: 200px;
	overflow: hidden;
}
.order_subpic img {
	width: 100%;
}
#ordermade dl {
	text-align: center;
	margin: 0 auto;
	margin: 20px;
}
#ordermade dt {
	font-size: 1.5em;
	font-weight: bold;
}

/*shop*/
#buttons a {
	display: block;
	color: gray;
	line-height: 30px;
}
#buttons {
	text-align: center;
	margin: 15px 0;
}
#buttons a:hover {
	cursor: pointer;
	color: black;
}
#o-inner {
	text-align: center;
}
/*footer*/
footer {
	margin-top: 50px;
	margin-bottom: 10px;
	text-align: center;
}
.fab {
	display: inline-block;
	margin: 5px;
	color: darkgray;
	font-size: 30px;
}
.fab:hover {
	color: gray;
	font-size: 35px;
}
p.end {
	display: none;
}

/*contact*/
table {
	width: 100%;
	max-width: 500px;
	margin: 20px auto;
}

.title {
	color: darkgray;
	text-align: left;
	padding:5px 15px 0;
}
.title:first-of-type {
	padding-top: 20px;
}
input[type="text"],
input[type="email"]  {
	width: 100%;
	max-width: 470px;
	height: 30px;
	padding: 3px;
	font-size: 18px;
}
textarea {
	width: 100%;
	max-width: 470px;
	height: 100px;
	font-size: 18px;
	padding: 3px;
}
.btns {
	margin: 30px;
	text-align: center;
}
.btns input {
	width: 200px;
	margin: 0 10px 10px;
	padding: 10px;
	font-size: 20px;
}		


/*mediaQuery*/
/*380px以上*/
@media screen and (min-width:380px) {

	
}






/*681px以上*/
@media screen and (min-width:681px) {
/*wrap*/
	#wrap {
		width: 100%;
		max-width: 1024px;
		margin: 0 auto;
		font-size: 15px;
	
	}
	#contents > div {
		margin-bottom: 50px;
	}
/*header*/
	header {
		margin-bottom: 100px;
	}
	nav {
		width: 100%;
		top: 0;
		left: 0;

	}
	nav li {
		width: 10%;
		margin:0 5%;
		float: left;
	}
	nav a {
		color: darkgray;
		line-height: 40px;
		background: snow;
	}
	nav a:hover,
	.current {
		border-bottom: solid 3px red;
		background: snow;
		color: black;
	}
	nav ul {
		display: block;
		background: snow;
		padding-bottom: 5px;
	}
	nav .fas {
		display: none;
	}

/*contents*/
.text {
	line-height: 35px;
	width: 80%;
	margin: 0 auto;
}
#contents h3 {
	margin-bottom: 20px;
}
/*product*/
	#akuse,
	#kawa,
	#wedding {
		margin-top: 0;
		margin-bottom: 50px;
	}
	#tab1 ul a {
		background: snow;
		color: gray;
		line-height: 20px;
		margin: 30px 0;
	}
	#tab1 ul a:hover {
	color: black;
	background: snow;
	}

	#p-submenu {
		width: 30%;
		float:left;
	}
	#p-inner {
		width: 70%;
		float: left;
	}
	#p-inner > div {
		margin-bottom: 100px;
	}
	.inner {
		margin-top: 50px;
	}
	.submenu {
		margin-top: 50px;
	}

/*アクセサリー*/
	#akuse p {
		margin-top: 20px;
	}
	.swiper-container
	 {
		margin: 0 auto;
	}	
	.p-pic {
		width: 70%;
		height: 300px;
		margin: 0 auto;
		overflow: hidden;
	}
	.subpic {
		width: 70%;
		height: 300px;
		margin: 0 auto;
		overflow: hidden;
	}
/*ウエディング*/
	#wedding p {
	margin-top: 20px;
	}

/*about*/
	#unfavori,
	#sakka,
	#shop,
	#ordermade {
		margin-top: 0;
	}
	#tab2 ul a {
		background: snow;
		color: gray;
		line-height: 20px;
		margin: 30px 0;
	}
	#tab2 ul a:hover {
		color: black;
		background: snow;
	}
	#a-submenu {
		width: 30%;
		float:left;
	}
	#a-inner {
		width: 70%;
		float: left;
	}	
	#a-inner > div {
		margin-bottom: 100px;
	}
/*shop*/
	#buttons p {
		background: snow;
		line-height: 20px;
		margin: 15px 0;
	}
	#buttons p:first-of-type {
		margin-top: 30px;
	}
	#o-submenu {
		width: 30%;
		/*margin-left: 5%;*/
		float:left;
	}
	#o-inner {
		width: 70%;
		float: left;
	}	
	#o-inner ul li {
		margin: 10px;
		float:left;
	}
/*footer*/
	footer {
		margin-top: 0;
	}

}