@charset "utf-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;600&&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Zen+Old+Mincho+JP:wght@400;600;900&&display=swap");

html {
  width: 100%;
  background: url(../img/back2.jpg) center top ;
  background-size: 100%;
  font-size: 62.5%;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  word-break: break-all;
   scroll-behavior: smooth;
}
body {
  width: 100%;
  color: #231815;
  font-size: 1.8rem;
  line-height: 1.6;
}
@media screen and (max-width: 767px) {
  body {
  }
}
img {
  display: block;
  vertical-align: bottom;
  width: 100%;
  height: auto
}
a {
  -webkit-transition: .3s;
  transition: .3s
}
a:hover {
  opacity: .8
}

.pc{
  display: block;
}
.sp{
  display:none;
}

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

.pc{
  display:none;
}
.sp{
  display: block;
}
}
main {
  position: relative
}
.bg1{
  background: url(../img/back1.jpg) center top ;
  background-size: cover;
  padding: 5% 0;
}

/* title */
#title{
  position: relative;
  width: 50%;
  margin: 0 auto 5% auto;
}
@media screen and (max-width: 768px) {
#title{
  width: 70%;
}
.bg1{
  background-size: contain;
}
}

/* coupon */
section.coupon {
  position: relative;
  max-width: 70%;
  margin: 0 auto 0 auto;
  padding: 2%;
  background: #fff;
  border: #c70044 solid 15px;
}
section.coupon .img{
  clear: both;
  width: 100%;
  margin: 0 auto;

}
section.coupon .img img{
  width: 90%;
  margin: 0 auto;
}
section.coupon .tx{
  font-size: 1.35vw;
  font-weight: 600;
  line-height: 1.3;
  padding: 0;
  color: #231815;
  text-align: center;
}
section.coupon .tx span.pink{
  color: #c70044;
  margin: 0 0.1em;
}
section.coupon .tx span.big{
  font-size: 1.6vw;
}
section.coupon .tx p{
  display: inline-block;
  margin: 0 1% 0 0;
}
section.coupon .tx2{  
  display: table;
  margin: 1% auto 0 auto;
}
section.coupon .tx2 p.line1 {
  color: #000;
  font-size: 0.7vw;
  width: 100%;
  text-align: left;
  margin: 0;
}

section.coupon .tx2 p.line2 {
  color: #c70044;
  font-size: 1.3vw;
  width: 100%;
  text-align: center;
  margin: 0;
}
section.coupon .tx3{
  font-size: 1.3vw;
  font-weight: 400;
  line-height: 1.3;
  color: #231815;
  text-align: center;
  margin: 1% 0 0 0;
}
section.coupon .tx3 p{
  display: inline-block;
  padding: 0 1rem;
  background: linear-gradient(transparent 70%, #f2bfb4 50%);
}

@media screen and (max-width: 768px) {
section.coupon {
  max-width: 100%;
  margin: 0 auto 0 auto;
  border-left: none;
  border-right: none;
  text-align: center;
}
section.coupon .img{
  clear: both;
  width: 90%;
  margin: 0 auto;
  padding: 3% 0 3% 0;

}
section.coupon .img img{
  width: 100%;
  margin: 0 auto;
}
section.coupon .tx{
  font-size: 3.5vw;
  text-align: left;
  display: inline-block;
  width: 85%;
}
section.coupon .tx span.big{
  font-size: 3.5vw;
}
section.coupon .tx2{
  width: 85%;
}
section.coupon .tx2 p.line1 {
  font-size: 1.8vw;
  margin-top: 1em;
}

section.coupon .tx2 p.line2 {
  font-size: 2.3vw;
  text-align: left;
  text-indent: -1em;
  padding-left: 1em;
  margin-top: 1em;
}
section.coupon .tx3{
  font-size: 2.5vw;
  margin: 5% 0 5% 0;
}
section.coupon .tx3 p{
  display: inline-block;
  padding: 0 0.5rem;
  background: linear-gradient(transparent 70%, #f2bfb4 50%);
}
}
/* area-coupon */
section.area-coupon {
  position: relative;
  max-width: 70%;
  margin: 2% auto 2% auto;
}
@media screen and (max-width: 768px) {
section.area-coupon {
  position: relative;
  max-width: 100%;
  margin: 0 auto 5% auto;
}
}

/* fontanesi */
section.fontanesi {
  max-width: 70%;
  margin: 0 auto 5% auto;
  padding: 0;
  display: flex;
  justify-content: space-between;
  background: url(../img/back3.png);
}
section.fontanesi .img{
  width: 22%;
  align-items: center;
  border: 10px solid #FFF;
}
section.fontanesi .img p{
  font-size: 0.7vw;
  line-height: 1.3;
}
section.fontanesi .tx{
  width: 73%;
  padding: 0 0;
}
section.fontanesi .tx .tx2{
  font-size: 2.2vw;
  font-weight: 400;
  line-height: 1.4;
  margin: 5% 0 0 0 ;
}
section.fontanesi .tx .tx2 span{
  font-size: 1.5vw;
}
section.fontanesi .tx .tx3{
  color: #c70044;
  font-size: 1.8vw;
  font-weight: 400;
  margin: 1% 0 0 0;
}
section.fontanesi .tx .tx3 span{
  float: right;
  display: inline-block;
}
section.fontanesi .tx a{
  display: inline-block;
  background: #c70044;
  color: #fff;
  border-radius: 100vh;
  text-align: center;
  font-size: 1.2vw;
  font-weight: 600;
  line-height: 1;
  padding: 1% 2%;
  margin: 5% 0;
}
@media screen and (max-width: 768px) {

section.fontanesi {
  max-width: 100%;
  flex-wrap: wrap;
  justify-content: center;
  
}
section.fontanesi .img{
  width: 70%;
  margin-top: 5%;
}
section.fontanesi .img p{
  font-size: 1.9vw;
  font-weight: 400;
  line-height: 1.3;
}
section.fontanesi .tx{
  width: 100%;
  padding: 0 0;
  text-align: center;
}
section.fontanesi .tx .tx2{
  font-size: 4.0vw;
  font-weight: 600;
  margin: 5% 0 0 0 ;
}
section.fontanesi .tx .tx2 span{
  font-size: 2.6vw;
}
section.fontanesi .tx .tx3{
  font-size: 3.5vw;
  font-weight: 600;
}
section.fontanesi .tx a{
  display: inline-block;
  background: #c70044;
  color: #fff;
  border-radius: 100vh;
  text-align: center;
  font-size: 4.5vw;
  font-weight: 600;
  line-height: 1;
  padding: 2% 4%;
  margin: 5% 0;
}
section.fontanesi .tx .tx4{
  font-size: 0.6vw;
  font-weight: 400;
}
}


#page-top a{
    position: fixed;
    bottom: 16%;
    right: 1%;
    z-index: 1;
    border: 2px solid #FFF;
    font-size: 0.8vw;
    text-align: center;
    font-weight: bold;
    padding: 0.5em 1em ;
    background: #c70044;
    color: #FFF;
    border-radius: 5px;
    filter: drop-shadow(0px 0px 5px rgba(0,0,0,0.5));    
}
@media screen and (max-width: 767px) {
#page-top a{
    bottom: 8%;
    right: 1%;
    padding: 0.5em 1em ;
    font-size: 1.6vw;
    filter: drop-shadow(0px 0px 2px rgba(0,0,0,0.5));   
}
}
.banner{
  width: 300px;
  text-align: center;
  margin: 0 auto;
  padding: 0;
}
.copyright {
  font-size: 1.4rem;
  text-align: center;
  padding: 2% 0 0 0;
}
@media screen and (max-width: 767px) {
.banner{
  width: 200px;
}
.copyright {
    font-size: 1.1rem;
    padding: 8% 0 0 0;
  }
}

@media screen and (max-width: 767px) {
  .pc{
    display: none;
  }
  .sp{
  display: inline-block;
  }
}