@charset "utf-8";
/* CSS Document */
.mainArea { margin-bottom:50px; }
.center { text-align: center; }
#coupon_gaiyo a{ text-decoration: underline; }
#coupon_gaiyo ul.asterisk li { list-style-type: none; text-indent: -1em; }
#coupon_gaiyo ul.asterisk li:before { display: inline; content: "※"; }
/*　終了ボタン　*/
.button03_cp { display: block; background: #C90027; text-align: center; padding: 18px 0; position: relative; transition: all .3s; pointer-events: none; }
.button03_cp span { color: #fff; font-size: 1.8rem; line-height: 24px; }
#a01 , #b02 { margin-top:-60px; padding-top:60px; }
/* -------------------------------------------------------------------- 
カウンター
-------------------------------------------------------------------- */
#countdown-text {
margin-right: 10px;
font-size: clamp(1rem, 3vw, 1.8rem);
border: 1px solid #fff;
padding: 2px 8px;
font-weight: bold;
color: #fff;
}
#countdown-timer {
font-weight: bold;
}
/* 表示のガタつきをなくすためのスタイル */
#countdown-timer span {
font-size: clamp(2rem, 5vw, 2.5rem);
display: inline-block;
font-weight: bold;
margin-right: 5px;
color: #fff;
}
/* 単位部分のスタイル修正 */
#countdown-timer .unit {
font-size: clamp(1rem, 3vw, 1.8rem);
font-weight: normal;
margin-right: 10px;
}
/*===============================================
●SP 画面の横幅が768pxまで
===============================================*/
@media only screen and (max-width: 768px) {
/*　終了ボタン　*/
.button03_cp { display: block; background: #C90027; width: 100%; text-align: center; padding: 18px 0; position: relative; transition: all .4s; -webkit-transition: all .4s; -moz-transition: all .4s; -ms transition: all .4s; }
.pc {display: none !important;}
.sp {display: block !important;}
img {max-width: 100%;}
#coupon_2511 {width: 100%;}
#coupon_2511 ul { margin: 0;padding: 2% 0 5%;}
#coupon_2511 .fv {background-color: #FCF7F3; }
#coupon_gaiyo {margin: 40px 0;}
.btn {width: 50%; margin: 50px auto;}
#coupon_gaiyo .attention {font-size: 16px; text-align: center; color: #fff; background-color: #666; padding: 5px;margin: 0 3%;}
#coupon_gaiyo section ul li:before {font-size: 13px ;margin-left: -10px;}
#coupon_gaiyo {width: 100%;margin: 20px auto;}
#coupon_gaiyo ul.asterisk {	padding: 5% 2% 0 7%;}
#coupon_gaiyo ul.asterisk li {margin-bottom: 5px;font-size: 12px;}
.cp_end{text-align:center; margin:0px; padding:2%; background-color:#000;}
.cp_end h3{font-size:18px; color:#FFF; line-height:1.3;}
#a01 {margin-bottom: 23px;}
p.kikan { padding: 4% 4% 0 4%; font-weight: bold;}
/* -------------------------------------------------------------------- 
カウンター
-------------------------------------------------------------------- */
#countdown-container {
max-width: 768px;
width: 100%;
margin: auto;
/*position: absolute;*/
/*top: 0;*/
left: 0;
right: 0;
bottom: 10%;
background-color: #d20099;
color: #fff;
text-align: center;
padding: 4px 0;
/*z-index: 1000;*/
display: flex; /* PC表示では横並び */
justify-content: center;
align-items: center;
flex-wrap: wrap; /* 子要素の折り返しを許可 */
}
#countdown-container {
flex-direction: column; /* 縦並びに変更 */
}
#countdown-text {
margin-right: 0;
margin-bottom: 1px;
}
}
/*===============================================
●PC 画面の横幅が768px
===============================================*/
@media only screen and (min-width: 768px) {
/*　終了ボタン　*/
.button03_cp {width: 400px;}
.pc {display: block !important;}
.sp {display: none !important;}
#coupon_2511 {width: 768px;margin: 0 auto;}
#coupon_2511_2 {width: 768px;margin: 0 auto;}
#coupon_2511 h1 {text-align: center;}
#coupon_2511 .fv { position: relative; background-color: #FCF7F3;}
#coupon_2511 .fv ul {width: 768px;margin: 0 auto;padding-bottom: 20px; overflow: hidden;}
#coupon_2511 .fv ul li {float: left;}
#coupon_2511 .btn {margin: 50px;}
#coupon_gaiyo {width: 768px;margin: 50px auto;}
#coupon_gaiyo .attention {font-size: 24px; text-align: center; color: #fff; background-color: #666; padding: 10px; margin: 0 30px;}
#coupon_gaiyo ul.asterisk { padding: 20px 60px;}
#coupon_gaiyo ul.asterisk li {font-size: 16px;margin-bottom: 10px;}
.cp_end{text-align:center; margin:0px; padding:2%; background-color:#000;}
.cp_end h3{font-size:24px; color:#FFF; line-height:1.3;}
.br-pc { display:none;}
p.kikan { font-size: 16px; line-height: 2; font-weight: bold; padding: 20px 37px 0;}
html {font-size: 78.195%;}
body {font-size: 1.2rem;line-height: 1.75em;}
/* -------------------------------------------------------------------- 
カウンター
-------------------------------------------------------------------- */
#countdown-container {
max-width: 768px;
width: 75%;
margin: auto;
/*position: absolute;*/
/*top: 0;*/
left: 0;
right: 0;
bottom: 10%;
background-color: #d20099;
color: #fff;
text-align: center;
padding: 8px 0;
/*z-index: 1000;*/
display: flex; /* PC表示では横並び */
justify-content: center;
align-items: center;
flex-wrap: wrap; /* 子要素の折り返しを許可 */
}
}

/*  ボタンデザイン変更*/
.buttons .button {
  background-color: #d20099;
  box-shadow: -4px 4px 6px rgba(0, 0, 0, 0.3);
  border-color: #000;
  border-radius: 6px;
}