@charset "utf-8";
/* CSS Document */

@import url("top.css");
@import url("font.css");
@import url("btn.css");

@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+JP:wght@400;500&family=Libre+Baskerville:ital,wght@0,400;0,700;1,400&family=Shippori+Mincho+B1&family=Zen+Antique&display=swap');

html{
  scroll-behavior: smooth;
}

body {
	animation: fadein 1.5s ease-out forwards;
    background-color: #f7f3da;
    color: #755d42;
}
@keyframes fadein {
	0% {opacity: 0}
	100% {opacity: 1}
}

a{
	color: #b85b56;
}
a:hover {
	color: #e84694;
}
.title a{
	text-decoration:none;
}
.title a:hover {
	color: #9a7101;
}

.header{
	margin-bottom: 0;
	padding-bottom: 0;
	font-size: 0;
}
.header img{
	width: 100%;
}

.box1{
	font-family: 'Noto Sans JP', sans-serif;
	width: 80%;
	margin: auto;
	padding: 1rem 0;
	font-size: 0.9rem;
	line-height: 1.5rem;
    text-align: center;
}

.box1 img {
    width: 100%;}

.box2{
	font-family: 'Noto Sans JP', sans-serif;
	width: 80%;
	margin: auto;
	padding-bottom: 0rem;
	font-size: 0.9rem;
	line-height: 1.5rem;
}

/* 商品情報 */
.flex{
	width:100%;
	margin:1rem auto 0 auto;
	padding: 1rem 0 0 0;
	display: flex;
	flex-wrap: wrap;
	justify-content:space-around;
}
.flex_item{
	width: 40%;
	border-radius:0.5rem;
	padding-bottom: 1.5rem;
	margin-bottom: 2rem;
	text-align: center;
}

.flex img{
	width: 90%;
	margin: 1rem;
}

.flex_item dl{
    color: #755d42;
}
.flex_item dt{
    font-family: "Libre Baskerville", serif;
	font-size: 1.5rem;
	font-weight: bold;
}
.flex_item dd{
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 1rem;
	margin: 1rem 0 2rem;
	padding-bottom: 2rem;
    border-bottom: solid 1px #c8ab89;
}

footer{
    margin: 5rem 0 3rem;
	padding: 3rem auto 1rem auto;
}

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

/*--------------------------- */

@media screen and (max-width: 767px) {

/* pc */
.pc { display: none !important; }
/* sp */
.sp { display: block !important; }
	
.box1{
	width: 85%;
	padding-bottom: 1rem;
}

/* 商品情報 */
.flex{
	margin: 1rem auto;
	padding: 0;
	text-align: center;
}
.flex_item, .flex_tokuten{
	width:100%;
	margin-bottom: 1rem;
}
.txt_c_spl{
	text-align: left;
}
	
}