@charset "utf-8";
/* ===================================================================
CSS information

 file name  :  top.css
 style info :  スタイル指定
=================================================================== */
@font-face {
    font-family: 'NotoSerifCJKjp';
    font-style: normal;
    font-weight: 400;
    src:
        url('../../fonts/NotoSerifCJKjp-Regular-sub.woff') format('woff');
}

/*bootstrap調整用*/
.no-gutter {
	padding-left:0;
    padding-right:0;
}
.no-gutter .row {
	margin-left:0;
	margin-right:0;
}
.bootBox {
	margin: 0 2.5%;
}

/*/bootstrap調整用*/

body {
	background: url(../../img/texture.png) repeat rgba(210, 198, 171, 0.6);
	padding: 0;
	font-family: NotoSerifCJKjp;
}

.contsWrap {
	max-width: 1020px;
	margin: 0 auto;
}
header {
	overflow: hidden;
	padding: 15px;
	background: rgb(221,197,142);
	background: -moz-linear-gradient(left, rgba(221,197,142,1) 0%, rgba(255,255,255,1) 100%);
	background: -webkit-linear-gradient(left, rgba(221,197,142,1) 0%,rgba(255,255,255,1) 100%);
	background: linear-gradient(to right, rgba(221,197,142,1) 0%,rgba(255,255,255,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ddc58e', endColorstr='#ffffff',GradientType=1 );
	border-bottom: 3px solid #3a3123;
}
header .headerWrap h1 {
	float: left;
	padding: 0 3% 0 0;
}
header .headerWrap div {
	float: right;
	padding-top: 15px;
}

#kv .kvWrap {
	max-width: 1470px;
	margin: 0 auto;
	/* border-bottom: 3px solid #3a3123; */
}

.topBtn {
	padding: 45px 0;
	background-image: url(../../img/texture.png), linear-gradient( to right, rgba(81,65,41,1) 15%,rgb(140, 118, 78) 50%,rgba(81,65,41,1) 85%);
	background-repeat: repeat;
	background-blend-mode: overlay;
	background-size: auto, cover;
	border-top: 3px solid #3a3123;
}
	@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
		.topBtn {
		background-image: url(../../img/texture2.png), linear-gradient( to right, rgba(81,65,41,1) 15%,rgb(140, 118, 78) 50%,rgba(81,65,41,1) 85%);
		}
	}

.buyBtn {
	padding: 0 20px;
	overflow: hidden;
}
.buyBtn {
    display: block;
    width: 100%;
    max-width: 736px;
    margin: 0 auto;
}
.buyBtn a {
	display: block;
	position: relative;
	z-index: 2;
	overflow: hidden;
	width: 100%;
	border-radius: 2px;
	background-image: #8E1310;
	background-image: url(../../img/texture.png), linear-gradient( to right, rgb(62, 6, 1) 15%,rgb(255, 40, 40) 50%,rgba(62, 6, 1, 1) 85%);
	background-image: url(../../img/texture2.png), -webkit-gradient(linear, left top, right top, from(#3e0601),color-stop(0.5, #ff2828), to(#3e0601));
	
	background-repeat: repeat;
	background-blend-mode: overlay;
	background-size: auto, cover;
	color: #ffffff;
	padding: 22px 0;
	text-align: center;
	text-decoration: none;
	transition: .25s linear;
	-webkit-transition: .25s linear;
	-moz-transition: .25s linear;
	font-size: 1.7em;
}
	@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
		.buyBtn a {
			background-image: url(../../img/texture2.png), linear-gradient( to right, rgb(62, 6, 1) 15%,rgb(255, 40, 40) 50%,rgba(62, 6, 1, 1) 85%);
		}
	}
.buyBtn a:hover {
	background-image: url(../../img/texture.png), linear-gradient( to right, rgb(68,8,2) 15%,rgb(255,75,75) 50%,rgba(68,8,2, 1) 85%);
	background-image: url(../../img/texture2.png), -webkit-gradient(linear, left top, right top, from(#440802),color-stop(0.5, #ff4b4b), to(#440802));
}
	@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
		.buyBtn a:hover  {
			background-image: url(../../img/texture2.png), linear-gradient( to right, rgb(68,8,2) 15%,rgb(255,75,75) 50%,rgba(68,8,2, 1) 85%);
		}
	}

.buyBtn a::before {
	display: block;
	position: absolute;
	z-index: -1;
	left: -30%;
	top: -80%;
	content: "";
	width: 90px;
	height: 250px;
	transform: rotate(30deg);
	-webkit-transform: rotate(30deg);
	-moz-transform: rotate(30deg);
	background-image: linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 50%,rgba(255,255,255,0) 100%);
	background-image: -webkit-gradient(linear, left bottom, right bottom, color-stop(0%,rgba(255,255,255,0)), color-stop(50%,rgba(255,255,255,1)),color-stop(100%,rgba(255,255,255,0)));
	background-image: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, #ffffff rgba(255,255,255,1),rgba(255,255,255,0) 100%);
	animation: shiny 3.4s infinite linear;
	-webkit-animation: shiny 3.4s infinite linear;
	-moz-animation: shiny 3.4s infinite linear;
	transform: rotate(30deg);
	background-image: linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 50%,rgba(255,255,255,0) 100%);
	animation: shiny 3.4s infinite linear;
}
@keyframes shiny {
    0% {
        left: -30%;
    }
    20% {
        left: 120%;
    }
    100% {
        left: 120%;
    }
}
@-webkit-keyframes shiny {
    0% {
        left: -30%;
    }
    20% {
        left: 120%;
    }
    100% {
        left: 120%;
    }
}
@-moz-keyframes shiny {
    0% {
        left: -30%;
    }
    20% {
        left: 120%;
    }
    100% {
        left: 120%;
    }
}
.buyBtn .kirarin {
	display: none;
}
	@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
		.buyBtn .kirarin {
			display: block;
			position: absolute;
			top:-100px;
			left: -250px;
		}
	}


.merit,.contact {
	padding: 45px 30px;
	background-image: url(../../img/texture.png), linear-gradient( to right, rgba(25, 21, 17,1) 20%,rgb(78, 63, 36) 50%,rgba(25, 21, 17,1) 80%);
	background-repeat: repeat;
	background-blend-mode: overlay;
	background-size: auto, cover;
}
	@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
		.merit,.contact {
		background-image: url(../../img/texture2.png), linear-gradient( to right, rgba(25, 21, 17,1) 20%,rgb(78, 63, 36) 50%,rgba(25, 21, 17,1) 80%);
		}
	}

.merit .meritBox {
	margin-bottom: 20px;
}
.merit .meritBox > img {
	margin: 0 auto;
}

.spec {
	margin-bottom: 50px;
}
.spec .contsWrap {
	padding: 50px 30px;
}
.spec p {
	width: 96%;
	margin: 0 auto 18px;
	font-size: 1.1em;
	color: #111;
}
.spec p span {
	display: block;
	border: 1px solid #ccc;
	border-width: 0 0 1px;
	width: 35%;
	margin: 0 auto;
	font-size: .9em;
}

.contact h3 {
    margin: 15px 0 40px;
    font-size: 1.4em;
    font-weight: normal;
}
.contact .contactBox {
	background: #fff;
	border: 2px solid #c9c8c3;
	padding-bottom: 20px;
	margin-bottom: 20px;
}
.contact h4 {
    margin: 25px 0 20px;
    color: #111;
    font-weight: normal;
    font-size: 1.2em;
}
.contact .sellWrap h4 {
    margin: 50px 0 35px;
}
.contact .sellBtn {
	margin-bottom: 18px;
}
.contact .contactBtn a:hover img {
	opacity: .9;
}

address img {
	margin-bottom: 15px;
	float: left;
}
address .contactTell {
	border-right: 1px solid #ccc;
	margin: 0 0 0 3%;
	width: 43%;
}
address .contactTime {margin: 0px 0 0 2%;}

.map {
    margin: 70px 0 80px;
    padding: 0 3%;
}
.map h3 {
    margin: 0 0 40px;
    font-size: 1.4em;
    color: #111;
    font-weight: normal;
	line-height: 1.2;
}

footer {
	background: #4D4948;
	padding: 45px 0 40px;
}
footer nav {
	
}
footer nav ul {
	overflow: hidden;
	line-height: 1.8;
    padding: 0 5%;
    margin-left: 3%;
}
footer nav ul li {
	position: relative;
	float: left;
	margin: 0 2%;
}
footer nav ul li:first-child {
    float: none;
    text-align: left;
    margin-bottom: 12px;
}
footer nav ul li::before {
	content: "";
    display: block;
    position: absolute;
    top: 44%;
    left: -8px;
    right: 37px;
    width: 5px;
    height: 5px;
    border-top: 1px solid #fff;
    border-left: 1px solid #fff;
    -webkit-transform: rotate(-45deg);
    transform: rotate(135deg);
    z-index: 400;
}
footer nav ul li:first-child::before {
	content: none;
}
footer nav ul li a{
	color: #fff !important;
}
footer nav ul li a:link {
	color: #fff;
	font-size: .9em;
	text-decoration: underline;
}
footer nav ul li:first-child a:link {
	text-decoration: none;
}


@media only screen and (max-width: 992px) {
	.bootBox {
		margin: 0;
	}
	.topBtn {
		padding: 25px 0;
	}
	.merit,.contact {
		padding: 25px 30px;
	}
	
	address .contactTell {
		border-right: none;
		margin: 0;
		width: auto;
	}
	address img {
		float: none;
	}
	address .tellNum {
		display: block;
		border-bottom: 1px solid #ccc;
		padding-bottom: 5px;
		width: 50%;
		margin: 0 auto 21px;
	}
	.map {
		margin: 50px 0 50px;
		padding: 0 3%;
	}
	
	
}

@media only screen and (max-width: 767px) {
	header .headerWrap h1 {
		width: 43%;
	}
	header .headerWrap div {
		width: 43%;
	}
	.topBtn {
		background:#735c37;
	}
	.merit,.contact {
		background:#35291d;
	}
	.spec {
		margin-bottom: 30px;
	}
	.spec .contsWrap {
		padding: 30px;
	}
	
	address .tellNum {
		width: 100%;
	}
	.contact .contactBox {
		padding: 0px 20px;
	}
	.spTell {
		margin: -8px 0 3px;
	}
	.spTell a:link {
		color: #222;
		font-size: 1.5em;
	}

	
	
	
	
}



/*
 {
	background: url(../../img/texture.png) repeat rgba(210, 198, 171, 0.6);
	padding: 0;
}*/