@charset "UTF-8";

.clrF::after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}

/*------------------------------
 PC
------------------------------*/
@media screen and (min-width: 769px) {
/*content820pxReset*/
#main{
width:820px;
}
.contents_bg{
max-width: 1120px;
margin: 0 auto;
}
body.min{
min-width: 1120px;
}
/*carrybagWrap****************************************************/
.carrybagWrap{
width:100%;
max-width:820px;
margin: 0 auto;
}
.carrybagWrap img{
vertical-align:top;
}
.carrybagWrap a{
display: block;
}
.ichioshiBlock{
  margin-block-start: 60px;
}
.block-separat {
  padding-bottom: 0;
  border: none;
}
/*nav01******************************************************/
.nav01 {
  margin-block-start: 20px;

  .navList {
    display: grid;
    grid-template-columns: 1fr repeat(2, 0.5fr) 1fr;
  }
  .navListItem:nth-child(1) {
    /* grid-area: 1 / 1 / 2 / 2; */
  }
  .navListItem:nth-child(2) {
    grid-area: 1 / 2 / 2 / 4;
  }
  .navListItem:nth-child(3) {
    /* grid-area: 1 / 4 / 2 / 5; */
  }
  .navListItem:nth-child(4) {
    grid-area: 2 / 1 / 3 / 3;
  }
  .navListItem:nth-child(5) {
    grid-area: 2 / 3 / 3 / 5;
  }
}
/*nav02******************************************************/
.nav02 {

  .navList {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-column-gap: 12px;
  }
  .navListItem {
  }
}
/*nav03******************************************************/
.nav03 {
  inline-size: 780px;
  margin-inline: auto;

  .navList {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 20px;
  }
  .navListItem {
  }
}

/*bannerWrap******************************************************/
.bannerWrap {
  margin-block-start: 40px;
}
.bannerTitle img {
  text-align: center;
}
.bannerText {
  margin-block-start: 20px;
  font-size: 16px;
}
.bannerList {
  margin-top: 40px;
  margin-inline: auto;
  display: flex;
  flex-wrap: wrap;
}
.justify-content-center .bannerList {
  justify-content: center !important;
}
.bannerWrap .bannerItem img {
  width: 100%;
}
/* 286バナー 3カラム */
.col3-286_286 .bannerList {
  width: 820px;
  --gap: 40px;
  gap: var(--gap);
}
.col3-286_286 .bannerItem {
  width: calc((100% / 3) - var(--gap) * 2 / 3);
}
/* 286バナー 4カラム */
.col4-286_286 .bannerList {
  width: 750px;
  --gap: 20px;
  gap: var(--gap);
}
.col4-286_286 .bannerItem {
  width: calc(25% - var(--gap) * 3 / 4);
}

.carrybagWrap .headingBlockA01{
margin: 0 0 40px;
}
.carrybagWrap .headingBlockA02{
margin: 80px 0 20px;
}
.carrybagWrap .headingBlockA03{
margin: 0 0 50px;
}
.carrybagWrap .headingBlockA04{
margin: 0 0 41px;
}
.carrybagWrap .column3BlockA01{
margin: 0 0 80px;
}
.carrybagWrap .column3BlockA01 a:link,
.carrybagWrap .column3BlockA01 a:hover{
text-decoration: none;
color: #050505;
}
.carrybagWrap .column3BlockA01 span{
display: block;
}
.carrybagWrap .column3BlockA01 .columnA01{
position: relative;
float: left;
width: 260px;
color: #050505;
}
.carrybagWrap .column3BlockA01 .columnA01:nth-child(3n-1){
margin: 0 20px;
}
.carrybagWrap .column3BlockA01 .columnA01 .icon{
position: absolute;
top: 1px;
left: 1px;
}
.carrybagWrap .column3BlockA01 .columnA01 .img{
margin: 0 0 16px;
border: 1px solid #e6e6e6;
}
.carrybagWrap .column3BlockA01 .columnA01 .name{
margin: 0 0 12px;
font-size: 16px;
font-weight: bold;
line-height: 1.5;
}
.carrybagWrap .column3BlockA01 .columnA01 .txt{
margin: 0 0 9px;
font-size: 14px;
line-height: 1.71;
}
.carrybagWrap .column3BlockA01 .columnA01 .price{
margin: 0 0 28px;
text-align: right;
font-size: 18px;
font-weight: bold;
}
.carrybagWrap .column3BlockA01 .columnA01 .btn{
text-align: center;
}
.carrybagWrap .typeBlockA01{
margin: 35px 0 79px;
}
.carrybagWrap .typeBlockA01 .naviBlockB01 .naviBlockB01Inner{
width: 780px;
margin: 0 auto;
}
.carrybagWrap .typeBlockA01 .naviBlockB01 ul li{
float: left;
width: 380px;
margin: 0 0 20px;
}
.carrybagWrap .typeBlockA01 .naviBlockB01 ul li:nth-child(2n){
float: right;
}
.carrybagWrap .typeBlockA01 .naviBlockB01 ul li:nth-last-child(-n+2){
margin: 0;
}
.carrybagWrap .typeBlockA01 .naviBlockB01 ul li a:hover{
text-decoration: none;
}
.carrybagWrap .typeBlockA01 .naviBlockB01 ul li a:after{
position:absolute;
content:"";
display:block;
top: 50%;
right:25px;
width:12px;
height:12px;
border-right:1px solid #FFF;
border-bottom:1px solid #FFF;
transform: translate(0, -50%) rotate(-45deg);
}

.carrybagWrap .bnrBlockA01{
margin: 0 0 59px;
}
.carrybagWrap .bnrBlockA01 ul{
width: 780px;
margin: 0 auto;
}
.carrybagWrap .bnrBlockA01 ul li{
float: left;
width: 170px;
margin: 0 33px 20px 0;
}
.carrybagWrap .bnrBlockA01 ul li:nth-child(4n-1){
margin-right: 34px;
}
.carrybagWrap .bnrBlockA01 ul li:nth-child(4n){
margin: 0;
}
.carrybagWrap .bnrBlockA02 ul{
width: 750px;
margin: 0 auto;
}
.carrybagWrap .bnrBlockA02 ul li{
margin: 0 0 20px;
}
.carrybagWrap .bnrBlockA02 ul li:last-child{
margin: 0;
}
/*couponBlock 201105追加分*****************************************************/
.carrybagWrap .couponBlock{
  background: url(../image/carrybag_bg_001_201105.jpg) no-repeat top center;
  background-size: 100%;
}
.carrybagWrap .couponBlockInner{
  width: 760px;
  margin: 0 auto;
  padding: 30px 0 29px;
}
.carrybagWrap .couponBlock .columnBlockA01{
  float: left;
  width: 389px;
}
.carrybagWrap .couponBlock .columnBlockA02{
  float: right;
  width: 329px;
}

/** 全品対象 **/
.carrybagWrap .couponBlock .couponBtnA01{
  margin: 34px 0 0;
}

/** 対象商品有り **/
/**.carrybagWrap .couponBlock .couponBtnA01{
  margin: 14px 0 0;
}
.carrybagWrap .couponBlock .couponBtnA02{
  margin: 12px 0 0;
}**/

.carrybagWrap .cautiontxtBlock01{
  text-indent: 8px;
  font-size: 14px;
  line-height: 1.43;
  font-weight: bold;
  color: #3e3e3e;
  margin: 6px 0 60px;
}
.carrybagWrap .couponLinkA01 a{
  display: inline;
  color: #0b318f;
  text-decoration: underline;
}

/* couponBlockA02 ******************************************************/
.carrybagWrap .couponBlockA03 {
margin: 20px 0 20px 0;
}
.carrybagWrap .couponImgA03 {
margin: 0 0 16px;
}
.carrybagWrap .cautionBlockA03 .cautionLeft03 {
float: left;
width: 63px;
height: 31px;
background-color: #ccc;
}
.carrybagWrap .cautionBlockA03 .cautionLeft03 .cautionTtl03 {
text-align: center;
font-size: 12px;
font-weight: bold;
line-height: 31px;
}
.carrybagWrap .cautionBlockA03 .cautionRight03 {
float: right;
width: 744px;
}
.carrybagWrap .cautionBlockA03 .cautionRight03 .linkTxt03 {
color: #1b3f96;
text-decoration: underline;
}
.carrybagWrap {
  max-width: 100%;
}
.carrybagWrap img,
.ichioshiBlock h2 img {
  width: 100%;
  height: auto;
}
.mvBlockA01Inner h1 {
  margin: 0;
}
.carrybagWrap .naviBlockA02 ul li {
  width: calc(25% - 9px);
}
.ichioshiBlock h2 {
  margin: 0 auto 40px;
}
.block-top-event--goods {
  margin: 0 auto 60px;
}
.btn-none + .block-separat {
  display: none;
}
.sp-only {
  display: none;
}

/* 251016up ******************************************************/
.bannerWrap.column2 {
  width: 612px;
  margin: 40px auto 60px;
}
.bannerWrap.column2 .bannerList {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
}
.bannerWrap.column2 .bannerItem {
  width: 286px;
}
.bannerWrap.column2 .bannerItem:not(:nth-child(2n+1)) {
  margin-left: 40px;
}
.bannerWrap.column2 .bannerItem:nth-child(n+3) {
  margin-top: 40px;
}
}



/*------------------------------
 SP（スマートフォン）
------------------------------*/
@media screen and (max-width: 768px) {
/* SpCommonReset
**************************** */
/* h1 and h2 */
#main h1 img,#main div[id^="h2_0"] img{
zoom:1;
display:block;
max-width:750px;
width:100%;
height:auto;
margin:auto;
}
.carrybagWrap h2 {
  background-color: transparent;
}
/* wrap */
.carrybagWrap{
max-width:750px;
width:100%;
margin:0 auto;
-webkit-text-size-adjust:100%;
background: #ffffff;
}
.carrybagWrap img{
vertical-align: top;
width: 100%;
height: auto;
zoom: 1 !important;
}
.carrybagWrap a{
display: block;
}
.ichioshiBlock{
  margin-block-start: calc(60 / 750 * 100%);
}
.block-more-btn {
  padding-bottom: 0;
  border: none;
}
/*nav01******************************************************/
.nav01 {
  margin-block-start: calc(20 / 750 * 100%);

  .navList {
    display: grid;
    grid-template-columns: 1fr repeat(2, 0.5fr) 1fr;
  }
  .navListItem:nth-child(1) {
    /* grid-area: 1 / 1 / 2 / 2; */
  }
  .navListItem:nth-child(2) {
    grid-area: 1 / 2 / 2 / 4;
  }
  .navListItem:nth-child(3) {
    /* grid-area: 1 / 4 / 2 / 5; */
  }
  .navListItem:nth-child(4) {
    grid-area: 2 / 1 / 3 / 3;
  }
  .navListItem:nth-child(5) {
    grid-area: 2 / 3 / 3 / 5;
  }
}
/*nav02******************************************************/
.nav02 {
  inline-size: calc(690 / 750 * 100%);
  margin-inline: auto;

  .navList {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: clamp(0.625rem, 2.67vw, 1.25rem); /*10px ~ 20px*/
  }
  .navListItem {
  }
}
/*nav03******************************************************/
.nav03 {
  .navList {
  }
  .navListItem {
  }
}


.carrybagWrap .productBlockA01 .productBlockA01Inner{
padding: 8% 4% 10.6%;
}
.carrybagWrap .headingBlockA01{
margin: 0 0 8.8%;
}
.carrybagWrap .headingBlockA02{
margin: 5.3% 0;
}
.carrybagWrap #type.headingBlockA02{
margin: 10.6% 0 5.3%;
}
.carrybagWrap .productBlockA01 .column2BlockA01{
margin: 0 0 8.7%;
}
.carrybagWrap .productBlockA01 .column2BlockA01 .column:nth-child(odd){
position: relative;
float: left;
width: 49.7%;
}
.carrybagWrap .productBlockA01 .column2BlockA01 .column:nth-child(2n){
float: right;
width: 44.2%;
}
.carrybagWrap .column2BlockA01{
color: #050505;
}
.carrybagWrap .column2BlockA01 .icon{
position: absolute;
top: 1px;
left: 1px;
width: 38.8%;
}
.carrybagWrap .column2BlockA01 .img{
border: 1px solid #e6e6e6;
box-sizing: border-box;
}
.carrybagWrap .column2BlockA01 .name{
margin: 0 0 4.34%;
font-size: 10px;
font-weight: bold;
line-height: 1.5;
}
.carrybagWrap .column2BlockA01 .txt{
margin: 0 0 4.05%;
font-size: 9px;
line-height: 1.55;
}
.carrybagWrap .column2BlockA01 .price{
margin: 0 0 7%;
text-align: right;
font-size: 12px;
font-weight: bold;
}
.carrybagWrap .bnrBlockA01{
padding: 0 5% 0 5%;
}
.carrybagWrap .bnrBlockA01 ul,
.carrybagWrap .bnrBlockA02 ul{
width: 92%;
margin: 0 auto;
}
.carrybagWrap .bnrBlockA01 ul li{
width: 48.5%;
float: left;
margin: 0 0 3%;
}
.carrybagWrap .bnrBlockA01 ul li:nth-child(2n){
float: right;
}
.carrybagWrap .bnrBlockA02 ul li{
margin: 0 0 3%;
}
.carrybagWrap .bnrBlockA02 ul li:last-child{
margin: 0;
}
.carrybagWrap .naviBlockB01{
margin: 0 0 10.6%;
}
.carrybagWrap .naviBlockB01 .naviBlockB01Inner{
width: 92%;
margin: 0 auto;
}
.carrybagWrap .naviBlockB01 ul li{
float: left;
width: 48.5%;
margin: 0 0 3%;
}
.carrybagWrap .naviBlockB01 ul li:nth-child(2n){
float: right;
}
.carrybagWrap .naviBlockB01 ul li:nth-last-child(-n+2){
margin: 0;
}
/*couponBlock 201105追加分******************************************************/
.carrybagWrap .couponBlock{
  /*background: url(../image/carrybag_bg_sp_001_201105.jpg) no-repeat top center;*/
  background: url(../image/carrybag_bg_sp_001_220901.jpg) no-repeat top center;
  background-size: 100%;
  margin: 8% 0 0;
}
.carrybagWrap .couponBlockInner{
  width: 84.8%;
  margin: 0 auto;
  padding: 8% 0;
}
.carrybagWrap .couponBlock .txtBlockA01{
  margin: 0 0 13.2%;
}
.carrybagWrap .couponBlock .couponBtnA01{
  margin: 3.7% auto 0;
  width: 99%;
}
.carrybagWrap .cautiontxtBlock01{
  margin-top: 1.6%;
  font-size: 12px;
  line-height: 1.44;
  font-weight: 600;
  color: #000000;
  text-align: left;
  text-indent: -1em;
  margin-left: 1.5em;
}
.carrybagWrap .couponLinkA01 a{
  display: inline;
  color: #0b318f;
  text-decoration: underline;
}

/* couponBlockA03 ******************************************************/
.carrybagWrap .couponBlockA03 {
margin: 5% 0 5% 0;
}
.carrybagWrap .couponImgA03 {
margin: 0 0 4%;
position: relative;
}
.carrybagWrap .couponBtnA03 {
position: absolute;
width: 77.06666%;
margin: 0 auto;
bottom: 4.1%;
left: 11.5%;
}
.carrybagWrap .cautionBlockA03 {
width: 89.333%;
margin: 0 auto;
}
.carrybagWrap .cautionBlockA03 .cautionTtl03 {
width: 17.9104%;
margin: 0 0 2.2388%;
padding: 2.2388% 0 2%;
text-align: center;
font-size: 10px;
font-weight: bold;
line-height: 1;
background-color: #ccc;
}
.carrybagWrap .cautionBlockA03 .cautionTxt03 {
font-size: 11px;
}
.carrybagWrap .cautionBlockA03 .linkTxt03 {
display: inline-block;
color: #1b3f96;
text-decoration: underline;
}
.pane-main {
  padding: 0 0 40px;
}
.headingBlockA02 h2 {
  background-color: rgba(0, 0, 0, 0);
  padding: 0;
  margin-bottom: 5.3%;
}
.ichioshiBlock > h2 {
  font-size: 12px;
  background-color: rgba(0, 0, 0, 0);
  padding: 0;
  margin-bottom: 1em;
}
.naviBlockA02 {
  margin-bottom: 1em;
}

/* bannerWrap */
.bannerWrap {
  margin-block-end: calc(80 / 750 * 100%);
}
.bannerText {
  margin-inline: auto;
  width:calc(690 / 750 * 100%);
}
.bannerList {
  margin-top: calc(20 / 750 * 100%);
  margin-inline: auto;
  width:calc(690 / 750 * 100%);
  display: flex;
  flex-wrap: wrap;
}
.justify-content-center .bannerList {
  justify-content: center !important;
}
/* 286バナー 2カラム */
.col2-286_286 .bannerList {
  --gap: 20px;
  gap: var(--gap);
}
.col2-286_286 .bannerItem {
  width: calc(50% - var(--gap) / 2);
}
/* 286バナー 3カラム */
.col3-286_286 .bannerList {
  --gap: 10px;
  gap: var(--gap);
}
.col3-286_286 .bannerItem {
  width: calc((100% / 3) - var(--gap) * 2 / 3);
}
/*
.block-separat{
  display: none;
}
.block-separat:nth-of-type(4),
.block-separat:nth-of-type(8){
  display: block;
} */
.btn-none + * {
  display: none;
}
.pc-only {
  display: none;
}
}
