。@charset "UTF-8";
/* 343 秋の大感謝祭　*/
.bg343{}	
.mv343{margin: auto;position: relative;}
.conbg343{background: linear-gradient(to top, #fc7e6f, 50%, #f08b63);}

.camp343 {
    background: #fff;
	  position: relative;margin-bottom: 100px;}

    .camp343:before {
      display: block;
      content: '';
      width: 100%;
      height: 100%;
      background: linear-gradient(to top, #f56686, 50%, #f8717d);
      position: absolute;
      top: 20px;
      left: 20px;
      z-index: 1;
    }

    .camp343_in {
      /*padding: 50px 50px 30px;*/
      position: relative;
      z-index: 2;
      background: #e2f1f3;
background: url("../../../../../images/pages/f-static/campaign/343/343_con_bg.png") center center no-repeat;background-size: cover; 		
    }

.adj343{}
.adj343:before {top: 10px !important;left: 10px !important;}


.camp343 .ttl_box{background: linear-gradient(to left, #da4e6e, 50%, #f08b63);padding: 10px 20px;font-weight: bold;color: #ffffff;font-size: 20px;margin-bottom: 25px;letter-spacing: 0.15em;}
.camp343 .shadow{text-shadow: 2px 2px #663333;}
.camp343 .att{padding: 0px 50px 50px 50px;margin: auto;}
.camp343 .another{background-color: #ffffff;border-radius: 5px; padding: 10px 20px;}
.camp343 .icon{ width: 75px; position: absolute;
    top: -20px !important;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);}

.camp343 .camp02_ttl {}
.camp343 .lottery {position: absolute;top: -40px;left: -15px;width: 80px;}
.camp343 .apply{background-color: #ffffff;border-radius: 5px; padding: 50px 50px;}
.camp343 .apply dl{display: flex;}
.camp343 .apply dd{background-color: #663333;color: #ffffff;padding: 5px 15px;font-weight: bold;}
.camp343 .apply dt{padding: 5px 15px;color: #663333;font-weight: bold;}

.camp343 .pre_wapper{padding-bottom: 100px;margin: auto;width: 90%;}
.camp343 .pre_wapper h3{color: #663333;border-radius: 3px; background-color: #ffffff; padding: 5px 15px;text-align: center;margin-bottom: 40px; letter-spacing: 0.1em;}
.camp343 .pre {display: flex;}
.camp343 .pre_in {width: 100%;position: relative;margin-right: 40px;}
.camp343 .pre_in img {width: 100%;}
.camp343 .pre_in:nth-child(3n) {margin-right: 0px !important;}
.camp343 .pre_in .icon_onl{position: absolute;background: linear-gradient(to left, #da4e6e, 50%, #f08b63);padding: 5px 10px;color: #ffffff;font-weight: bold;font-size: 14px;}
.camp343 .pre_in .icon_order{position: absolute;background-color: #663333;;padding: 5px 10px;color: #ffffff;font-weight: bold;font-size: 14px;}


.f_brown{color: #663333;font-weight: bold;margin-bottom: 10px;letter-spacing: 0.1em;}
.f_pink{display: inline-block;
  background: linear-gradient(to top, #d10012, 20%, #f8717d);
  background: -webkit-linear-gradient(to top, #d10012, 20%, #f8717d);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;font-weight: bolder !important;letter-spacing: 0.1em;}
.f_border{border: 1px solid #f56686;font-size: 14px;padding: 2px 10px;}
.f_purple{color: #7f4891;font-size: 22px; margin-bottom: 10px; margin-bottom: 15px;}
.f_yellow{color: #f7ffbf;}
.f_blue{color: #2e9280;}

.box_red{border: 1px solid #eb5566;padding: 5px 10px;}
.bg_f{background-color: #ffffff;}

.adj_mr{margin-right: 2%;}
.adj_ml{margin-left: 2%;}
.adj_att{}
.adj_cnt{}

/* ここにSP向けのCSS指定 */
@media (max-width: 768px) {
.bg343{display: block;background: url("../../../../../images/pages/f-static/campaign/343/343_hdr_bgs.png") center center no-repeat;z-index: 0;background-size: cover; align-items: center;padding-bottom: 50px;}	
.mv343 {padding: 10px;}	
.mv343 h1 img{width: 100%;margin: 50px 0 20px 0;}
.mv343 h2 img{width: 95%;}	
	
.camp343 .campaign-wrap__txt{padding:0 15px !important;}
.camp343 .att{padding: 30px 15px 50px 15px;}	

.camp343 .camp02_ttl {width: 100%; margin: auto; padding-top: 80px;text-align: center;}	
	
.camp343 .g_wapper{display: block;}
.camp343 .g_box{padding: 15px 20px;font-size: 15px;background-color: #ffffff;}
.camp343 .g_ttl{background-color: #663333;color: #ffffff;font-weight: bold;text-align: center;line-height: 1.2em;padding: 15px;font-size: 18px;letter-spacing: 0.15em;
	grid-row-start: 2;grid-row-end: auto;grid-column-start: 1;grid-column-end: 4;}	

.camp343 .con02_in{padding: 0 15px;}	
	
.camp343 {
    background: #fff;
	  position: relative;margin-bottom: 100px;}

    .camp343:before {
      top: 10px;
      left: 10px;
    }	
	
.adj_mr{margin-right: 0;}
.adj_ml{margin-left: 0;}
.adj343{margin-bottom: 80px;}	
.adj343:before {top: 5px !important;left: 5px !important;}	
	
.camp343 .apply{padding: 15px;}
.camp343 .apply dl{display:block;}	
.camp343 .apply dt{padding: 5px 10px;}	
	
.camp343 .lottery {left: -8px;}	
.camp343 .ttl_box{text-align: center;}
.adj_cnt{text-align: center;}
	
.f12px{font-size: 11px !important;}	
	
.camp343 .pre_wapper{padding-bottom: 50px;margin: auto;width: 90%;}
.camp343 .pre {display: block;}	
	.camp343 .pre_in{margin-bottom: 30px;}	
	
}

/* ここにPC向けのCSS指定 */
@media (min-width: 768px) {
.bg343{background: url("../../../../../images/pages/f-static/campaign/343/343_hdr_bg.jpg") center center no-repeat;z-index: 0;background-size: cover; align-items: center;height: 900px;min-height:800px;}
.mv343{width: 1300px;}
.mv343 h1,.mv343 h2{margin: 0; padding: 0;}
.mv343 h1 img{width: 480px;position: absolute;top: 80px;left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);}
.mv343 .h2_camp01{position: absolute;top: 320px;left: 170px;}
.mv343 .h2_camp01 img,.mv343 .h2_camp02 img{width: 480px;}
.mv343 .h2_camp02{position: absolute;top: 320px;left: 690px;}	

.camp343 .campaign-wrap__img	{width: 680px;}
.camp343 .campaign-wrap__txt {padding: 40px 40px 50px 0;}
	
.camp343 .camp02_ttl {width: 50%; margin: auto; text-align: center;padding-top: 80px;}
.camp343 ul{display: flex;padding: 0 75px;}
.camp343 ul>li{display: flex;align-items:stretch;}	
.camp343 li{ width:calc(100%/2);flex-direction:column;margin-right: 50px;　}
.camp343 li:nth-child(2n) {margin-right: 0px !important;}
.camp343 img{width: 100%; height: auto;}	

.camp343 .g_wapper{display: grid;
	grid-template-columns: 235px 1fr;
	grid-template-rows: 260px 1fr;}
.camp343 .g_box{padding: 15px 20px;font-size: 15px;background-color: #ffffff;}
.camp343 .g_ttl{background-color: #663333;color: #ffffff;font-weight: bold;text-align: center;line-height: 1.2em;padding: 15px;font-size: 18px;letter-spacing: 0.15em;
	grid-row-start: 2;grid-row-end: auto;grid-column-start: 1;grid-column-end: 4;}	

.adj_att{width: 95%;margin: auto;}	
	
	
/* バナーエリア */
.bnr__link a{
 transition: 1.0;	
}
.bnr__link a:hover {
  opacity:0.8;
  transition: 0.8;	
}
.bnr__link a:hover img {
  transform: scale(1.02); /* 拡大 */
transition: transform .6s ease;	/* ゆっくり */
}	
	
}

.bnr__link a{
}
.bnr__link a:hover {
}

/*サイズ・位置調節*/

.ls-01{letter-spacing: 0.1em;}
.f60px{font-size: 60px;}

.ctrt{ text-align: center; }
.ctrm{ margin: auto;}
.ctr{text-align: center!important;}
.w80{width: 80%;}
.w90{width: 90%;}
.w100{width: 100%;}

.yline{/*background:linear-gradient(transparent 90%, #f3ff8f 90%);*/color: #f3ff8f;font-size: 24px;}
.wline{background:linear-gradient(transparent 60%, #ffffff 60%);}

.mt180{margin-top: 180px;}
.w100{width: 100% !important;}
.w90{width: 90% !important;}

/* 買い物ボタン */
.btn_style {
  width: 300px;
  height: 45px;
  background: #444;
  letter-spacing: 0.15em;
  border: 1px solid #444;
  box-sizing: border-box;
  transition: all .3s 0s ease-in-out;
  text-align: center;
  font-size: 15px; }

.btn_style.mini {
  width: 100%;
  height: 45px; }

.btn_style.mini > a,
.btn_style.mini > span {
  font-size: 15px; }

.btn_style.mini > a span,
.btn_style.mini > span span {
  padding-left: 35px; }

.btn_style.off {
  background: #ccc;
  border: 1px solid #ccc; }

.btn_style:not(.btn_style.off):hover {
  background: #fff; }

.btn_style:not(.btn_style.off):hover > a,
.btn_style:not(.btn_style.off):hover > span {
  color: #444; }

.btn_style > a,
.btn_style > span {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  width: 100%;
  height: 100%;
  color: #fff;
  font-weight: bold;
  font-size: 17px; }

.btn_style > a span,
.btn_style > span span {
  position: relative;
  padding-left: 40px;
  text-align: center; }

.btn_style > a span:before,
.btn_style > span span:before {
  display: block;
  content: '';
  width: 23px;
  height: 17px;
  background: url("/assets/images/pages/f-static/campaign/icon_cart.png") left top no-repeat;
  background-size: 23px 17px;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translate3d(0, -50%, 0); }

.btn_style:not(.btn_style.off):hover > a span:before,
.btn_style:not(.btn_style.off):hover > span span:before {
  background: url("/assets/images/pages/f-static/campaign/icon_cart_b.png") left top no-repeat;
  background-size: 23px 17px; }




/* 買い物かご */

.specbox {
	margin: auto;
  width: 100%;
  margin-left: 0px;
  position: relative; background-color: #f6f6f6;padding: 10px 25px 30px 25px;}
  .specbox .name {
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0.11em;
    margin-bottom: 0px;
    margin-top: 0px;
    line-height: 1.5;
    text-align: center; }
  .specbox .spec {
    font-size: 12px;
    letter-spacing: 0.11em;
    font-weight: 500; }

  .specbox .limit {
    font-size: 14px;
    letter-spacing: 0.1em;
    border: solid 1px #ff3366;/**/
    padding: 2px 7px;
    color: #ff3366; 
background-color: #ffffff;
}

  .specbox .limit_red {
    font-size: 14px;
    letter-spacing: 0.1em;
	  background-color: #cb2e60;
    border: solid 1px #cb2e60;/**/	  
    padding: 2px 7px;
    color: #ffffff; 
/*background-color: #b6929c;*/
}

  .specbox .price {
    font-size: 23px;
    font-weight: 700;
    margin-top: 10px;
    text-align: center; }
  .specbox .psmall {
    font-size: 15px;
    font-weight: 500;
    letter-spacing: 0.1em; }




/* ここにPC向けのCSS指定 */
@media (min-width: 768px) {	

	
/* 買い物かご */
	
  .specbox {
    width: 100%;
    margin-left: 0px;
    position: relative; }
    .specbox .name {
      font-size: 18px;
      font-weight: 600;
      letter-spacing: 0.10em;
      margin-bottom: 5px;
      margin-top: 5px;
      text-align: left; }
    .specbox .spec {
      font-size: 13px;
      letter-spacing: 0.13em; }
	
    /*.specbox .limit {
      font-size: 15px;
      letter-spacing: 0.13em;
      border: solid 1px #48bec5;
      padding: 2px 5px;
      color: #ffffff; }*/
	
    .specbox .price {
      font-size: 25px;
      font-weight: 700;
      letter-spacing: 0.1em;
      margin-top: 0px;
      text-align: left;
      　margin-bottom: 20px;
      /*margin-left: 140px;*/ }
    .specbox .psmall {
      font-size: 15px;
      font-weight: 500;
      letter-spacing: 0.1em; }	

  .btn_wrap {
    position: absolute;
    width: 290px;
    right: 35px;
    bottom: 25px;
    box-sizing: border-box; }	
.sponly{
	display:none!important;
}
	}




/* ここにSP向けのCSS指定 */
@media (max-width: 768px) {
.specbox {padding-top: 25px !important;}	
  .specbox .name {
    line-height: 1.3 !important;
 }
  .specbox .spec {
    font-size: 12px;
    letter-spacing: 0em;
    font-weight: 500; }	
  .specbox .psmall {
    font-size: 13px !important;
    font-weight: 500;
    letter-spacing: 0.1em; }
	
.specbox .price_off{line-height: 1.7em;}
	
.specbox {
  width: 100%;}	
	
  .btn_wrap {
    margin-top: 10px;
    width: 90%;
    margin-left: 5%; }	
	
	
 /* 買い物ボタン */
	
  .btn_style {
    height: 13vw;
    width: 100%; }
    .btn_style .mini {
      height: 12vw; }
      .btn_style .mini > a, .btn_style .mini > span {
        font-size: 0.9rem; }
      .btn_style .mini > a span, .btn_style .mini > span span {
        padding-left: 40px; }
    .btn_style > a, .btn_style > span {
      font-size: 0.9rem; }
    .btn_style > a span, .btn_style > span span {
      padding-left: 32px; }
    .btn_style > a span:before, .btn_style > span span:before {
      width: 20px;
      height: 15px;
      background: url("/assets/images/pages/f-static/campaign/icon_cart.png") left top no-repeat;
      background-size: 20px 15px; }

  .btn_style:not(.btn_style.off):hover > a span:before,
  .btn_style:not(.btn_style.off):hover > span span:before {
    background: url("/assets/images/pages/f-static/campaign/icon_cart_b.png") left top no-repeat;
    background-size: 20px 15px; }	
.pconly{
	display:none !important;
}	
	}
