@charset "UTF-8";
@import "./reset.css";

/**************************************************/
/* index.html */
/**************************************************/

/**************************************************/
/* 共通項目 */
/**************************************************/
body{position:relative;background-color:#fffdd4;min-height:100vh;}
body:before,
body:after{content:'';display:block;font-size:20px;position:absolute;top:0;bottom:0;margin:50px  auto 0;padding:0;background-repeat:repeat;z-index:3;}
body:before{left:0;right:50%;margin-right:773px;background-image:url("../img/bodyLeft.png");background-position:right top;background-size:17em auto;}
body:after{left:50%;right:0;margin-left:801px;background-image:url("../img/bodyRight.png");background-position:left top;background-size:17.9em auto;}

.sp{display:none!important;}

.section{position:relative;width:100%;text-align:center;overflow:hidden;z-index:2;}
.section img{width:100%;height:auto;}
.sectionBox{position:relative;width:100%;max-width:1000px;margin:0 auto;}
.sectionBox:after{content:'';display:block;margin:0 auto;padding:0;}
.sectionLayout{position:relative;z-index:3;}
.sectionLayout:after{content:'';display:block;position:relative;padding:0;z-index:1;}

.hdFixed{position:fixed;top:0;left:0;width:100%;margin:0 auto;}

#menu-close{display:block;position:fixed;top:0;left:0;width:100%;height:0;z-index:4;}
body.hamburger-opened #menu-close{height:100%;}

/* ヘッダ */
/**************************************************/
#head{z-index:4;}
#head .sectionBox:after{padding-top:5%;}
#head .hdFixed{background-color:#fff;z-index:2;}
#head .hdBox{position:relative;width:100%;max-width:1000px;margin:0 auto;}
#head .hdBox h1{position:relative;width:6.1%;margin:0 auto;margin-left:4.1%;padding:0.5% 0 0.3%;z-index:1;}

.hamburger-btn{display:block;position:absolute;top:0;right:2.9%;width:5%;padding:0;background-color:#fff;background-repeat:no-repeat;background-position:center;background-size:100% auto;}
.hamburger-btn:hover{opacity:0.8;}

body.ready #hamburger-open{padding-top:5%;background-image:url("../img/hamburger-open.png");z-index:2;}

body.ready #hamburger-close{padding-top:0;background-image:url("../img/hamburger-close.png");z-index:3;}

body.hamburger-opened #hamburger-open{padding-top:0;}
body.hamburger-opened #hamburger-close{padding-top:5%;}

/* メニュー */
/**************************************************/
#menu{z-index:10;}
#menu .hdFixed{margin-top:50px;background-color:#fff;z-index:2;}
#menu .hdBox{width:100%;max-width:1000px;margin:0 auto;height:0;overflow:hidden;}
#menu ul{position:relative;padding:12.7% 0 8.1%;}
#menu ul:after{content:'';display:block;clear:both;}
#menu ul li{margin:0 auto 3.9%;}
#menu ul li a{display:block;position:relative;}
#menu ul li:nth-child(1),
#menu ul li:nth-child(2),
#menu ul li:nth-child(3){float:left;margin-left:7.1%;margin-right:15%;}
#menu ul li:nth-child(1){width:29.5%;}
#menu ul li:nth-child(2){width:30%;}
#menu ul li:nth-child(3){width:37%;}
#menu ul li:nth-child(4),
#menu ul li:nth-child(5),
#menu ul li:nth-child(6){position:absolute;left:60.7%;}
#menu ul li:nth-child(4){top:0;width:13.5%;margin-top:12.7%;}
#menu ul li:nth-child(5){top:0;width:34.3%;margin-top:19%;}
#menu ul li:nth-child(6){bottom:0;width:24.4%;margin-bottom:12%;}

#menu ul li a:hover img{opacity:0.8;}
#menu ul li a:hover:before{opacity:0.8;}

body.ready #menu .hdBox{height:auto;}

/* メイン */
/**************************************************/
#main{}

.wrapper{position:relative;/*background-color:#fffdd4;*/z-index:2;}
.wrapper img{margin:0 auto;}
.wrapper h2,
.wrapper p{margin:0 auto;padding:0;}

.btn{margin:0 auto;padding:0;}
.btn a{display:block;position:relative;}
.btn a:before{content:'';display:block;font-size:20px;position:relative;padding:0;box-sizing:border-box;z-index:1;}
.btn a img{position:absolute;top:0;left:0;width:100%;margin:0 auto;z-index:2;}
.btn a:hover img{opacity:0.8;}

.layout{position:relative;margin:0 auto;padding:0;}
.layout:after{content:'';display:block;clear:both;}
.layout-box{margin:0 auto;padding:0;}

.dummy{position:relative;}
.dummy:before{content:'';display:block;position:relative;padding:100% 0 0;z-index:1;}
.dummy span{display:block;position:absolute;top:0;left:0;width:100%;z-index:2;}

/* KV */
/**************************************************/
#kv{}
#kv:before{content:'';display:block;position:absolute;top:0;left:-21.3%;width:142.1%;margin:6.4% auto 0;padding:89.4% 0 0;background:url("../img/kv-deco01.png") no-repeat center top;background-size:100% auto;z-index:1;}
.kv-layout h2,
.kv-layout p,
.kv-layout div{position:relative;z-index:2;}

#kv-title{position:relative;padding-top:0.7%;}
#kv-title:before{content:'';display:block;position:relative;padding:31.8% 0 0;z-index:1;}
#kv-title img{position:absolute;top:0;left:-6.6%;width:114.7%;margin-top:0.7%;z-index:2;}

#kv-text01{position:relative;width:27.7%;margin-right:3.7%;}
#kv-text01:before{content:'';display:block;position:relative;padding:7.2203% 0 0;z-index:1;}
#kv-text01 img{position:absolute;bottom:0;left:0;z-index:2;}

#kv-text02{position:relative;width:27.3%;float:left;margin-left:3.4%;}
#kv-text02:before{content:'';display:block;position:relative;padding:99.6337% 0 0;z-index:1;}
#kv-text02 img{position:absolute;bottom:0;left:0;z-index:2;}

#kv-text03{position:relative;width:29.2%;float:right;margin-right:2.3%;margin-top:2%;z-index:3;}
#kv-text03 img{position:relative;z-index:1;}
#kv-text03 a{position:absolute;bottom:0;left:15.0685%;width:69.8631%;margin-bottom:11.6439%;z-index:2;}

.kv-layout div.kv-img{width:32%;margin:0 auto;z-index:3;}

@keyframes swing {
  0%{transform:rotate(0deg);}
  25%{transform:rotate(5deg);}
  50%{transform:rotate(0deg);}
  75%{transform:rotate(-5deg);}
  100%{transform:rotate(0deg);}
}

#kv-img01{position:relative;}
#kv-img01:before{content:'';display:block;position:relative;padding:148.4375% 0 0;z-index:1;}
#kv-img01 img{position:absolute;bottom:0;left:-3.75%;width:108.75%;z-index:2;}
#kv-img01 span#dial{position:absolute;bottom:0;left:50%;width:16.5625%;margin:0 auto 40.625%;margin-left:-7.5%;z-index:3;}
#kv-img01 span#dial img{position:relative;top:auto;left:auto;width:100%;transform:rotate(0deg);transition:transform 0.3s ease;}
.hover #kv-img01 span#dial img{transform:rotate(180deg);}
.click #kv-img01{transform:rotate(0deg);animation:swing 0.5s 0s;}

#kv-text04{position:relative;}
#kv-text04:before{content:'';display:block;position:relative;padding:0;z-index:1;}
#kv-text04 img{position:absolute;bottom:0;left:-38.125%;width:70%;margin-bottom:2.1875%;z-index:2;}

#kv-btn01{margin-top:12.5%;}
#kv-btn01:before{content:'';display:block;position:absolute;top:0;left:0;width:0;padding:0;z-index:2;}
#kv-btn01 span{display:block;position:relative;cursor:pointer;z-index:1;}
#kv-btn01 span:before,
#kv-btn01 span:after{content:'';display:block;padding:0;}
#kv-btn01 span:before{position:relative;padding-top:22.8125%;z-index:1;}
#kv-btn01 span:after{position:absolute;top:0;left:0;width:101.5625%;padding-top:24.375%;}
#kv-btn01 span img{position:absolute;top:0;left:0;width:101.5625%;}
#kv-btn01 span:hover img{opacity:0.8;}
.click #kv-btn01:before{width:101.5625%;padding-top:24.375%;}

#kv-text05{padding-top:1.2%;clear:both;}
#kv-text05 img{width:48.8%;margin-left:25.4%;}

#kv:after{padding-top:6.1%;}

/* 応募の流れ */
/**************************************************/
#flow{}
#flow:before{content:'';display:block;position:absolute;top:0;left:-22.2%;width:149.7%;margin:4.8% auto 0;padding:199.1% 0 0;background:url("../img/flow-deco01.png") no-repeat center top;background-size:100% auto;z-index:1;}

.flow-layout{position:relative;z-index:2;}
.flow-layout:before{content:'';display:block;position:absolute;top:0;left:5%;bottom:0;width:91%;margin:0 auto -1.1%;background:url("../img/flow-bg.png") no-repeat center top;background-size:100% auto;z-index:1;}
.flow-layout h2,
.flow-layout p{position:relative;z-index:2;}

#flow-text01{position:relative;padding:4.2% 0 4%;}
#flow-text01 img{width:59.9%;margin-left:19.4%;}
#flow-text01:before{content:'';display:block;position:absolute;top:0;right:7.8%;width:12%;margin:2.3% auto 0;padding:11.2% 0 0;background:url("../img/flow-deco02.png") no-repeat center top;background-size:100% auto;z-index:1;}

#flow-text02{padding-bottom:6.3%;}
#flow-text02 img{width:66.8%;}

#flow-title{}
#flow-title img{width:43.2%;margin-left:28.1%;}

#flow-text03{position:relative;}
#flow-text03:before{content:'';display:block;position:relative;padding:45.3% 0 0;z-index:1;}
#flow-text03 img{position:absolute;bottom:0;left:4.6%;width:92.1%;margin-bottom:0;z-index:2;}

#flow-text04{padding:5.4% 0 4.8%;}
#flow-text04 img{width:80%;}

#flow-text05{padding-bottom:5.3%;}
#flow-text05 img{width:54.6%;margin-left:21.4%;}

#flow:after{padding-top:24%;}

/* プレゼント商品「100か月CO･OPボックスのご紹介」 */
/**************************************************/
#products{padding-top:3%;}
#products:before{content:'';display:block;position:absolute;top:0;left:-21.6%;width:142.2%;margin:21.8% auto 0;padding:109.6% 0 0;background:url("../img/products-deco01.png") no-repeat center top;background-size:100% auto;z-index:1;}

.products-layout{position:relative;z-index:2;}
.products-layout:before{content:'';display:block;position:absolute;top:0;left:5%;bottom:0;width:91%;margin:0 auto -1.1%;background:url("../img/products-bg.png") no-repeat center top;background-size:100% auto;z-index:1;}
.products-layout h2,
.products-layout p,
.products-layout div{position:relative;z-index:2;}

#products-title{padding:1.7% 0 0.7%;}
#products-title img{width:88.5%;margin-left:6%;}

#products-text01{padding-bottom:3.7%;}
#products-text01 img{width:54.7%;margin-left:25.4%;}

.products-img{padding-bottom:4.3%;}
.products-img:after{content:'';display:block;clear:both;}
.products-img p{float:left;}
.products-img p:after{content:'';display:block;position:absolute;top:0;right:0;bottom:0;width:1px;background-color:#000;}

#products-img01{position:relative;width:25.8%;margin-left:8.8%;padding-bottom:4.6%;}
#products-img01:before{content:'';display:block;position:relative;padding:167.0543% 0 0;z-index:1;}
#products-img01:after{right:-5.814%;}
#products-img01 img{position:absolute;bottom:0;left:0;width:100%;margin-bottom:17.8295%;z-index:2;}

#products-img02{width:24.1%;margin-left:4.1%;padding:2% 0 1.9%;}
#products-img02:after{right:-13.2781%;}

#products-img03{width:23.9%;margin-left:5.9%;padding:1.5% 0 3.1%;}
#products-img03:after{top:auto;right:-1.2553%;width:351.4645%;padding-top:1px;}

#products-img04{width:40.5%;margin-top:1%;margin-left:8.8%;padding:1.1% 0 1%;}
#products-img04:after{right:-4.1976%;}

#products-img05{width:38.2%;margin-top:1%;margin-left:4.5%;padding:2.2% 0 0;}
#products-img05:after{display:none;}

#products-text02{position:relative;}
#products-text02:before{content:'';display:block;position:relative;padding:0;z-index:1;}
#products-text02 img{position:absolute;top:0;left:25.4%;width:45.8%;margin-top:2.3%;z-index:2;}

#products:after{padding-top:24.4%;}

/* おすすめ商品 */
/**************************************************/
#recs{padding-top:3%;}
#recs:before{content:'';display:block;position:absolute;top:0;left:-20%;width:147.2%;margin:35.8% auto 0;padding:135.2% 0 0;background:url("../img/recs-deco01.png") no-repeat center top;background-size:100% auto;z-index:1;}

.recs-layout{position:relative;z-index:2;}
.recs-layout:before{content:'';display:block;position:absolute;top:0;left:5%;bottom:0;width:90%;margin:0 auto;background:url("../img/recs-bg.png") no-repeat center top;background-size:100% auto;z-index:1;}
.recs-layout h2,
.recs-layout p,
.recs-layout div{position:relative;z-index:2;}

#recs-title{position:relative;padding-bottom:3.5%;}
#recs-title:before{content:'';display:block;position:relative;padding:22.3% 0 0;z-index:1;}
#recs-title img{position:absolute;top:0;left:3.8%;width:82.5%;margin-top:-2.8%;z-index:2;}

#recs-btn01{width:29.3%;margin-left:35.4%;padding-bottom:12.2%;}
#recs-btn01 a:before{padding-top:6.1434%;}

#recs-text01{padding-bottom:4%;}
#recs-text01 img{width:75.7%;margin-left:12.2%;}

.recs-img{padding-bottom:3%;}
.recs-img:after{content:'';display:block;clear:both;}
.recs-img p{float:left;}
.recs-img p:after{content:'';display:block;position:absolute;top:0;right:0;bottom:0;width:1px;background-color:#000;}

#recs-img01{width:38.6%;margin-left:8.7%;}
#recs-img01:before{content:'';display:block;position:relative;padding:126.1659% 0 0;z-index:1;}
#recs-img01:after{right:-6.9949%;}
#recs-img01 img{position:absolute;bottom:0;left:0;width:100%;margin-bottom:13.4716%;z-index:2;}

#recs-img02{width:38.2%;margin-left:5.7%;padding-bottom:1.2%;}
#recs-img02:before{content:'';display:block;position:relative;padding:126.1781% 0 0;z-index:1;}
#recs-img02:after{top:auto;right:-1.0472%;width:215.4451%;padding-top:1px;}
#recs-img02 img{position:absolute;bottom:0;left:0;width:100%;margin-bottom:7.8535%;z-index:2;}

#recs-img03{width:38.1%;margin-top:1.2%;margin-left:8.7%;padding:1.4% 0 1.3%;}
#recs-img03:after{right:-8.399%;}

#recs-img04{width:38.5%;margin-top:1.2%;margin-left:5.9%;padding:1.4% 0 4.7%;}
#recs-img04:after{display:none;}

#recs-text02{position:relative;}
#recs-text02:before{content:'';display:block;position:relative;padding:0;z-index:1;}
#recs-text02 img{position:absolute;top:0;left:33.6%;width:32.8%;margin-top:1.4%;z-index:2;}

#recs:after{padding-top:21.6%;}

/* お応募方法 */
/**************************************************/
#app{padding-top:3%;}
#app:before{content:'';display:block;position:absolute;top:0;left:-21.4%;width:137.8%;margin:28.4% auto 0;padding:76% 0 0;background:url("../img/app-deco01.png") no-repeat center top;background-size:100% auto;z-index:1;}

.app-layout{position:relative;z-index:2;}
.app-layout:before{content:'';display:block;position:absolute;top:0;left:4%;bottom:0;width:91%;margin:0 auto -1.1%;background:url("../img/app-bg.png") no-repeat center top;background-size:100% auto;z-index:1;}
.app-layout h2,
.app-layout p,
.app-layout div{position:relative;z-index:2;}

#app-title{padding:5.1% 0 7.8%;}
#app-title img{width:40.2%;margin-left:28.5%;}

#app-text01{padding-bottom:6%;}
#app-text01 img{width:72.5%;margin-left:12.5%;}

#app-text02{padding-bottom:2.5%;}
#app-text02 img{width:54.6%;margin-left:22.2%;}

#app-text03{padding-bottom:10.2%;}
#app-text03 img{width:48.8%;margin-left:25.6%;}

#app-btn01{width:55%;padding-bottom:2.7%;}
#app-btn01:before,
#app-btn01:after{content:'';display:block;position:absolute;top:0;left:0;width:0;padding:0;background-repeat:no-repeat;background-position:center top;background-size:100% auto;}
#app-btn01:before{width:101.2728%;padding-top:17.2728%;background-image:url("../img/app-btn01.png");z-index:2;}
#app-btn01 a{z-index:1;}
#app-btn01 a:before{padding-top:16%;}
#app-btn01 a img{display:none;width:101.2728%;}
#app-btn01.active:before{width:0;padding-top:0;}
#app-btn01.active a img.pc{display:block;}
#app-btn01.active.disabled:after{width:101.2728%;padding-top:17.2728%;background-image:url("../img/app-btn01-disabled.png");z-index:3;}
#app-btn01.active.disabled a img{display:none;}

#app-text04{padding-bottom:5.3%;}
#app-text04 img{width:54.2%;margin-left:22.9%;}

#app-text05{position:relative;}
#app-text05:before{content:'';display:block;position:relative;padding:0;z-index:1;}
#app-text05 img{position:absolute;top:0;left:24.4%;width:51.1%;margin-top:4.1%;z-index:2;}

#app:after{padding-top:11.2%;}

/* SNSボタン */
/**************************************************/
#sns{position:relative;padding:12.8% 0 15%;}
#sns:before,
#sns:after{content:'';display:block;}
#sns:before{position:absolute;top:0;left:-15.1%;width:136%;margin:15.2% auto 0;padding:19% 0 0;background:url("../img/sns-deco01.png") no-repeat center top;background-size:100% auto;z-index:1;}
#sns:after{clear:both;}

#sns p.btn{width:3.8%;float:left;margin-left:7.3%;}
#sns p.btn:first-child{margin-left:31.5%;}
#sns p.btn a:before{padding-top:100%;}

/* 関連リンク */
/**************************************************/
#link{position:relative;padding-bottom:3.4%;}
#link:before,
#link:after{content:'';display:block;position:absolute;margin:0 auto;padding:0;background-repeat:no-repeat;background-position:center;background-size:100% auto;}

#link p.btn{width:36%;padding-bottom:4.2%;}
#link p.btn a:before{padding-top:14.7223%;}
#link p.btn a img{width:100.8334%;}

/* コピーライト */
/**************************************************/
#copyright{background-color:#fff;z-index:3;}
#copyright .sectionLayout{padding:2.2% 0;}
#copyright .sectionLayout p{color:#000;font-size:15px;line-height:2em;text-align:center;}

/* ポップアップ */
/**************************************************/
#popup{position:fixed;top:0;left:0;width:100%;height:0;overflow:hidden;z-index:5;}
.popup-table{position:absolute;top:0;left:0;width:100%;height:100%;display:table;}
.popup-td{display:table-cell;vertical-align:middle;}
.popup-layout{position:absolute;top:0;left:50%;bottom:0;width:64%;max-width:480px;margin:0 auto;margin-left:-240px;z-index:2;}
.popup-layout:before{content:'';display:block;padding-top:50%;position:relative;z-index:1;}
.popup-layout .perfectScroll{position:absolute;left:0;top:0;bottom:0;display:block;width:100%;overflow:hidden;z-index:3;}
.ps-scrollbar-y-rail{right:0!important;}

.popup-contents{display:none;background-color:#fffdd4;}
.popup-contents div{display:none;}
.popup-contents p{width:100%;margin:0 auto;}
.popup-contents p img{width:100%;height:auto;}

.popup-contents p.modal-img{position:relative;padding:2.0834% 0 7.5%;}
.popup-contents p.modal-img:before,
.popup-contents p.modal-img:after{content:'';display:block;padding:0;}
.popup-contents p.modal-img:before{position:relative;padding-top:137.0834%;z-index:1;}
.popup-contents p.modal-img:after{content:'';display:block;position:absolute;top:0;left:1.875%;width:97.0834%;margin:2.0834% auto 0;padding-top:137.0834%;background:url("../img/modal/modal-img.png") no-repeat center top;background-size:100% auto;z-index:2;}
.popup-contents p.modal-img img{position:absolute;top:0;left:3.9584%;width:92.0834%;margin:3.5417% auto 0;z-index:3;}

.popup-contents p.btn{width:62.0834%;}
.popup-contents p.btn a:before{padding-top:20.8054%;}
.popup-contents p.btn a img{width:101.3423%;}

.popup-contents p.modal-btn01{padding-bottom:1.6667%;}

.popup-contents p#modal-text01{padding-bottom:7.5%;}
.popup-contents p#modal-text01 img{width:65.4167%;margin-left:17.2917%;}

.popup-contents p#popup-close{padding-bottom:12.9167%;}

@keyframes popOut {
    0% { transform: scale(0) translateY(50px); opacity: 0; }
    50% { transform: scale(1.2) translateY(-20px); opacity: 1; }
    100% { transform: scale(1) translateY(0); opacity: 1; }
}
body.popup #popup-capsule{position:absolute;top:50%;left:50%;width:28.9584%;margin:0 auto;margin-left:-63px;animation:popOut 0.8s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;z-index:2;}

#popup-bg{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;background-color:#000;opacity:0.5;}

body.popup #popup{height:100%;}
body.popup{position:fixed;width:100%;overflow-y:scroll;}

/**************************************************/

@media print, screen and (max-width: 1000px) {

/* コピーライト */
/**************************************************/
#copyright .sectionLayout p{font-size:1.5vw;}

}

/**************************************************/

@media print, screen and (max-width: 750px) {

body:before,
body:after{display:none;}

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

/* ヘッダ */
/**************************************************/
#head .sectionBox:after{padding-top:13.3334%;}
#head .hdBox h1{width:14.8%;margin-left:4.1334%;padding:1.7334% 0 1.6%;}

.hamburger-btn{right:0.4%;width:13.3334%;}
.hamburger-btn:hover{opacity:1;}

body.ready #hamburger-open{padding-top:13.3334%;background-image:url("../img/sp/hamburger-open.png");z-index:2;}

body.ready #hamburger-close{background-image:url("../img/sp/hamburger-close.png");z-index:3;}

body.hamburger-opened #hamburger-close{padding-top:13.3334%;}

/* メニュー */
/**************************************************/
#menu .hdFixed{margin-top:13.3334%;}
#menu ul{padding:20.2667% 0 16.1334%;}
#menu ul li{margin-left:12.9334%;margin-right:auto;margin-bottom:9.8667%;}
#menu ul li:nth-child(1),
#menu ul li:nth-child(2),
#menu ul li:nth-child(3){margin-left:12.9334%;}
#menu ul li:nth-child(1){width:60.4%;}
#menu ul li:nth-child(2){width:60.9334%;}
#menu ul li:nth-child(3){width:75.6%;}
#menu ul li:nth-child(4),
#menu ul li:nth-child(5),
#menu ul li:nth-child(6){position:relative;left:auto;float:left;margin-left:12.9334%;}
#menu ul li:nth-child(4){top:auto;width:27.7334%;margin-top:0;}
#menu ul li:nth-child(5){top:auto;width:70.1334%;margin-top:0;}
#menu ul li:nth-child(6){bottom:auto;width:49.7334%;margin-bottom:0;}

#menu ul li a:hover img{opacity:1;}
#menu ul li a:hover:before{opacity:1;}

/* メイン */
/**************************************************/
#main{}
#main .sectionBox:before{width:100%;margin:0 auto;background:#ccc url("../img/sp/sp-template.png") no-repeat center top;background-size:100% auto;z-index:1;}
.btn a:before{font-size:2.6667vw;}

/* KV */
/**************************************************/
#kv{}
#kv:before{left:0;width:96.9334%;margin-top:90.6667%;padding-top:220.6667%;background-image:url("../img/sp/kv-deco01.png");}

#kv-title{padding-top:2.1334%;}
#kv-title:before{padding-top:46.8%;}
#kv-title img{left:0;width:100%;margin-top:2.1334%;}

#kv-text01{width:33.7334%;margin-right:auto;margin-left:10%;}
#kv-text01:before{padding-top:72.3321%;}

#kv-text02{width:43.7334%;float:right;margin-right:0.8%;margin-left:0;}
#kv-text02:before{padding-top:62.8049%;}

#kv-text03{position:absolute;bottom:0;left:2.9334%;width:93.4667%;float:none;margin-right:0;margin-top:0;margin-bottom:21.6%;}
#kv-text03 a{left:16.6905%;width:66.3339%;margin-bottom:8.9872%;}

.kv-layout div.kv-img{width:60.2667%;}

#kv-img01:before{padding-top:170.7965%;}
#kv-img01 img{left:-5.3098%;width:112.3894%;}
#kv-img01 span#dial{width:16.593%;margin-left:-7.3009%;margin-bottom:42.2567%;}

#kv-text04 img{left:-30.531%;width:65.9293%;margin-bottom:4.8673%;}

#kv-btn01{margin-top:12.1682%;}
#kv-btn01 span:before{padding-top:22.7877%;}
#kv-btn01 span:after{width:101.5487%;padding-top:24.3363%;}
#kv-btn01 span img{width:101.5487%;}
#kv-btn01 span:hover img{opacity:1;}

#kv-text05{padding:3.2% 0 82.1334%;}
#kv-text05 img{width:75.201%;margin-left:12%;}

#kv:after{padding-top:21.6%;}

/* 応募の流れ */
/**************************************************/
#flow{}
#flow:before{left:0;width:100%;margin-top:37.6%;padding-top:260%;background-image:url("../img/sp/flow-deco01.png");}

.flow-layout:before{left:7.3334%;width:86.6667%;margin-bottom:-1.3334%;background-image:url("../img/sp/flow-bg.png");}

#flow-text01{padding:6.5334% 0 5.7334%;}
#flow-text01 img{width:77.0667%;margin-left:11.3334%;}
#flow-text01:before{right:10.4%;width:17.7334%;margin-top:-5.7334%;padding-top:16.8%;background-image:url("../img/sp/flow-deco02.png");}

#flow-text02{padding-bottom:7.8667%;}
#flow-text02 img{width:74.9334%;}

#flow-title img{width:57.6%;margin-left:21.0667%;}

#flow-text03:before{padding-top:84.9334%;}
#flow-text03 img{left:8.6667%;width:82.1334%;margin-bottom:0;}

#flow-text04{padding:3.0667% 0 5.3334%;}
#flow-text04 img{width:77.3334%;}

#flow-text05{padding-bottom:4.8%;}
#flow-text05 img{width:76.6667%;margin-left:12%;}

#flow:after{padding-top:12.8%;}

/* プレゼント商品「100か月CO･OPボックスのご紹介」 */
/**************************************************/
#products{padding-top:7.2%;}
#products:before{left:auto;right:0;width:96.4%;margin-top:59.4667%;padding-top:228.6667%;background-image:url("../img/sp/products-deco01.png");}

.products-layout:before{left:7.3334%;width:86.6667%;margin-bottom:-1.3334%;background-image:url("../img/sp/products-bg.png");}

#products-title{padding:4.8% 0 4.5334%;}
#products-title img{width:88%;margin-left:6.2667%;}

#products-text01{padding-bottom:7.4667%;}
#products-text01 img{width:71.0667%;margin-left:14.2667%;}

.products-img{padding-bottom:0%;}

#products-img01{width:38.2667%;margin-left:9.8667%;padding-bottom:0.4%;}
#products-img01:before{padding-top:193.3798%;}
#products-img01:after{right:-4.8781%;}
#products-img01 img{margin-bottom:6.9669%;}

#products-img02{width:35.0667%;margin-left:5.2%;padding:0.2667% 0 3.8667%;}
#products-img02:after{top:auto;right:-0.7605%;width:220.5324%;padding-top:1px;}

#products-img03{width:36.6667%;margin-top:1.0667%;margin-left:10.5334%;padding:3.2% 0 7.4667%;}
#products-img03:after{top:0;right:-7.6364%;width:1px;padding-top:0;}

#products-img04{width:35.0667%;margin-top:1.0667%;margin-left:6.2667%;padding:2.8% 0 4.5334%;}
#products-img04:after{top:auto;right:-0.7605%;width:220.5324%;padding-top:1px;}

#products-img05{width:77.8667%;margin-top:1.0667%;margin-left:11.0667%;padding:3.4667% 0 2.8%;}

#products-text02 img{left:12.9334%;width:76.1334%;margin-top:5.2%;}

#products:after{padding-top:22.5334%;}

/* おすすめ商品 */
/**************************************************/
#recs{padding-top:7.2%;}
#recs:before{left:0;width:100%;margin-top:24.8%;padding-top:324.6667%;background-image:url("../img/sp/recs-deco01.png");}

.recs-layout:before{left:7.3334%;width:85.3334%;background-image:url("../img/sp/recs-bg.png");}

#recs-title{padding-bottom:6.4%;}
#recs-title:before{padding-top:46.4%;}
#recs-title img{left:2.8%;width:79.3334%;margin-top:-7.2%;}

#recs-btn01{width:62.1334%;margin-left:19.0667%;padding-bottom:16.9334%;}
#recs-btn01 a:before{padding-top:6.2232%;}

#recs-text01{padding-bottom:6.9334%;}
#recs-text01 img{width:56.4%;margin-left:21.8667%;}

.recs-img{padding-bottom:6.9334%;}
.recs-img p{float:none;}

#recs-img01{width:77.3334%;margin-left:11.3334%;}
#recs-img01:before{padding-top:62.5863%;}
#recs-img01:after{top:auto;right:0;width:100%;margin-bottom:-4.6552%;padding-top:1px;}
#recs-img01 img{left:-0.5173%;width:111.5518%;margin-bottom:0;}

#recs-img02{width:77.3334%;margin-top:6.2667%;margin-left:11.3334%;padding-bottom:0;}
#recs-img02:before{padding-top:63.6207%;}
#recs-img02:after{right:0;width:100%;margin-bottom:-6.2069%;}
#recs-img02 img{left:-0.5173%;width:113.2759%;margin-bottom:0.1725%;}

#recs-img03{width:77.3334%;margin-top:8.6667%;margin-left:11.3334%;padding:0;}
#recs-img03:before{content:'';display:block;position:relative;padding:64.4828% 0 0;z-index:1;}
#recs-img03:after{top:auto;right:0;width:100%;margin-bottom:-4.6552%;padding-top:1px;}
#recs-img03 img{position:absolute;bottom:0;left:-1.0345%;width:99.4828%;z-index:2;}

#recs-img04{width:77.3334%;margin-top:6.8%;margin-left:11.3334%;padding:0;}
#recs-img04:before{content:'';display:block;position:relative;padding:72.5863% 0 0;z-index:1;}
#recs-img04 img{position:absolute;bottom:0;left:-0.6897%;width:97.7587%;z-index:2;}

#recs-text02 img{left:22.6667%;width:54.6667%;margin-top:1.2%;}

#recs:after{padding-top:12.8%;}

/* お応募方法 */
/**************************************************/
#app{padding-top:7.2%;}
#app:before{left:0;width:99.6%;margin-top:7.3334%;padding-top:66.2667%;background-image:url("../img/sp/app-deco01.png");}

.app-layout:before{left:7.3334%;width:86.6667%;margin-bottom:-1.3334%;background-image:url("../img/sp/app-bg.png");}

#app-title{padding:7.4667% 0 7.7334%;}
#app-title img{width:53.6%;margin-left:23.2%;}

#app-text01{padding-bottom:10.5334%;}
#app-text01 img{width:76.2667%;margin-left:11.8667%;}

#app-text02{padding-bottom:2.9334%;}
#app-text02 img{width:76.6667%;margin-left:12%;}

#app-text03{padding-bottom:9.8667%;}
#app-text03 img{width:75.201%;margin-left:12%;}

#app-btn01{width:73.3334%;padding-bottom:3.0667%;}
#app-btn01:before{padding-top:20%;background-image:url("../img/sp/app-btn01.png");}
#app-btn01 a:before{padding-top:18.7273%;}
#app-btn01 a img{display:none!important;}
#app-btn01.active a img{display:block!important;}
#app-btn01.active a img.pc{display:none!important;}
#app-btn01.active.disabled:after{padding-top:20%;background-image:url("../img/sp/app-btn01-disabled.png");}
#app-btn01.active.disabled a img{display:none!important;}

#app-text04{padding-bottom:5.0667%;}
#app-text04 img{width:72.9334%;margin-left:13.6%;}

#app-text05 img{left:8.4%;width:83.2%;margin-top:5.2%;}

#app:after{padding-top:16.6667%;}

/* SNSボタン */
/**************************************************/
#sns{padding:20% 0 23.2%;}
#sns:before{left:0;width:0;margin-top:0;padding-top:0;}

#sns p.btn{width:8%;margin-left:12.8%;}
#sns p.btn:first-child{margin-left:14.8%;}

/* 関連リンク */
/**************************************************/
#link{padding-bottom:10.6667%;}
#link:after{bottom:0;right:0;width:0;margin-bottom:0;padding-top:0;}

#link p.btn{width:60%;padding-bottom:7.0667%;}
#link p.btn a:before{padding-top:19.5556%;}
#link p.btn a img{width:100.8889%;}
.btn a:hover img{opacity:1;}

/* コピーライト */
/**************************************************/
#copyright .sectionLayout{padding:2.2667% 0;}
#copyright .sectionLayout p{font-size:2.6667vw;}

/* ポップアップ */
/**************************************************/
.popup-layout{left:0;width:100%;max-width:750px;margin-left:0;}

.popup-contents p.modal-img{padding:2.2667% 0 7.7334%;}
.popup-contents p.modal-img:before{padding-top:136.6667%;}
.popup-contents p.modal-img:after{left:2%;width:96.6667%;margin-top:2.2667%;padding-top:136.6667%;background-image:url("../img/sp/modal/modal-img.png");}
.popup-contents p.modal-img img{left:4%;width:92%;margin-top:3.6%;}

.popup-contents p.btn{width:62.1334%;}
.popup-contents p.btn a:before{padding-top:21.0301%;}
.popup-contents p.btn a img{width:101.2876%;}

.popup-contents p.modal-btn01{padding-bottom:1.6%;}

.popup-contents p#modal-text01{padding-bottom:4.5334%;}
.popup-contents p#modal-text01 img{width:61.8667%;margin-left:19.0667%;}

.popup-contents p#popup-close{padding-bottom:25.6%;}

body.popup #popup-capsule{width:18.5334%;margin-left:-17.0667%;}

}

/**************************************************/