@charset "UTF-8";
body{
  color: rgba(0, 0, 0, 0.5);
}
p{
  font-family: 'Zen Antique', serif;
  /* font-family: "Sawarabi Mincho"; */
}
img {
  width:auto;
  height:auto;
  max-width:100%;
  max-height:100%;
}
ul{
  margin-left: 40px;
  margin-right: 40px;
}
nav{
  margin-top: 60px;
}
a:link{
  color: rgba(0, 0, 0, 0.7);
}

a:hover{
  color: rgba(0, 0, 0, 0.5);
}






.head1{
  font-family: 'Bebas Neue', cursive;
}
.bg-light {
  background-color: #ffffff !important;
}
.navbar-nav{
  border-bottom:solid 1px #00B377;
}
.nav-item{
  border: solid 1px black;
  margin: 10px;
}
.nav-item:first-letter{
  font-size:20px;
  font-weight:400;
}
.produce-item:first-letter{
  color:#FF0000;
}
.item-item:first-letter{
  color:#FF5900;
}
.facility-item:first-letter{
  color:#00EBE9;
}
.blog-item:first-letter{
  color:#00CF37;
}
.decotte-item:first-letter{
  color:#1D38DB;
}
.company-item:first-letter{
  color:#9D85DB;
}








.topimage1{
  text-align: center;
  /* width : 50vw ; */
}
.topimage2{
  width: 150px;
  margin-left: 10px;
  margin-right: 10px;
}
.top1{
  text-align: center;
  color:#FF5900;
  /* font-family: 'Frijole', cursive; */
  font-family: 'Monoton', cursive;
}
.top2{
  color:#1D38DB;
  text-align: center;
  /* font-family: 'Frijole', cursive; */
  font-family: 'Monoton', cursive;
}
.top3{
  margin-left:55px;
  margin-right: 55px;
  padding-left: 35px;
  padding-right: 35px;
  text-align: right;
  border-bottom:solid 1px #00B377;
  width: 100;
  font-size: 15px;
}
.top4{
  text-align: center;
}

.top6{
  margin-top: 35px;
}





@media (max-width: 767px){
  nav{
    margin-top:15px;
  }
  ul{
    margin-left: 0px;
    margin-right: 0px;
  }
  .kao1{
    width: 380px;
    height: auto;
    max-width: 100%;
    max-height: 100%;
  }
  .top3{
    margin-left:15px;
    margin-right: 15px;
    padding-left: 25px;
    padding-right: 25px;
    font-size: 7px;
  }
  .topimage2{
    width: 100px;
    margin-left: 10px;
    margin-right: 10px;
  }
  h1{
    font-size: 2rem;
  }
}
@media (max-width:584px){
  h1{
    font-size: 1.6rem;
  }
  .kao1{
    width: 320px;
    height: auto;
    max-width: 100%;
    max-height: 100%;
  }

}
@media (max-width:470px){
  h1{
    font-size: 1.3rem;
  }
  .kao1{
    width: 250px;
    height: auto;
    max-width: 100%;
    max-height: 100%;
  }

}
@media (max-width:360px){
  h1{
    font-size: 1.1rem;
  }
}
@media (min-width:576px){
  .top5 {
    border: solid  rgba(0, 0, 0, 0.08);
    margin-top: 15px;
    margin-bottom: 15px;
  	position: relative;
  }

  .top5::before,
  .top5::after {
  	content: '';
  	position: absolute;
  	transform: rotate(-35deg);
  	width: 120px;
  	height: 50px;
  	background-color: #fff;
  	z-index: 1;
  }

  .top5::before {
  	top: -23px;
  	left: -40px;
  	border-bottom: 1px solid #aaa;
  }

  .top5::after {
  	bottom: -23px;
  	right: -40px;
  	border-top: 1px solid #aaa;
  }
}


.titleD1{
  text-align: center;
}
.title1{
  /* font-family: "Sawarabi Mincho"; */
font-family: 'Zen Antique', serif;
}
.mozi1{
  text-align: center;
}

.produceitem1{
  padding: 0px;
  margin: 15px;
}
.card-item1{
  padding: 0px;
  margin-bottom: 15px;
}
/* .card-item2 img {
  transition: 0.5s;
}
.card-item2 img:hover {
  transform: scale(1.1, 1.1);
} */
.card-item{
padding: 0px;
margin-bottom: 15px;

}


.decottetext1{
  margin-bottom: 5px;
  margin-top: 15px;
  margin-right: 5px;
  margin-left: 5px;
  padding: 5px;
  border: solid 1px black;
  text-align: center;
}
.decottetext2{
  text-align: center;
}
.decotte1{
  margin-top: 7px;
  margin-bottom: 7px;
  text-align: center;
}
.sas1{
  text-align: center;
}
.sas2{
  margin-top: 25px;
}
@media (max-width:991px){
.decotte2{
margin-top: 35px;
}
}



.company1{
  text-align: center;
  margin-bottom: 15px;
}
.company2{
  margin-top: 15px;
  margin-bottom: 15px;
}


.pagetopmark1{
  position: fixed;
  bottom:0;
  right:0;
  width:100px;
  margin:15px;
}
.pagetopmark2{
  width:80px;
  background-color: rgba(0,0,0,0.05);
  height: 80px;
  border-radius: 50%;
}
.pagetopmark3{
  width: 30px;
  height: 30px;
  border: 5px solid;
  border-color: #C9B283 #C9B283 transparent transparent;
  transform: rotate(-45deg);
  position: relative;
  left:25px;
  top:34px;
}
@media (max-width:767px){
  .pagetopmark1{
    position: fixed;
    bottom:0;
    right:0;
    width:70px;
    margin:15px;
  }
  .pagetopmark2{
    width:65px;
    background-color: rgba(0,0,0,0.05);
    height: 65px;
    border-radius: 50%;
  }
  .pagetopmark3{
    width: 30px;
    height: 30px;
    border: 5px solid;
    border-color: #C9B283 #C9B283 transparent transparent;
    transform: rotate(-45deg);
    position: relative;
    left:18px;
    top:27px;
  }
  .decotte2{
  margin-top: -10px;
  }
















}