.ppp {
  width: 100%;
  background: #000000;
  text-align: center;
  padding: 3px 0 0;
  margin-bottom: 10px
}
h1 {
  font-size: 12px;
  letter-spacing: 4px;
  font-weight: normal;
  margin: 0 auto;
  color: #ffffff;
  text-align: center;
  border-bottom: 1px solid #6B6B6B;
}
.ppp img {
  width: 50%;
  margin: 4px auto 0px;
}
#mainBanner {
  width: 100%;
  padding: 3px 3px 30px;
  display: flex;
}
#slogan {
  width: 45%;
  color: #fff;
  line-height: 1.5;
  text-align: left;
  margin: 0 auto;
}
#slogan img {
  width: 100%;
  margin: 10px 0 0;
}
.topimage {
  margin: 10px 0 0 20px;
  width: 55%;
}
.top {
  display: block;
  width: 100%;
}
.top img {
  width: 100%;
}
.topl {
  width: 50%;
  margin: 0;
  padding: 0;
}
.topr {
  width: 50%;
  margin: 0;
  padding: 0;
}
.contact2 {
  width: 98%;
}
.contop {
  display: flex;
  width: 100%;
  justify-content: center;
}
.con1 {
  margin: 5px 13px 10px;
}
.con1 img {
  width: 60px;
}
.con1 a {}
.con1 a:hover {}
.sizef {
  width: 98%;
}
.sizefin {
  width: 98%;
  display: flex;
}
.dime {
  width: 100%;
  text-align: center;
  font-size: 80%;
}
.imgwidthl {
  width: 50%;
  margin: 0;
}
.imgwidthl h3 {
  width: 93%;
}
.imgwidthl img {
  width: 100%;
}
.imgwidthr {
  width: 50%;
  margin: 0;
}
.imgwidthr h3 {
  width: 93%;
}
.imgwidthr img {
  width: 100%;
}
.imgwidthr p {
  font-size: 11px;
  letter-spacing: 0;
  text-align: center;
  color: #fff;
  border-radius: 20px;
  background: #DB5800;
  padding: 4px 0 5px;
}
.t25 {
  width: 88%;
  margin: 5px auto 20px;
  font-size: 85%;
  background: #D3E8B4;
  padding: 10px;
  border-radius: 10px;
}
.kome {
  font-size: 12px;
  color: #FF0004;
  margin: 0 auto 0 5px
}
.kome2 {
  font-size: 13px;
  color: #FF0004;
  margin: 20px 5px 40px auto;
  width: 97%;
}
.niau {
  width: 100%;
  margin: 10px auto 0;
  display: flex;
}
.niau1 {
  width: 60%;
  margin: 0;
}
.niau1 img {
  width: 100%;
  padding: 5px 0 0;
}
.niau1 h4 {
  margin: 30px 0 0 0;
  width: 110%;
}
.niap {
  width: 100%;
  padding: 10px 10px 0 0;
}
.niau2 {
  width: 40%;
}
.niau2 img {
  width: 100%;
  margin: 0 auto;
}
.niau24 {
  width: 100%;
  margin: 10px auto 0;
  display: flex;
}
.niau241 {
  width: 63%;
  padding: 0 15px 0 5px;
}
.niau241 img {
  width: 100%;
  padding: 5px 0 0;
}
.niau242x {
  width: 37%;
  padding: 0 5px 0 15px;
  display: block;
}
.niau242 {
  width: 100%;
}
.niau242 img {
  width: 80%;
  margin: 0 auto 10px 30px;
}
.he25 {
  margin: 40px 0 30px;
}
.handdrawn24 {
  width: 95%;
  margin: 0 auto;
  display: flex;
}
.imagepics24 {
  width: 50%;
  margin: 0 10px;
}
.imagepics24 img {
  width: 100%;
}
.insta252 {
  background-image: url("images/image25sb.png");
  background-repeat: no-repeat;
  background-position: center;
  width: 50%;
  height: 410px;
  margin: 0 10px 30px;
  padding: 10px 0 0;
  border: 0;
}
.insta252 p {
  font-size: 13px;
  font-weight: 400;
  background: #ffffff;
  opacity: 0.9;
  width: 92%;
  border-radius: 5px;
  border: 0;
  margin: 15px auto;
  padding: 5px 0 2px;
  text-align: center;
}
.hdleft {
  background-image: url("images/attheentrance.png");
  background-repeat: no-repeat;
  background-position: center;
  width: 50%;
  height: 490px;
  margin: 0 10px;
  padding: 10px 0 0;
  border: 0;
}
.hdleft h3 {
  color: #A034B8;
  font-size: 17px;
  font-weight: 500;
  background: #ffffff;
  opacity: 0.9;
  width: 60%;
  border-radius: 5px;
  border: 0;
  margin: 5px auto 0;
  text-align: center;
}
.hdleft p {
  color: #045E03;
  font-size: 13px;
  font-weight: 400;
  background: #ffffff;
  opacity: 0.9;
  width: 92%;
  border-radius: 5px;
  border: 0;
  margin: 5px auto;
  padding: 5px 0 2px 10px;
}
.hdleft2 {
  background-image: url("images/atthecoverdporch.png");
  background-repeat: no-repeat;
  background-position: center;
  width: 50%;
  height: 490px;
  margin: 0 10px;
  padding: 10px 0 0;
  border: 0;
}
.hdleft2 h3 {
  color: #A034B8;
  font-size: 17px;
  font-weight: 500;
  background: #ffffff;
  opacity: 0.9;
  width: 60%;
  border-radius: 5px;
  border: 0;
  margin: 5px auto 0;
  text-align: center;
}
.hdleft2 p {
  color: #045E03;
  font-size: 13px;
  font-weight: 400;
  background: #ffffff;
  opacity: 0.9;
  width: 92%;
  border-radius: 5px;
  border: 0;
  margin: 5px auto;
  padding: 5px 0 2px 10px;
}
.imagepics25 {
  width: 50%;
  margin: 0 10px;
}
.ydpr {
  width: 50%;
  margin: 0 10px 30px;
  padding: 10px 0 0;
  border: 0;
}
.ydprp {
  margin: 0 0 7px;
}
.ydpra {
  width: 100%;
  text-align: center;
  margin: 30px 0 0;
}
.ydpra a {
  background: #008E90;
  padding: 4px 15px 5px 18px;
  border-radius: 13px;
  margin: 0 auto;
  color: #FFFFFF;
  font-size: 12px;
}
.yesborder25 {
  width: 88%;
  max-width: 370px;
  margin: -10px auto 0 12px;
  background-color: #FFD4D4;
  border: 0;
  border-radius: 25px;
  padding: 3px 20px 6px;
  line-height: 1.0;
}
.yesamazon {
  font-size: 11px;
  color: #A60000;
}
.yesamazon:hover {
  ;
  color: #FF0000;
}
/* Amazon用
------------------------------------------------------------*/
/* RESPONSIVE 設定
------------------------------------------------------------*/
@media only screen and (max-width: 799px) {
  .ppp {
    width: 100%;
    background: #000000;
    text-align: center;
    padding: 3px 0 0;
    margin-bottom: 10px
  }
  h1 {
    font-size: 11px;
  }
  .ppp img {
    width: 80%;
  }
  #mainBanner {
    display: block;
  }
  #slogan {
    width: 90%;
  }
  .topimage {
    margin: 10px 0 0 20px;
    width: 94%;
  }
  .top {
    display: block;
    width: 100%;
  }
  .top img {
    width: 100%;
  }
  .contop {
    width: 80%;
    margin: 0 auto 10px;
  }
  .contact2 {
    margin: 0 0 -40px 0;
  }
  .sizefin {
    display: block;
  }
  .imgwidthl {
    width: 100%;
  }
  .imgwidthr {
    width: 100%;
  }
  .imgwidthr p {
    width: 96%;
  }
  .imgwidthl h3 {
    width: 100%;
  }
  .imgwidthl img {
    width: 98%;
  }
  .imgwidthr h3 {
    width: 100%;
  }
  .imgwidthr img {
    width: 98%;
  }
  .t25 {
    width: 98%;
  }
  .niau {
    display: block;
  }
  .niau1 {
    width: 100%;
    margin: 0;
  }
  .niau1 img {
    width: 100%;
    padding: 5px 0 0;
  }
  .niau1 h4 {
    margin: 30px 0 0 0;
    width: 110%;
  }
  .niap {
    width: 100%;
    padding: 10px 10px 0 0;
  }
  .niau2 {
    width: 100%;
  }
  .niau2 img {
    width: 100%;
    margin: -30px auto 40px;
  }
  .niau24 {
    display: block;
  }
  .niau241 {
    width: 100%;
  }
  .niau241 img {
    width: 100%;
  }
  .niau242x {
    width: 100%;
    padding: 10px 5px 20px 15px;
  }
  .niau242 {
    width: 100%;
  }
  .niau242 img {
    width: 80%;
    margin: 20px auto 20px 30px;
  }
  .he25 {
    margin: 40px 0 20px;
  }
  .handdrawn24 {
    width: 98%;
    margin: 0 auto;
    padding: 0 0 0 20px;
    display: block;
  }
  .imagepics24 {
    width: 100%;
  }
  .imagepics24 img {
    width: 95%;
    padding: 0;
  }
  .insta252 {
    margin: 60px auto 10px;
    ;
    border-radius: 15px;
    width: 90%;
    height: 495px;
  }
  .hdleft {
    margin: 20px auto;
    border-radius: 15px;
    width: 90%;
  }
  .hdleft2 {
    margin: 20px auto;
    border-radius: 15px;
    width: 90%;
  }
  .imagepics25 {
    width: 88%;
    margin: 0 auto;
  }
  .ydpr {
    width: 85%;
    margin: 0 auto 30px;
    padding: 10px 0 0;
    border: 0;
  }
  .ydpra {
    margin: 10px 0 20px;
  }
  .yesborder25 {
    width: 89%;
    max-width: 750px;
    margin: 0 auto 10px 10px;
  }
}
@media only screen and (max-width:640px) {
  .imagepics25 {
    width: 95%;
  }
  .ydpr {
    width: 95%;
  }
  .ydpra a {
    font-size: 11px;
  }
}