@charset "UTF-8";
/* page.css
----------------------*/

.contents-main {
    padding: 0 0px 0px;
}
.contents p {
         margin-bottom: 0; 
    }
.main {
  font-family: "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "Yu Gothic", YuGothic, "游ゴシック体", Meiryo, メイリオ, Helvetica, Arial, sans-serif;
    font-size: 0.9em;
    color: #000;
    line-height: 1.45;
}
#main_wrap {
	margin-bottom: 18vw;
    padding-bottom: 5vw;
}
main img {
    width: 100%;
    height: auto;
    vertical-align: bottom;
    display: block;
}
.sp_2 {display: block;}
.pc_2 {display: none;}

.indent,.indent2 {
    margin: 2vw 0 0;
}
.indent li {
    padding-left: 1em;
    text-indent: -1em;
    line-height: 1.4;
}
.indent2 li {
    padding-left: 2em;
    text-indent: -2em;
    line-height: 1.4;
}
.indent li.no_indent {
    padding-left: 0em;
    text-indent: 0em;
}
.mt4 {
    margin-top: 5vw;
}
.mt3 {
    margin-top: 3vw;
}
.mt0 {
    margin-top: 0!important;
}
.mt6{
	margin-top: 6vw!important;
}
.mt10{
	margin-top: 10vw!important;
}
.width_80{
	width: 80%;
	margin: 0 auto;
}
.width_87 {
    width: 87%;
    margin: 0 auto;
}
.txt_ul{
	color: #fff!important;
	text-decoration: underline;
}
a {
	color: #ce0f31!important;
	text-decoration: underline;
}
a.txt_bl {
	color: #000!important;
}

a:hover {
    opacity: 0.7;
}

.font_red,a,.pc .contents-main a:visited,.pc .contents-main a:hover {
    color: #0052f9;
}
.entry_btn {
    max-width: 80%;
    margin: 0 auto 4vw;
}
.font35{
	font-size: 3.5vw;
} 


/*共通*/
.bg_white {
	background-color: #fff;
	border-radius: 3vw;
	padding: 4vw;
}
.bg_blue{
	background-color: #0b297c;
	border-radius: 3vw;
	padding: 4vw;
}
.bg_red{
	background-color: #ee3f5f;
	border-radius: 3vw;
	padding: 4vw;
}
.bg_gray{
	background-color: #e4e4e4;
	border-radius: 3vw;
	padding: 4vw;
}
.bg_2color {
	background: linear-gradient(to right, #f8c3cc 0%, #f8c3cc 50%, #f3e4a6 50%, #f3e4a6 100%);
}
.bg_gold {
	background-color: #f3e4a6;
}

.contents_pd {
	padding: 6vw 4vw;
}
.txt_wh {
	color: #fff;
}
.txt_red {
	color: #cf0f31;
}
.txt_yw {
	color: #ffe63c!important;
}
.txt_blue{
	color: #0068f5!important;
}
.txt_b {
	font-weight: bold;
}
.txt_center {
	text-align: center;
}
.txt_right{
	text-align: right;
}
.position_r{
	position: relative;
}




/*--------テキスト・エントリーボタン--------*/
.box01,.box08{
	background-color: #e1f4ff;
	padding: 4vw 4vw 10vw;
}
.top_note {
	text-align: center;
	margin-bottom: 2vw;
}
.btn_01 {
	width: 90%;
	margin: 3vw auto 0;
}




/*--------対象の加盟店をチェック！--------*/
.box02{
	background-color: #0b297c;
	background-image: url("../images/bg_01.png");
	background-size: 100%;
	padding: 6vw 4vw 14vw;
}
.box02_title{
	padding: 3vw 10vw;
	background-color: #244192;
	border-radius: 3vw;
}
.box_title{
	margin-top: -12vw;
}
.box02_title02{
	padding: 0vw 6vw;
}
.flex_box{
	display: flex;
  	flex-wrap: wrap;
}
.flex_box img{
	padding-right: 3vw;
	width: 33%;
}
.flex_box img:nth-child(3n){
	padding-right: 0;
}




/*--------キャンペーン内容--------*/
.box03{
	background-color: #fff000;
	background-image: url("../images/bg_02.png");
	background-size: 100%;
	padding: 6vw 4vw 14vw;
}
.box03_title{
	padding: 3vw 10vw;
	background-color: #fffccb;
	border-radius: 3vw;
}

.box04{
	background-color: #d00e31;
	background-image: url("../images/bg_03.png");
	background-size: 100%;
	padding: 6vw 4vw;
}
.cp_bg_white{
	background-color: #fff;
    border-radius: 3vw;
    padding: 4vw 5vw 4vw 13vw;
    position: relative;
}
/*アコーディオン　規約*/
.terms_accordion_title a {
	text-decoration: none;
}
.terms_accordion_title.default .icon_wrap {
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
}
.terms_accordion_title.default.open .icon_wrap {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
.terms_accordion_title.default .icon_wrap .icon:before {
  content: none;
}
.terms_accordion_title.default .icon_wrap .icon {
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
}
.terms_accordion_title.open .icon_wrap .icon:after {
    transform: translate(-50%, -50%) rotate(0deg);
}
.terms_accordion_title.default.open .icon_wrap .icon:after {
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
}

.terms_accordion_inner.default {
  display: block;
}
.terms_accordion_container {
    background-color: #fff;
    margin: 5vw 0 0;
    border: 0.7vw solid #000000;
    border-radius: 1vw;
}
.terms_accordion_title {
    position: relative;
	    padding: 3vw 4vw;
  font-size: 4vw;
  font-weight: 600;
  text-align: center;
}
@media print, screen and (max-width:767px)  {
.icon_wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 50%;
  left: calc(100% - 50px);
  width: 18px;
  height: 40px;
  margin-top: -20px;
  box-sizing: border-box;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  transform-origin: center center;
  transition-duration: 0.2s;
}
	    
	.stickyBtn {
        padding: 20px 300px;
        width: 100%;
    }
}
@media print, screen and (min-width:768px) {
.icon_wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 48%;
    right: 2%;
  width: 18px;
  height: 40px;
  margin-top: -20px;
  box-sizing: border-box;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  transform-origin: center center;
  transition-duration: 0.2s;
}	
}
.icon {
  display: block;
  width: 18px;
  height: 18px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  transform-origin: center center;
  transition-duration: 0.2s;
  position: relative;
}

.terms_accordion_title.default.open .icon_wrap .icon {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
.terms_accordion_title.open .icon_wrap {
  -webkit-transform: rotate(-360deg);
  transform: rotate(-360deg);
}

.icon:before, .icon:after {
  display: flex;
  content: '';
  background-color: #000;
        width: 13px;
    height: 3px;
    position: absolute;
    top: 7px;
    left: 3px;
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
  transform-origin: center center;
}
.icon:before {
        width: 3px;
    height: 13px;
    top: 2px;
    left: 7.5px;
}
.terms_accordion_title.default .icon_wrap .icon:before {
  content: none;
}
.terms_accordion_title.open .icon_wrap .icon:before {
  content: none;
}
.terms_accordion_title.default.open .icon_wrap .icon:before {
  content: "";
}
.terms_accordion_title.open .icon_wrap .icon:after {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
.terms_accordion_title.default.open .icon_wrap .icon:after {
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
}

.terms_accordion_inner {
  display: none;
    border-top: 1.4px solid #000000;
    padding: 3vw 4vw 3vw;
    background-color: #ffffff;
	color: #000;
}

.terms_accordion_inner>ol {
    display: flex;
	flex-wrap: wrap;
	justify-content: left;
}
.terms_accordion_inner>ol>li:nth-of-type(1) {
    /*width: 7%;*/
        font-size: 1.4em;
    font-weight: bold;
	color: #000;
}
.terms_accordion_inner>ol>li:nth-of-type(2) {
    width: 93%;
        margin-top: 0.5vw;
	overflow-wrap: break-word; 
	margin-left: 1vw;
}
.terms_indent {
    padding-left: 1em;
    text-indent: -1em;
    line-height: 1.4;
}
.terms_indent2 {
    padding-left: 2em;
    text-indent: -1em;
    line-height: 1.4;
}

.cp_code {
	text-align: right;
	margin-top: 2vw;
}




/*--------キャンペーンの流れ--------*/
.pb0{
	padding-bottom: 0;
}
.step{
	position: absolute;
    width: 31%;
    top: 4vw;
    left: -2.3vw;
}
.arrow{
	position: absolute;
    bottom: -8vw;
    left: 50%;
    width: 13%;
    z-index: 4;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
}




/*--------年間のお買い物でd払いを使うとdポイントがザクザクたまる！--------*/
.box05{
	background-color: #ffce00;
	background-image: url("../images/bg_04.png");
	background-size: 100%;
	padding: 6vw 4vw;
}

.bg_white_p0{
	background-color: #fff;
	border-radius: 3vw;
	padding-top: 2vw;
	margin-top: 7vw;	
	position: relative;
}




/*--------d払いのお支払いをdカードに設定しよう--------*/
.box06{
	background-color: #d00e31;
	background-image: url("../images/bg_03.png");
	background-size: 100%;
	padding: 6vw 4vw 18vw;
}
.box06_txt{
	position: absolute;
    bottom: -22vw;
    left: 50%;
    width: 91%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
}
.plus{
	position: absolute;
    bottom: -12vw;
    left: 50%;
    width: 10%;
    z-index: 4;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
}
.btn_txt{
	width: 80%;
	margin: 0 auto 3vw;
}
.bg_white02{
	background-color: #fff;
	border-radius: 3vw;
	padding: 5vw 8vw;
	position: relative;
}
.box06_img01{
	position: absolute;
    width: 22%;
    top: -5vw;
    left: 3vw;
}
.box06_img02{
	position: absolute;
    width: 16%;
    bottom: -5vw;
    right: -1vw;
}



/*--------1回だけの設定でポイントがたまりやすくなる--------*/
.box07{
	background-color: #3f66d3;
	background-image: url("../images/bg_05.png");
	background-size: 100%;
	padding: 6vw 4vw;
}
.box_title02{
	margin-top: -19vw;
}
/*スライド*/
.slick .slide {
    width: 300px;/* 各スライドの幅を固定 */
}
.slick-slider {
    padding-bottom: 0!important;
}
.point_detail_slide {
	background-color: #fff;
	padding: 1.3vw 1.3vw 3vw;
	border-radius: 2vw;
	margin: 5vw 0;

}
.slide_title{
	width: 50%;
	margin: 0 auto 5vw;
}
/*.point_detail_slide .point_detail_slide_inner {
	width: 80%;
	margin: 5.3vw 5.3vw 4vw;
}*/
.point_detail_slide {
    background-color: #fff;
    padding: 6vw 3vw 6vw;
    border-radius: 2vw;
    margin: 5vw 0;
}
.point_detail_slide_inner_img {
    display: block;
    width: 62%;
    margin: 0 auto;
    height: auto;
}
.point_detail_slide_inner_img02{
	display: block;
    width: 86%;
    margin: 0 auto;
    height: auto;
}
.txt_fukidasi{
	position: relative;
	text-align: center;
  padding: 2vw;
  border: 0.3vw solid #cf0f31;
  background-color: #ffffff;
	margin-top: 2vw;
}
.txt_fukidasi::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  border-style: solid;
  border-width: 0 2.5vw 2.5vw 2.5vw;
  border-color: transparent transparent #cf0f31;
  translate: -50% -100%;
}

.txt_fukidasi::after {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  border-style: solid;
  border-width: 0 2vw 2vw 2vw;
  border-color: transparent transparent #ffffff;
  translate: -50% -100%;
}

.slick-prev {
    position: absolute;
    top: 50%;
    width: 0;
  height: 0;
  border-style: solid;
  border-top: 4vw solid transparent;
  border-bottom: 4vw solid transparent;
  border-right: 6vw solid #d00e31;
	z-index: 4;
}
.slick-next {
    position: absolute;
    top: 50%;
    height: 0;
	 border-style: solid;
	 border-top: 4vw solid transparent;
	 border-bottom: 4vw solid transparent;
	 border-left: 6vw solid #d00e31;
	 border-right: 0;
	z-index: 4;
}
.slick-disabled{
	display: none!important;
}


 /*//フローティング//*/
.stickyBtn {
    padding: 3vw 12vw;
    background-color: #ffffff;
    z-index: 99;
}
.stickyBtn_items ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.stickyBtn_items ul li {
	width: 48%;
}









/*-----PC表示------*/
@media screen and (min-width: 768px) {
	#main_wrap {
	margin-bottom: 0;
    padding-bottom: 0;
}

    .contents {
		margin: 60px auto 0;
		padding-bottom: 143px;
	}
	
    .main {
		font-size: 17px;
		line-height: 2.5rem;
	}
    .sp_2 {display: none;}
    .pc_2 {display: block;}
	
	.indent,.indent2 {
    margin: 20px 0 0;
    font-size: 14px;
}
.mt4 {
    margin-top: 37px;
}
.mt3 {
    margin-top: 20px;
}
.mt6 {
    margin-top: 41px!important;
}
.mt10 {
    margin-top: 90px !important;
}

	
	
/*共通*/
.contents_pd {
	padding: 30px 100px;
}
.contents_pd.-pc {
	padding: 50px 120px;
}
.bg_white {
    border-radius: 20px;
    padding: 30px 40px;
}

	
	
	
/*--------テキスト・エントリーボタン--------*/
.box01, .box08 {
    padding: 35px 200px 64px;
}
.top_note {
	margin-bottom: 20px;
}
.btn_01 {
	max-width: 500px;
	margin: 30px auto 0;
}


/*--------対象の加盟店をチェック！--------*/
.box02 {
    background-size: 100%;
    padding: 35px 200px 64px;
}
.box_title {
    margin-top: -77px;
}
.box02_title {
    padding: 20px 84px;
    border-radius: 20px;
}
.box02_title02 {
    padding: 0 30px;
}
.flex_box img {
    padding-right: 20px;
    width: 153px;
    height: 153px;
}
	
	
/*--------キャンペーン内容--------*/
.box03 {
    background-size: 100%;
    padding: 35px 200px 64px;
}
.box03_title {
    padding: 20px 84px;
    border-radius: 20px;
}
/*アコーディオン　規約*/
.terms_accordion_container {
    margin: 50px 0 0;
    border: 3px solid #000000;
    border-radius: 10px;
}
.terms_accordion_title {
  font-size: 30px;
	padding: 30px 50px;
}
.terms_accordion_inner {
    padding: 20px 30px 20px;
	border-radius: 0 0 10px 10px;
}
.cp_code {
	text-align: right;
	margin-top: 10px;
}
.icon_wrap {
        right: 7%;
    }
.icon:before {
    width: 5px;
    height: 23px;
}
.icon:after {
    width: 23px;
    height: 5px;
	 top: 11px;
    left: -1px;
}
	
/*--------キャンペーンの流れ--------*/
.box04 {
    background-size: 100%;
    padding: 35px 200px 45px;
}	
.cp_bg_white {
    border-radius: 20px;
    padding: 30px 61px 30px 83px;
}	
.step {
    width: 160px;
    top: 30px;
    left: -15px;
}
	.arrow {
    bottom: -59px;
    width: 95px;
}
	
/*--------年間のお買い物でd払いを使うとdポイントがザクザクたまる！--------*/	
.box05 {
    background-size: 100%;
    padding: 35px 200px 45px;
}
.bg_blue {
    border-radius: 32px;
    padding: 15px;
}	
	
/*--------d払いのお支払いをdカードに設定しよう--------*/	
.box06 {
    background-size: 100%;
    padding: 35px 200px 64px;
}
.bg_red {
    border-radius: 20px;
    padding: 25px 52px;
}
.box06_txt {
    bottom: -127px;
}
.bg_white_p0 {
    border-radius: 20px;
    padding-top: 13px;
    margin-top: 58px;
}
.plus {
    position: absolute;
    bottom: -85px;
    width: 12%;
}
.btn_txt {
    margin: 0 auto 24px;
}
.bg_white02 {
    border-radius: 20px;
    padding: 25px 60px;
}
	
	
/*--------1回だけの設定でポイントがたまりやすくなる--------*/
.box07 {
    background-size: 100%;
    padding: 35px 200px 45px;
}
.box_title02 {
    margin-top: -91px;
}
.bg_gray {
    border-radius: 20px;
    padding: 25px;
}

/*スライド*/
.point_detail_slide {
	padding: 20px 10px 40px;
	border-radius: 20px;
	margin: 20px 0;

}
.point_detail_slide .point_detail_slide_inner {
        margin: 20px 50px 0px;
   }
.slide_title {
    margin: 0 auto 35px;
}
.font35 {
    font-size: 20px;
}
.txt_fukidasi {
    padding: 12px;
    border: 3px solid #cf0f31;
    margin-top: 20px;
}
.txt_fukidasi::after {
    border-width: 0 16px 16px 16px;
}
.txt_fukidasi::before {
    border-width: 0 20px 20px 20px;
}
.slick-next {
    border-top: 30px solid transparent;
    border-bottom: 30px solid transparent;
    border-left: 42px solid #d00e31;
}
.slick-prev {
    border-top: 30px solid transparent;
    border-bottom: 30px solid transparent;
    border-right: 42px solid #d00e31;
}	
	

 /*//フローティング//*/
.stickyBtn {
    padding: 20px 254px;
	width: 100%;
	max-width: 940px;
}
.stickyBtn_items {
	margin: 0 auto;
}
.stickyBtn_items ul {
	justify-content: center;
}
.stickyBtn_items ul li {
	max-width: 300px;
}
.stickyBtn_items ul li:first-of-type {
	margin-right: 20px;
}

}



