#couplebox {
  background-color: #FFFEFC;
}

/*TOPスライドショー上文字*/

.couple-topbox {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 56.25vw;
  /* border: 1px solid red; */
}

.slideBox {
  width: 100%;
  height: 100%;
}

.couple-toptext {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  color: #FFFFFF;
}

.toptext01{
  font-family: 'Nothing You Could Do', cursive;
  font-size: 13vw;
  line-height: 1;
  border-bottom:5px solid;
  text-align: center;
}
.toptext02{
  font-size: 2vw;
  line-height: 3;
  text-align: center;
}


/*TOPスライドショー*/
      /* imgのみ */
      .item1 {
        position: absolute;
        width: 100%;
        opacity: 0;
        object-fit: cover;
        animation: change-img-anim 30s infinite;
      }

      .item1:nth-of-type(1) {
        animation: change-img-anim 30s infinite;
        animation-delay: 0s;
      }

      .item1:nth-of-type(2) {
        animation-delay: 10s;
      }
      
      .item1:nth-of-type(3) {
        animation-delay: 20s;
      }

      
      /* ふわっとアニメーション */
      @keyframes change-img-anim-first {
        0%{ opacity: １;}
        30%{ opacity: 1;}
        36%{ opacity: 1;}
        45%{ opacity: 0;}
        100%{ opacity: 0;}
      }
      @keyframes change-img-anim {
        0%{ opacity: 0;}
        30%{ opacity: 1;}
        36%{ opacity: 1;}
        45%{ opacity: 0;}
        100%{ opacity: 0;}
      }


      .couple-text02-content{
        display: block;
        width: 100%;
        padding-top: 7%;
        padding-bottom: 7%;
        margin: auto;
      }
      .couple-text02{
        display: table;
        width: 60%;
        margin: auto;
        text-align: center;
        line-height: 1.8em;
      }
      
      .couple-texth3{
        width: 100%;
        height: 1vw;
        position: relative;
      }
      .coupleh3{
        font-family: 'Nothing You Could Do', cursive;
        transform: rotate(10deg);
        -moz-transform: rotate(10deg);
        -webkit-transform: rotate(10deg);
        position: absolute;
        left: 60%;
        top: 0%;
        color: #E5001B;
        opacity: 0.07;
        font-size: min(5em,48px);
        line-height: 0.8;
      }
      .couple-border{
        display: block;
        width: 60%;
        margin: auto;
        border-bottom:2px solid #E5001B;
      }
      .couple-text02box p{
        font-size: 18px;
      }

      .couple-text02box{
        display: table-cell;
        vertical-align: middle;
      }

      .couple-h2text{
        font-size: 24px;
        line-height: 2.3;
        color: #E5001B;
}

      .couple-text02-1{
        padding-bottom: 1.5em;
      }
      .couple-text02top{
        padding-top: 1.5em;
      }


      .scroll_up{
        display: block;
        width: 100%;
      }
      /*scroll_up ｜下から上へ出現*/
      .scroll_up {
        transition: 0.8s ease-in-out;
        transform: translateY(30px);
        opacity: 0;
      }
      .scroll_up.on {
        transform: translateY(0);
        opacity: 1.0;
      }


      .categorybr{
        display: none;
      }
      .redp{
        color: #E5001B;
      }
      .couple-category-title{
        display:block;
        width: 100%;
        padding: 2vw 0;
        margin: auto;
      }
      .couple-category-titlep{
        display: flex;
        width: 40%;
        padding: 0.5vw 0;
        padding-bottom: 0.7rem;
        background-color: #FFFEFC;
        border: solid 2px;
        font-size: 24px;
        align-items: center;
        justify-content: center;
        margin: auto;
      }
      .couple-category-titlep:hover{
        display: flex;
        width: 40%;
        padding: 0.5vw 0;
        padding-bottom: 0.7rem;
        background-color: #FFFEFC;
        border: solid 2px;
        font-size: 24px;
        align-items: center;
        justify-content: center;
        margin: auto;
        border-radius: 50px;
        box-shadow: 0.9vw 0.7vw #FDEDEF;
      }
      .couple-category-titlep:active{
        display: flex;
        width: 40%;
        padding: 0.5vw 0;
        background-color: #FFFEFC;
        border: solid 2px;
        font-size: 24px;
        align-items: center;
        justify-content: center;
        margin: auto;
        border-radius: 50px;
        box-shadow: 0.9vw 0.7vw #FDEDEF;
      }
      .couple-category-titlep a{
        text-decoration: none;
      }
      .couple-category-titlep2{
        width: 100%;
        text-align: center;
        padding: 1.5vw 0;
        font-size: 18px;
      }
      .couple-category{
        display: flex;
        width: 100%;
      }
      .categorybox{
        display: flex;
        width: 85%;
        max-width: 1200px;
        height: auto;
        margin: auto;
      }
      .category-box01{
        display: flex;
        width: 100%;
        max-width: 1000px;
        flex-direction: row;
        flex-wrap: wrap;        
        margin: auto;
        margin-top: 7%;
        margin-bottom: 7%;
      }
      .category-text-titlebox{
        width: 100%;
        margin: auto;
        padding: 0.5vw 0;
      }

      .category-text-titlebox p{
        display: flex;
        width: 100%;
        padding: 0.1vw 0 0.3vw 0;
        color: #FFFEFC;
        font-size: 21px;
        font-weight: 500;
        margin: auto;
      }
      .category01 a{
        text-decoration: none;
      }

      .category-text-title01{
        display: flex;
        width: 100%;
        background-color: #ff8c84;
        border-radius: 50px;
        align-items: center;
        justify-content: center;
        margin: auto;
      }
      .category-text-title01:active{
        display: flex;
        width: 100%;
        background-color: #ffb0aa;
        border-radius: 50px;
        align-items: center;
        justify-content: center;
        margin: auto;
      }
      .category-text-title02{
        display: flex;
        width: 100%;
        background-color: #6fb0ff;
        border-radius: 50px;
        align-items: center;
        justify-content: center;
        margin: auto;
      }
      .category-text-title02:active{
        display: flex;
        width: 100%;
        background-color: #93c3ff;
        border-radius: 50px;
        align-items: center;
        justify-content: center;
        margin: auto;
      }
      .category-text-title03{
        display: flex;
        width: 100%;
        background-color: #B4CD00;
        border-radius: 50px;
        align-items: center;
        justify-content: center;
        margin: auto;
      }
      .category-text-title03:active{
        display: flex;
        width: 100%;
        background-color: #cbe02b;
        border-radius: 50px;
        align-items: center;
        justify-content: center;
        margin: auto;
      }
      .category-text-title04{
        display: flex;
        width: 100%;
        background-color: #ffac27;
        border-radius: 50px;
        align-items: center;
        justify-content: center;
        margin: auto;
      }
      .category-text-title04:active{
        display: flex;
        width: 100%;
        background-color: #ffc15d;
        border-radius: 50px;
        align-items: center;
        justify-content: center;
        margin: auto;
      }
      .category-text-title05{
        display: flex;
        width: 100%;
        background-color: #B48CCC;
        border-radius: 50px;
        align-items: center;
        justify-content: center;
        margin: auto;
      }
      .category-text-title05:active{
        display: flex;
        width: 100%;
        background-color: #c3b1ce;
        border-radius: 50px;
        align-items: center;
        justify-content: center;
        margin: auto;
      }
      .category-text-title06{
        display: flex;
        width: 100%;
        background-color: #ff81af;
        border-radius: 50px;
        align-items: center;
        justify-content: center;
        margin: auto;
      }
      .category-text-title06:active{
        display: flex;
        width: 100%;
        background-color: #ffb2ce;
        border-radius: 50px;
        align-items: center;
        justify-content: center;
        margin: auto;
      }
      .category-text-title07{
        display: flex;
        width: 100%;
        background-color: #50C382;
        border-radius: 50px;
        align-items: center;
        justify-content: center;
        margin: auto;
      }
      .category-text-title07:active{
        display: flex;
        width: 100%;
        background-color: #90daaf;
        border-radius: 50px;
        align-items: center;
        justify-content: center;
        margin: auto;
      }
      .category-text-title08{
        display: flex;
        width: 100%;
        background-color: #43C1D2;
        border-radius: 50px;
        align-items: center;
        justify-content: center;
        margin: auto;
      }
      .category-text-title08:active{
        display: flex;
        width: 100%;
        background-color: #81e0ec;
        border-radius: 50px;
        align-items: center;
        justify-content: center;
        margin: auto;
      }
      .category-text-title09{
        display: flex;
        width: 100%;
        background-color: #e254b8;
        border-radius: 50px;
        align-items: center;
        justify-content: center;
        margin: auto;
      }
      .category-text-title09:active{
        display: flex;
        width: 100%;
        background-color: #e685c9;
        border-radius: 50px;
        align-items: center;
        justify-content: center;
        margin: auto;
      }
      
      .category{
        display: flex;
        justify-content: center;
        align-items: flex-start;
        padding: 2% 3%;
        width : 33.33333% ; /* 未対応ブラウザ用フォールバック */
        width : -webkit-calc(100% / 3) ;
        width : calc(100% / 3) ;
      }
      .category01{
        width: 100%;
      }
      .category-text{
        width: 100%;
        text-align: justify;
        font-size: 16px;
      }
      .category-img{
        text-align: center;
        width: 100%;
      }
      .category-img:hover{
        text-align: center;
        width: 100%;
        filter: drop-shadow(0 0.5vw 0.5vw #54575770);
      }
      .category-img:active{
        text-align: center;
        width: 100%;
        filter: drop-shadow(0 0.5vw 0.5vw #54575770);
      }


      /*方眼紙*/
      .Paper_v2 {
        background-image:
          repeating-linear-gradient(to bottom,
            transparent 25px,
            rgba(220, 240, 255) 26px,  rgba(220, 240, 255) 26px,
            transparent 27px,  transparent 51px, 
            rgba(220, 240, 255) 52px,  rgba(220, 240, 255) 52px,
            transparent 53px,  transparent 77px, 
            rgba(220, 240, 255) 78px,  rgba(220, 240, 255) 78px,
            transparent 79px,  transparent 103px, 
            rgba(220, 240, 255) 104px,  rgba(220, 240, 255) 104px,
            transparent 105px,  transparent 129px, 
            rgba(220, 240, 255) 130px,  rgba(220, 240, 255) 130px),
       
          repeating-linear-gradient(to right,
            transparent 25px,
            rgba(220, 240, 255) 26px,  rgba(220, 240, 255) 26px,
            transparent 27px,  transparent 51px, 
            rgba(220, 240, 255) 52px,  rgba(220, 240, 255) 52px,
            transparent 53px,  transparent 77px, 
            rgba(220, 240, 255) 78px,  rgba(220, 240, 255) 78px,
            transparent 79px,  transparent 103px, 
            rgba(220, 240, 255) 104px,  rgba(220, 240, 255) 104px,
            transparent 105px,  transparent 129px, 
            rgba(220, 240, 255) 130px,  rgba(220, 240, 255) 130px);
      }


      /* 下曲線 */
      .wrap {        
        width: 100%;  
      }
      .content01 {
        background: #FFFEFC;
        border-bottom-left-radius: 1000px 100px;
        border-bottom-right-radius: 1000px 100px;
        height: 150px;
      }


      .couple-contact-title{
        width: 100%;
        padding: 4vw 0 0 0;
        margin: auto;
      }
      .couple-contact-titlep{
        display: flex;
        width: 20%;
        padding: 0.5vw 0;
        color: #FFFEFC;
        background-color: #333333;
        font-size: 24px;
        align-items: center;
        justify-content: center;
        margin: auto;
      }
      .couple-contact-titlep:hover{
        display: flex;
        width: 20%;
        padding: 0.5vw 0;
        color: #FFFEFC;
        background-color: #E5001B;
        font-size: 24px;
        align-items: center;
        justify-content: center;
        margin: auto;
        border-radius: 50px;
        box-shadow: 0.9vw 0.7vw #D4DDA2;
      }
      .couple-contact-titlep:active{
        display: flex;
        width: 20%;
        padding: 0.5vw 0;
        color: #FFFEFC;
        background-color: #E5001B;
        font-size: 24px;
        align-items: center;
        justify-content: center;
        margin: auto;
        border-radius: 50px;
        box-shadow: 0.9vw 0.7vw #D4DDA2;
      }
      .couple-contact-title a{
        text-decoration: none;
        color: #FFFEFC;
      }
      .couple-contact-titletext{
        display: block;        
        width: 80%;
        padding: 1.5vw 0 0 0;
        margin: auto;
      }
      .couple-contact-titletext p{
        text-align: center;
        font-size: 18px;
      }
      .couple-contact-container{
        width: 100%;
        background-image: linear-gradient(0deg, rgba(255, 254, 252, 1) 1%, rgb(235, 245, 195) 10%);
        padding: 0 0 5% 0;
      }
      .couple-contact{
        position: relative;
        display: flex;
        width: 100%;
        flex-direction: row;
        flex-wrap: wrap;
      }    

      .couple-contactbox{
        display: flex;
        width: 100%;
        max-width: 1000px;
        flex-direction: row;
        flex-wrap: wrap; 
        margin: auto;
        z-index: 1;
      }
      .couple-contactbox01{
        display: flex;
        justify-content: center;
        align-items: flex-start;
        padding: 3%;
        padding-top: 2%;
        padding-bottom: 2%;
        width : 33.33333% ; /* 未対応ブラウザ用フォールバック */
        width : -webkit-calc(100% / 3) ;
        width : calc(100% / 3) ;

      }
      .couple-contactbox02{
        width: 100%;
        justify-content: center;
        align-items: flex-start;
      }
      .contact-text{
        width: 100%;
        text-align: justify;
        font-size: 16px;
      }
      
      .couple-contactbox02img{
        padding: 5% 0;
      }
      .contact-img{
        display: block;
        margin: auto;
        width: 70%;
      }
      .couple-contactbox02 img{
        background-color: #FFFEFC;
        border:solid 2px;
        border-radius: 50%;
      }
      .couple-contactbox02 img:hover{
        background-color: #FFF33F;
        border-color:#FFFEFC;
        border-radius: 50%;
        filter: drop-shadow(0 0.5vw 0.3vw #BFD0A7);
      }
      .couple-contactbox02 img:active{
        background-color: #FFF33F;
        border-color:#FFFEFC;
        border-radius: 50%;
        filter: drop-shadow(0 0.5vw 0.3vw #BFD0A7);
      }

      .couple-contact-box{
        width: 100%; 
        display: flex;
        align-items: center;
        justify-content: center;
      }
      .couple-contactbox{
        display: flex;
        align-items: flex-start;
        justify-content: center;
        margin: 0 7%;
      }
      .categorybr02{
        display: block;
      }
      .yellowp{
        color: #FFF33F;
      }

      /*ボーダー*/
      .bg_pattern {
        position: absolute;
        top: 40%;
        left: 30%;
        width: 70%;
        height: 50%;
        margin: 0 0 0 auto;
        background-color: transparent;
        opacity: 0.4;
        z-index: 0;
      }
      .Diagonal_v3 {
        background-size: 20px 20px;
        background-image: repeating-linear-gradient(-45deg, #ffff 0, #ffff 2px, transparent 0, transparent 50%);
      }


      @media (max-width: 1920px) and (min-width: 1700px) {
        .couple-text02{
          width: 45%;
        }
        .coupleh3{
          left: 45%;
        }
        .couple-category-titlep2{
          font-size: 18px;
        }
        .couple-contact-titletext p{
          font-size: 18px;}
      }
      @media (max-width: 1699px) and (min-width: 1400px) {
        .couple-text02{
          width: 50%;
        }
        .coupleh3{
          left: 50%;
        }
        .couple-category-titlep2{
          font-size: 18px;
        }
        .couple-contact-titletext p{
          font-size: 18px;}
      }
    @media only screen and (max-width: 1000px) {
      .coupleh3{
        font-size: min(5em,36px);
      }
      .couple-text02box p{
        font-size: min(1.3em,16px);
      }
      .category-text-titlebox p{
        font-size: min(1.3em,16px);
      }
      .couple-contact-titlep{
        font-size: min(1.3em,18px);
      }
      .couple-category-titlep{
        font-size: min(1.3em,18px);
      }
      .categorybr{
        display:block;
      }
    }

    @media only screen and (max-width: 786px) {
      .coupleh3{
        font-size: 32px;
        left: 60%;
      }
      .couple-text02box p{
        font-size: 14px;
      }
      .contact-img{
        width: 100%;
      }
      .contact-text{
        font-size: 14px;
        line-height: 120%;
      }
      .couple-text02{
        display: table;
        width: 75%;
        margin: auto;
        text-align: center;
        line-height: 1.8em;
      }
      .couple-h2text{
        font-size: 16px;
      }
      .categorybox{
        width: 100%;
      }
      .couple-contact-title{
        padding: 6vw 0 0 0;
      }
      .couple-contact-titlep{
        width: 40%;
        font-size: 16px;
        padding: 1vw 0;
      } 
      .couple-contact-titlep:hover{
        width: 40%;
        font-size: 16px;
        padding: 1vw 0;
        background-color: #E5001B;
      }
      .couple-contact-titlep:active{
        width: 40%;
        font-size: 16px;
        padding: 1vw 0;
        background-color: #E5001B;
      }

      .category-box01{
        margin-top: 0;
        padding: 0 5%;
      }
      .couple-category-title{
        padding-top: 11%;
      }
      .couple-category-titlep{
        width: 40%;
        font-size: 16px;
        padding: 1vw 0;
      }
      .couple-category-titlep:hover{
        width: 60%;
        font-size: 16px;
        padding: 1vw 0;
      }
      .couple-category-titlep:active{
        width: 60%;
        font-size: 16px;
        padding: 1vw 0;
      }
      .couple-category-titlep2{
        font-size: 14px;
      }
      .category{
        width : 50%;
      }
      .category01{
        width: 100%;
      }
      .category-text{
        font-size: 14px;
      }
      .category-img{
        text-align: center;
        width: 100%;
      }
      .category-text-titlebox p{
        padding-bottom: 0.2rem;
        font-size: 14px;
      }
      
      .couple-contact{
        padding: 0 0 10% 0;
      }
      .couple-contact-box{
        width: 100%; 
        display: flex;
        align-items: center;
        justify-content: center;
      }
      .couple-contactbox{
        display: flex;
        align-items: start;
        justify-content: start;
        margin: 0 7%;
      }
      .couple-contactbox01{
        width: 50%;
        padding: 0 2% 2% 2%;
      }
      .couple-contact-container{
        width: 100%;
        background-image: linear-gradient(0deg, rgba(255, 254, 252, 1) 1%, rgba(240, 250, 210, 1) 10%);        
      }
      .couple-contactbox02 img{
        width: 70%;
        border:solid 1px;
      }
      .content01{
        height: 50px;
      }
      .couple-contact-titletext p{
        font-size: 14px;
      }
      .couple-contact-titletext{
        padding-bottom: 2%;
      }
      .categorybr02{
        display:none;
      }
    }

    @media only screen and (max-width: 500px) {
      .contact-text-spnone{
        display: none;
      }
      .category-text{
      display: none;
      }
      .couple-contact-title{
        padding: 6vw 0 0 0;
      }
      .couple-contact-titletext{
        padding-bottom: 4%;
      }
      .couple-contactbox{
        justify-content: center;
      }
      .couple-contactbox01{
        width: 100%;
        padding: 0;
      }
      .couple-contactbox02{
        display: flex;
        width: 100%;
        text-align: center;
        justify-content: center;
        align-items: center;
      }
      .couple-contactbox02 img{
        width: 100%;
      }
      .couple-contactbox02 a{
        width: 30%;
      }
      .couple-contactbox02 p{
        width: 70%;
        padding-left: 4%;
        padding-bottom:2%;
      }
      .couple-category-titlep{
        width: 65%;
      }
      .couple-category-titlep:active{
        width: 65%;
    }
  }
    @media only screen and (max-width: 400px) {
      .coupleh3{
        font-size: 28px;
        left: 60%;
      }
      .category-text-titlebox p{
        font-size: 12px;
      }
    }