.main-img img{ width: 100%; }
body.item-content { display: block;}
body.item-content header {
  width: 100%;
  background-color: #FAFAFA !important;}
body.item-content header .header-inner { background-color: #FAFAFA;}
body.item-content .main-contents { width: 100%;}
body.item-content .header-inner {
  display: flex;
  padding: 10px 3vw;}
.breadcrumb-list{ justify-content: center;}
.item-index_head { padding: 60px 6vw 50px; }
.item-use {
  padding: 60px 6vw 60px;
  background-color: #BBDCE4;}
.item-use .txt-size16 {
  margin-bottom: 0.75em;
  color: #999999;}
.item-use h2 { margin-bottom: 1.5em;}
.use-list {
  gap: 10px 15px;
  flex-wrap: wrap;
  display: flex;}
.use-list_item {
  align-items: center;
  width: 100%;}
.use-list_item a {
  transition: .2s;
  height: 100%;
  font-weight: 700;
  gap: 1em;
  padding: 1em 1.5em;
  border-radius: 6px;
  color: var(--text-color);
  background-color: var(--color-wh);
  align-items: center;
  display: flex;}
.use-list_item .arow {
  fill: var(--main-color);
  display: flex;
  width: 1em;}
.item-itemlist_data img { width: 100%;}
@media screen and (min-width: 769px) {
  .item-index_head { padding: 100px 6vw 60px; }
  .item-itemlist_data img { max-width: 100px;}
  .item-use { padding: 100px 3vw 140px;}
  .use-list_item a { padding: 1em 1.5em;}
  .use-list_item a:hover {
    background-color: var(--main-color);
    color: var(--color-wh);}
  .use-list_item a:hover .arow { fill: var(--color-wh);}
  .use-list_item {
    align-items: center;
    width: calc((100% - 15px) / 2);}}
@media screen and (min-width: 1180px) {
  .use-list_item { width: calc((100% - 30px) / 3);}}



  .car-campaign{ padding: 0 6vw; }
  .car-campaign .section-inner{
      margin: auto;
      margin-bottom: 80px;
      max-width: 1080px;
      border-radius: 10px;
      border: solid var(--main-color) 1px; }
  .car-campaign .section-inner{ padding: 60px 3vw 50px; }
  .car-campaign figure{
      text-align: center;
      margin: auto; }
  .car-campaign figure img{ margin: auto; }
  .car-campaign_text{
      margin-top: 4em;
      text-align: left; }
  .car-campaign_text .arow-button{
      margin-top: 1em;
      justify-content: center; }
  @media screen and (min-width: 769px){
  }
  @media screen and (min-width: 1180px){
      .car-campaign .section-inner{
        margin-bottom: 190px;
          padding:  3vw;
          gap: 50px;
          align-items: flex-end;
          flex-wrap: wrap;
          display: flex; }
      .car-campaign_text{
          margin-top: 0;
          text-align: left;
          max-width: calc(100% - 631px); }
      .car-campaign_text p{ line-height: 2; }
      .car-campaign_text .arow-button{ justify-content: flex-end; }
  }

@media screen and (min-width: 768px){}
.content-title00 {
  font-size: 1.75rem;
  padding-bottom: 1em;
  border-bottom: solid 1px; }
.content-title05 {
  position: relative;
  color: var(--main-color);
  margin-bottom: 2.25em;
  font-size: 1.75rem; }
.mypage-head {
  margin: auto;
  max-width: calc(1080px + 12vw);
  padding: 0 6vw 30px; }
#merit .content-title02{ margin-bottom: 3.75em; }
#merit.section-inner{
  margin: auto;
  max-width: calc(1080px + 12vw);
  padding: 0 6vw 80px; }
.content-table dl{
  padding: 1.25em 0;
  border-top: solid 1px #EEEEEE;
  flex-wrap: wrap;
  display: flex; }
.content-table dl:last-child{ border-bottom: solid 1px #EEEEEE; }
.content-table dl p{
  gap: 0.25em;
  align-items: flex-end;
  display: flex; }
.content-table dl .must{
  font-size: 0.75em;
  color: var(--main-color); }
.content-table dd{
  width: 100%;
  margin-top: 0.5em; }
.content-table .flex-dd{
  display: flex;
  flex-wrap: wrap;
  gap: 1em; }
.content-table .item-name{ align-items: center; }
.content-table .item-name figure{ width: 2.5em; }
.content-table .item-name p{ width: calc(100% - 3.5em); }
.content-table input[type="text"],
.content-table textarea{
  border: solid 1px #EEEEEE;
  border-radius: 3px;
  padding: 0.35em 0.5em; }
.content-table .full textarea,
.content-table .full input[type="text"]{ width: 100%; }
@media screen and (min-width: 768px){
  #merit.section-inner{
    padding: 0 6vw 190px; }
  .mypage-head { padding: 0 6vw 60px; }
  .content-table dd{
    margin-top: 0;
    width: calc(100% - 240px); }
  .content-table dt{
    padding-top: 0.25em;
    width: 240px; }
}

.lh2{ line-height: 2; }


.section-inner3{ padding: 0 6vw; }

@media screen and (min-width: 768px){
  .pager{ margin-top: 80px; }
}



.merit-box+.merit-box{ padding-top: 60px; }
.merit-box .content-title01{ margin-bottom: 1.75em; }
.merit-item+.merit-item{ margin-top: 60px; }
.merit-item h3{ margin-bottom: 0.75em; }
@media screen and (min-width: 768px){
  .merit-item+.merit-item{ margin-top: 30px; }
  .merit-box+.merit-box{ padding-top: 120px; }
}


.merit-nav-list {
  flex-wrap: wrap;
  gap: 1.25em;
  display: flex; }
.merit-nav-list_item a {
  transition: .2s;
  padding: 1em 2.5em 1em 1.5em;
  font-weight: bold;
  color: var(--main-color);
  position: relative;
  border-radius: 10em;
  border: solid 1px var(--main-color);
  width: 100%;
  align-items: center;
  display: flex; }
.merit-nav-list_item .arow {
  transition: .2s;
  fill:  var(--main-color);
  position: absolute;
  right: 1.5em;
  width: 0.5625em;
  display: block; }
@media screen and (min-width: 769px){
  .pagein-link_item { width: calc((100% - 1.25em * 2) / 3 ); }
  .merit-nav-list_item a:hover{
    background-color: var(--main-color);
    color: var(--color-wh); }
    .merit-nav-list_item a:hover .arow{ fill: var(--color-wh); }
}
@media screen and (min-width: 1180px){
  .merit-nav-list_item { width: calc((100% - 1.25em * 3) / 4 ); }
}



.itemlist-h2 {
  margin-bottom: 20px;
  color: #0E95A4;
  font-weight: 400;
  padding-left:75px;
  line-height: 60px;
  background: url("../../assets/img/item/checkitem.png") no-repeat left top;}
.itemlist {
  width: 100%;
  display: flex;
  gap:20px;
  align-items: stretch;
  justify-content: space-between;}
.itemlist-box {
  padding-bottom: 40px;
  margin-bottom:  20px;
  position: relative;
  border: 1px solid #EEEEEE;
  border-radius: 4px;
  overflow: hidden;
  width: 100%;}
.itemlist-box a { color:var(--text-color);}
.itemlist-box .text {
  padding: 13px 20px;
  font-size: 14px;
  position: relative;}
.itemlist-box .badge {
  position: absolute;
  top: -10px;
  right: 6px;}
.itemlist-box figure { width: 100%;}
.itemlist-box figure img { width: 100%;}
.itemlist-box .action {
  position: absolute;
  bottom: 0;
  width: 100%;
  display: flex;
  border-top: 1px solid #eee;}
.itemlist-box .action div {
  height: 40px;
  text-align: center;
  width: 50%;}
.itemlist-box .action div.view { border-right: 1px solid #eee;}
.itemlist-box .action img { display: inline-block;}
.itemlist-box .action a {
  padding-top: 10px;
  height: 100%;
  transition: 0.3s;
  display: block;}
.itemlist-box .itemname { padding-bottom: .5em;}
.itemlist-box .action a:hover { background: var(--sub-color_yellow);}
.itemlist-box a:hover { opacity: 0.8; text-decoration: underline;}
@media screen and (max-width: 768px) {
  .itemlist { flex-wrap: wrap; gap:0;}
  .itemlist-box { width: 49%;}}


#egift { align-items:flex-start; }
#egift .itemphoto {
  height: auto;
  padding: 20px;
  border-radius: 10px;
  box-shadow: 0 2px 10px rgba(150,150,150,0.2);}
#egift .itemphoto p { 
  color: #EEEEEE;
  padding-top: 10px;}


@media screen and (min-width: 768px){
  .item-link a.item-cart:hover { background: var(--main-color);}
  .item-link a.item-view:hover { background: #aaa;}}


.merit-list{
  display: flex;
  flex-wrap: wrap;
  gap: 30px; }
.merit-list_item,
.merit-list_block{
  text-align: center;
  width: 100%; }
.merit-list_block .arow{
  margin-top: 1.75em;
  line-height: 1;
  display: inline-block;
  width: 1em; }
.merit-list_item figure,
.merit-list_block figure{
  transition: .2s;
  overflow: hidden;
  border-radius: 10px; }
.merit-list_block:nth-child(1) .sub-title{ color: #E9DFBA; }
.merit-list_block:nth-child(2) .sub-title{ color: #A8CCD5; }
.merit-list_block:nth-child(3) .sub-title{ color: #9BC9BB; }
.merit-list_block .txt-size14{
  text-align: left;
  margin: 1em 0 1.5em; }
.merit-list_block h3{ line-height: 1.6; }
.merit-list_item h4{
  line-height: 1.6;
  margin: 0.75em 0; }
.merit-list_item p{ text-align: left; }
.merit-list_item figure img,
.merit-list_block figure img{ width: 100%; }
@media screen and (min-width: 768px) {
  .merit-list_item,
  .merit-list_block{ width: calc((100% - 60px) / 3); }
  .merit-list_block a:hover h3,
  .merit-list_block a:hover p{ text-decoration: underline; }
  .merit-list_block a:hover figure{ opacity: 0.7; }
}


.index-method-list_item{
  padding-bottom: 20px;
  padding-top: 20px;
  border-bottom: solid 1px #C2DBE3;
  background: var(--color-wh); }
.index-method-list_item:last-child{ border-bottom: none; }
.index-method-list_item a{
  transition: .2s;
  align-items: center;
  display: block;
  flex-wrap: wrap; }
@media screen and (min-width: 1180px){
  .index-method-list_item a:hover{ opacity: .7; }
}
.index-method-list_item figure{
  position: relative;
  width: 100%; }
.index-method-list_item figure:after{
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 0 19px 19px; }
.index-method-list_item:nth-child(1) figure{ background-color: #E9DFBA; }
.index-method-list_item:nth-child(2) figure{ background-color: #A8CCD5; }
.index-method-list_item:nth-child(3) figure{ background-color: #9BC9BB; }
.index-method-list_item:nth-child(1) figure:after{ border-color: transparent transparent #DDD0A6 transparent; }
.index-method-list_item:nth-child(2) figure:after{ border-color: transparent transparent #8EB7C1 transparent; }
.index-method-list_item:nth-child(3) figure:after{ border-color: transparent transparent #81AA9D transparent; }
.index-method-list_item figure img{
  height: 100%;
  width: 100%;
  object-fit: cover; }
.index-method-list_item .item-text{
  padding: 60px 6vw;
  width: 100%; }
.index-method-list_item h3{
  position: relative;
  padding-left: 1.5em;
  font-weight: 400;
  color: var(--main-color); }
.index-method-list_item h3 .icon{
  transform: translateY(5%);
  top: 0;
  bottom: 0;
  margin: auto;
  width: 1em;
  position: absolute;
  left: 0;
  display: flex;
  align-items: center; }
.index-method-list_item h3 .icon svg{
  fill: var(--main-color);}
.index-method-list_item p{
  color: var(--text-color);
  margin-top: 1em;
  line-height: 2;
}

@media screen and (min-width: 769px){
  .index-method-list_item a{ display: flex; }
  .index-method-list_item figure{ width: 50%; }
  .index-method-list_item .item-text{
      padding: 30px 60px;
      width: 50%; }
}



.merit-flex{
  gap: 40px;
  flex-wrap: wrap;
  display: flex; }
.merit-flex_text{
  width: 100%; }
.merit-flex figure{ text-align: center; }
@media screen and (min-width: 769px){
  .merit-flex{ gap: 80px; }
  .merit-flex_text,
  .merit-flex figure{ width: calc((100% - 80px) / 2); }
}

.flex_text-title{
  margin-bottom: 1.5em;
  line-height: 1.6;
  padding-left: 120px;
  font-size: 1rem;
  color: var(--main-color);
  position: relative; }
.flex_text-title .text-title_circle{
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  text-align: center;
  border-radius: 50%;
  align-items: center;
  justify-content: center;
  display: flex;
  width: 100px;
  height: 100px;
  border: solid 1px var(--main-color);
}

.item-link{
  margin-top: 5em;
  text-align: center;
}
.item-link a{
  padding: 0.75em;
  border-radius: 3em;
  width: 100%;
  max-width: 360px;
  display: inline-block;
  color: var(--main-color);
  border: solid 1px var(--main-color); }







.ondemand-item_txt{
  position: relative;
  margin-top: -100px;
  text-align: center;
}
.ondemand-item_txt h3{ margin-bottom: 1.25em }
.ondemand-item_txt p{ margin-bottom: 2.25em }

.ondemand-item_inner{
  margin-top: ;
  position: relative;
}
.ondemand-title_sub{
  justify-content: center;
  align-items: center;
  gap: 1em;
  display: flex; }
.ondemand-title_sub .jp{
  padding: 0 1em;
  border: solid 1px; 
  border-radius: 2em;
}
.ondemand-item h3{
  margin: 0.75em 0 1em; }
.ondemand-item .main-text{
  text-align: left;
  margin-bottom: 4em;
  line-height: 2; }
.dl-button{
  transition: .2s;
  margin: auto;
  padding: 0.75em;
  max-width: 440px;
  font-weight: 700;
  fill: var(--color-wh);
  color: var(--color-wh);
  display: block;
  position: relative;
  background-color: var(--main-color); }
.ondemand-item .dl-button{
  margin-bottom: 3.75em;
}
.dl-button .icon{
  top: 0;
  bottom: 0;
  right: 1em;
  margin: auto;
  position: absolute;
  display: flex;
  align-items: center;
  width: 1em; }
.ondemand-img{ margin: auto; }
.ondemand-img.pc{ display: none; }

.ondemand-list {
  margin:  0 auto;
  max-width: 1080px;
  display: flex;
  gap:0 40px;
  justify-content: center;}
.ondemand-list .reflect ,.ondemand-list .spreflect{
  width: 240px; height: 160px;
  overflow: hidden;}
@media screen and (min-width: 769px){
  .ondemand-item .main-text{ text-align: center; }
  .ondemand-img.pc{ display: block; }
  .ondemand-img.sp{ display: none; }
}
.ondemand-bg{
  overflow: hidden;
  max-height: 480px;
  left: 0;
  top: 0;
  position: absolute;
  width: 100%; }
.ondemand-bg img{
  width: 100%; }
@media screen and (min-width: 769px){
  .dl-button:hover{ background-color: var(--text-color); }
  .dl-button:hover .icon{}

}


.reflect {
  margin-bottom: 1px;}
.spreflect {
  transform: scale(1, -1);
  position: relative;}
.spreflect::before {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  background: linear-gradient(#fff 70%, rgba(255,255,255,0.8) 100%);
  position: absolute;
  top: 0;
  left: 0;}

@media screen and (max-width: 1080px){
  .ondemand-list-card:nth-child(4n) { display: none;}
}

@media screen and (max-width: 768px){
  .ondemand-list-card:nth-child(4n) { display: block;}
  .ondemand-list {
    height: 542px;
    flex-wrap: wrap;}
  .ondemand-list-card:nth-child(4n),.ondemand-list-card:nth-child(3n) {
    position: relative;
    top: -100px;}
}

@media screen and (max-width: 531px){

.ondemand-list {height: 990px;}
.ondemand-list-card:nth-child(2n) { position: relative;top: -100px;}
.ondemand-list-card:nth-child(3n) { position: relative;top: -200px;}
.ondemand-list-card:nth-child(4n) { position: relative;top: -300px;}

}


.merit-desiList{
  margin-top: 40px;
  gap: 25px;
  flex-wrap: wrap;
  display: flex; }
.merit-desiList_item{ width: calc((100% - 50px) / 3); }
.merit-desiList_item p{ margin-top: 0.5em; }
.merit-desiList_item figure{
  position: relative;
  border: solid 1px #CCCCCC; }
.merit-desiList_item figure,
.merit-desiList_item img{ width: 100%; }
.merit-desiList_item .icon {
  position: absolute;
  display: block;
  width: 1.25em;
  height: 1.25em;
  right: 0;
  padding: 3px;
  fill: var(--color-wh);
  bottom: 0;
  background-color: #CCCCCC;
}
@media screen and (min-width: 768px){
  .merit-desiList_item{ width: calc((100% - 100px) / 5); }
}


.merit-flow_item{
  position: relative;
  gap: 30px;
  display: flex; }
.merit-flow_item:before{
  content: "";
  z-index: -1;
  left: 40px;
  position: absolute;
  display: block;
  background-color: #222;
  width: 1px;
  height: 100%; }
.merit-flow_item:last-child::before{ display: none; }
.step-nom{
  background-color: #fff;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  border: solid 1px #EEEEEE;
  height: 80px;
  width: 80px; }
.step-nom p{ line-height: 1.1; }
.merit-flow_item:last-child .merit-flow_text{ padding-bottom: 0; }
.merit-flow_text{
  width: calc(100% - 110px);
  padding-bottom: 50px;
  padding-top: 1.5em; }
.merit-flow_text h3{ margin-bottom: 0.75em; }
.merit-flow_text p{
  margin-bottom: 1em;
  line-height: 1.6; }
@media screen and (min-width: 768px){
  .merit-flow_item:before{ left: 58px; }
  .step-nom{
    height: 116px;
    width: 116px; }
  .merit-flow_text{
    padding-bottom: 100px;
    width: calc(100% - 146px); }
}

.suppliers-list{
  display: flex;
  flex-wrap: wrap;
  gap: 20px; }
.suppliers-list_block{ width: 100%; }
.suppliers-list_block figure{
  overflow: hidden;
  border-radius: 10px; }
.suppliers-list_block h3{ margin: 0.75em 0; }
.suppliers-list_block figure img{ width: 100%; }
@media screen and (min-width: 768px) {
  .suppliers-list{ gap: 40px; }
  .suppliers-list_block{ width: calc(50% - 20px); }
}


.merit-title_box{
  text-align: center; }
.merit-title_box .sub{ color: #999999; }

.merit-title_box.merit-title-none h2{ margin-bottom: 0; }
.merit-title_box h2{
  margin-top: 0.25em;
  margin-bottom: 0.75em;
  font-size: 3rem; }