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

 /*********************************
              全体
*********************************/

#wrapper {
	overflow: hidden;
	width: 100%;
	display: block;
	}
#wrapper img {
	width: 100%;
	}


#wrapper p, #wrapper h3 {
    text-align: center;
    letter-spacing: 0.25rem;
	color: #785458;
}

#wrapper span.br {
    display: block;
}


/* リンク */

html { scroll-behavior: smooth;}







	
/*********************************
         　　  共有
*********************************/		
/*テキスト*/


#wrapper .title {
	color: white;
	font-weight: bold;
	letter-spacing: 0.5vw;
    border-style: none;
}

#wrapper  {
    background-color: #ebdfe3;
}

#wrapper  .red_at {
    color: #fd4577;
}

#wrapper .event_boldtxt {
    font-size: 5vw;
    font-weight: bold;
    letter-spacing: 0.1rem;
    margin-top: 5%;
}



#wrapper h4{
	font-size:7vw;
	text-align: center;
}


#wrapper .button {
  text-align: center;
  margin: 7% 0 8%;
}

#wrapper .button a {
    display: inline-block;
    background: #785458;
    width: 70%;
    padding: 3.5%;
    font-size: 4.4vw;
    text-align: center;
    color: white;
    position: relative;
    font-weight: bold;
    text-decoration: none;
    letter-spacing: 1.2px;
    border-radius: 100px;
}

.button a::after {
    content: '';
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5px 0 5px 8px;
    border-color: transparent transparent transparent white;
    position: absolute;
    top: 0;
    right: 12%;
    bottom: 0;
    margin: auto;
}


/*配置*/

#wrapper .e_box, #wrapper .topview{
	position: relative;
}


    .bbs {
      background: #fd7c92;
      color: #fff;
      overflow: hidden;
      width: 100%;
      display: flex;
      align-items: center;
      height: 40px;
      position: relative;
      font-size: 20px;
      white-space: nowrap;
    }
    .marqueeTrack {
      display: flex;
      white-space: nowrap;
      animation: flowing 70s linear infinite;
    }
    @keyframes flowing {
      0% { transform: translateX(0); }
      100% { transform: translateX(-50%); }
    }

.fade-in {
  opacity: 0;
  transform: translateY(10px);
  transition: opacity 1.5s ease, transform 1.5s ease;
}
.fade-in.visible {
  opacity: 1;
  transform: translateY(0);
}


.fuwa1 {
  animation: fuwafuwa1 4s ease-in-out infinite;
}
@keyframes fuwafuwa1 {
  0%   { transform: translate(0, 0); }
  50%  { transform: translate(12px, -18px); }
  100% { transform: translate(0, 0); }
}


.fuwa2 {
  animation: fuwafuwa2 5s ease-in-out infinite;
}
@keyframes fuwafuwa2 {
  0%   { transform: translate(0, 0) rotate(0deg); }
  50%  { transform: translate(-14px, -20px) rotate(3deg); }
  100% { transform: translate(0, 0) rotate(0deg); }
}


.fuwa3 {
  animation: fuwafuwa3 6s ease-in-out infinite;
}
@keyframes fuwafuwa3 {
  0%   { transform: translate(0, 0); }
  25%  { transform: translate(10px, -12px); }
  75%  { transform: translate(-12px, -20px); }
  100% { transform: translate(0, 0); }
}


.fuwa4 {
  animation: fuwafuwa4 4.5s ease-in-out infinite;
}
@keyframes fuwafuwa4 {
  0%   { transform: translate(0, 0); }
  50%  { transform: translate(16px, -16px); }
  100% { transform: translate(0, 0); }
}

.fuwaSoft {
  animation: fuwafuwaSoft 5s ease-in-out infinite;
}
@keyframes fuwafuwaSoft {
  0%   { transform: translate(0, 0); }
  50%  { transform: translate(5px, -8px); }
  100% { transform: translate(0, 0); }
}



	
/*********************************
           メインエリア
*********************************/	
/*topview*/


#wrapper   {
	background-image: url(https://shop.aimerfeel.jp/img/page/aimerfeelweek/aw_bg_02.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center top;
}


#wrapper .title_name {
    width: 95%;
    margin: 0 auto;
    padding: 5% 0 0;
}

#wrapper .bubble {
    position: absolute;
    width: 25%;
    right: -5%;
    top: 3%;
	z-index: 99;
	opacity: 0.5;
}

#wrapper .bubble2 {
    position: absolute;
    width: 25%;
    top: 25%;
    left: 9%;
	z-index: 99;
	opacity: 0.5;
}

#wrapper .bubble3 {
	position: absolute;
    width: 40%;
    right: -23%;
    bottom: 38%;
	z-index: 99;
	opacity: 0.5;
}

#wrapper .bubble4 {
	position: absolute;
    width: 40%;
    left: -5%;
    bottom: 15%;
	z-index: 99;
	opacity: 0.5;
}


#wrapper .title_img {
    margin-top: -5%;
}



#wrapper .title_event {
    width: 80%;
    margin: 0 auto;
}

#wrapper .e_box  {
	width: 90%;
    margin: 8% auto 16%;
    background-color: white;
    border: 2px solid #fd7c99;
    box-shadow: 0 0 10px #f5c2ca;
    border-radius: 22px;
	padding-bottom: 3%;
}

#wrapper .et-1  {
	width: 36%;
    margin: -4% auto 0;
}

#wrapper .pers  {
    font-weight: bold;
    font-size: 7vw;
	margin: 6% auto 2%;
}

#wrapper .cashback  {
    width: 75%;
	margin: 3% auto 0;
}

#wrapper .pink_p  {
	background: #ffdde0;
    padding: 3%;
	margin: 8% 0 7%;
}

#wrapper .pink_txt  {
    color: #fd4577;
    font-weight: bold;
    letter-spacing: 0.001em;
    font-size: 4.4vw;
    line-height: 1.8em;
}

#wrapper .att {
    margin-bottom : 2%;
    letter-spacing: 0.01em;
	text-align: justify;
}

#wrapper .att_box {
    width: 85%;
    margin: 0 auto;
	margin-bottom: 10%;
}

#wrapper .f_line {
    display: flex;
    justify-content: center;
    gap: 5%;
    margin: 5% 0;
}

#wrapper .p_nor {
	font-weight: normal;
}

#wrapper .p_lar {
	font-size:5.3vw;
}


#wrapper .line_icon {
	width: 18%;
}

#wrapper .line_txt {
    font-size: 5vw;
    color: #785458;
    font-weight: bold;
    text-align: center;
}

#wrapper .att_2 {
    margin-top: -3%;
    font-size: 3.7vw;
    letter-spacing: 0.001em;
}

#wrapper .password {
	margin: 5% 0 0;
    font-size: 5.5vw;
}

#wrapper .password_a {
	letter-spacing: 0.02em;
    font-size: 7vw;
    font-weight: bold;
}


#wrapper .event3_txt {
	font-size: 5vw;
    font-weight: bold;
    letter-spacing: 0.02em;
}

#wrapper .bra_p {
	position: absolute;
	top: -2%;
	right: 0;
	width: 32%;
}


#wrapper .sns_box {
	position: relative;
    background: #785458;
    color: white;
    width: 65%;
	margin: 7% auto 5%;
    text-align: center;
    padding: 1%;
    border-radius: 20px;
    font-size: 4.5vw;
}

#wrapper .sns_box::after {
    content: '';
    position: absolute;
    top: 50%;
    right: 12%;
    transform: translate(-50%, -50%);
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 6px 0 6px;
    border-color: white transparent transparent transparent;
}

#wrapper .sns_box::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 16%;
    transform: translate(-50%, -50%);
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 6px 0 6px;
    border-color: white transparent transparent transparent;
}

#wrapper .sns_flex {
    display: flex;
    justify-content: center;
    gap: 11%;
    margin: 5% 0;
}

#wrapper .sns_ico {
	width: 20%;
}

#wrapper .att3 {
    margin: 2.5% auto 5.5%;
    letter-spacing: 1px;
    width: 92%;
    font-size: 3.5vw;
}


#wrapper .event4_txt {
    font-size: 5vw;
    font-weight: bold;
    letter-spacing: 0.1rem;
    margin-top: 5%;
}

#wrapper .event4_txt::after {
  content: "";
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url("https://shop.aimerfeel.jp/img/page/aimerfeelweek/present.png") no-repeat;
  background-size: contain;
  margin-right: 7px;
  vertical-align: middle;
}


#wrapper .e4_date {
	background: #ffdde0;
    color: #fd4577;
    width: 80%;
    margin: 5% auto;
    text-align: center;
    padding: 1%;
    border-radius: 20px;
    font-size: 4vw;
}

#wrapper .bold_at {
    font-size: 3.8vw;
	font-weight: bold;
}

#wrapper .app_coupon {
    margin: 5% 0 8%;
}


#wrapper .e6_txt {
    margin: 5% 0 0;
    font-size: 4.5vw;
    letter-spacing: 0.01rem;
}


#wrapper .e6_l {
    font-size: 8vw;
    letter-spacing: 0.01rem;
}

#wrapper .e6_s {
    font-size: 2vw;
}


#wrapper .pt {
    width: 60%;
    margin: 4% auto;
}



#wrapper .heart {
    width: 18%;
    position: absolute;
    bottom: -5%;
    right: 2%;
}

#wrapper .heart2 {
    width: 18%;
    position: absolute;
    bottom: -5%;
    left: 1%;
}

#wrapper .heart3 {
    width: 18%;
    position: absolute;
    bottom: -15%;
    right: 2%;
}





/*ボタン*/

#wrapper .button a {
	    color: white;	
}
	
	
.button a:link { text-decoration: none;
	    color: white;
 }



.button a:visited { 
	            color: white;
            text-decoration: none; }


	





/*********************************
           pc用指示
*********************************/	

@media (min-width: 768px){
	
#bg_wrapper {
    background-color: #fce4de;
	margin-bottom: 5%;
}
	
 #wrapper .button a {
    width: 80%;
    padding: 5% 10%;
    font-size: 2.2rem;
  }
	
#wrapper {
	max-width: 780px;
	margin: 0 auto;
	display: block;
	}
	
#wrapper p, #wrapper h3 {
    font-size: 2.5rem;
	letter-spacing: 0.5rem;
}
	
	
#wrapper .title_event {
	width: 75%;
}
	
#wrapper .e_box  {
	width: 75%;
}

#wrapper .cashback  {
	width: 70%;
    margin-top: 4%;
}	
	
#wrapper .pers {
	font-size: 4rem;
    letter-spacing: .1em;
}
	
#wrapper .pink_txt {
    font-size: 2.2rem;
	line-height: 1.6em;
    letter-spacing: 0.1em;
}
	
#wrapper .att {
	font-size: 124%;
    line-height: 1.4;

}
	
#wrapper .line_txt {
	font-size: 2.6rem;
    padding-left: .2em;
    line-height: 1.45em;
    letter-spacing: 0.07em;
}
	
#wrapper .line_icon {
	width: 13%;
}
	
#wrapper .p_lar {
	font-size: 3rem;
}
	
#wrapper .att_2 {
	font-size: 124%;
    line-height: 1.8;
}
	
#wrapper .password {
	font-size: 3rem;
    line-height: 1.8em;
}
	
#wrapper .password_a {
	font-size: 3.8rem;
}
	
#wrapper .button a {
	width: 55%;
    padding: 3% 0;
    font-size: 2rem;
  }	

#wrapper .event3_txt {
	padding-left: .2em;
    font-size: 2.5rem;
    line-height: 1.7em;
    letter-spacing: 0.05em;
}	
	
#wrapper .sns_box {
	width: 43.5%;
    border-radius: 30px;
    font-size: 2rem;
}
	
#wrapper .sns_ico {
	width: 14%;
}
	
#wrapper .att3 {
	font-size: 124%;
    line-height: 1.8;
}
	
	
#wrapper .event4_txt {
	padding-left: .2em;
    font-size: 2.6rem;
    line-height: 1.45em;
}
	
#wrapper .event4_txt::after {
	width: 30px;
    height: 40px;
}
	
	
#wrapper .e4_date {
	border-radius: 30px;
	width: 71.5%;
    padding-left: .2em;
    font-size: 2rem;
    letter-spacing: 0.08em;
}
	
#wrapper .bold_at {
	font-size: 2.3rem;
}
	
#wrapper .event_boldtxt {
	padding-left: .2em;
    font-size: 2.6rem;
    line-height: 1.9em;
}	
	
#wrapper .pt {
	width: 43%;
}
	
#wrapper .e6_txt {
	padding-left: .2em;
    font-size: 2.6rem;
    line-height: 1.45em;
    letter-spacing: 0.09em;
}
	
	

}