@charset "UTF-8";

.grid_lo{display: grid;}
.dl_grid{grid-template-columns:auto 1fr;grid-column-gap:1.5rem;}
.col3{grid-template-columns:repeat(3,1fr);grid-gap:1.5rem;text-align: center;margin-bottom:1.5rem;}
.item_grid{
  grid-template-columns: repeat(auto-fit, minmax(350px,1fr));
  grid-column-gap:1.5rem;
  justify-content: space-evenly;
  /*align-items :center;*/
}
.goods_box figure{text-align: center;}
.goto_link{
  width: fit-content;
  margin: 0 auto 0 auto;
  padding:0.25rem 0.5rem 0.25rem 0.5rem;
  text-align: center;
  color:#ffffff;
  background-color:#e4578d;
  border-radius: 1rem;
  text-decoration:none;
}
.sub_title{margin-bottom: 0.25rem;}
.list_lv1{padding-left: 1.5rem;}
.list_lv1 li{
  text-indent: -1rem;
  margin-bottom: 0.5rem;
}
.list_lv1 li:before{
  content:'○';
  display: inline-block;
  margin-right: 1rem;
}
.list_lv2{
  margin-left:0.5rem;
}
.list_lv2 li{
  margin-bottom: 0.5rem;
}
.list_lv2 li:before{
  content:'・';
  display: inline-block;
}
@media screen and (max-width:480px) {
  article,aside{padding-left: 3vw;padding-right: 3vw;}
  .col3{grid-template-columns:1fr;}
}

/* タブ切り替え */
.tab_wrap input[type="radio"]{
  display:none;
}
.tab_area{
 text-align: center;
 display: grid;
 grid-template-columns: repeat(auto-fit,12rem);
 justify-content: center;
 grid-column-gap:1rem;
}

.tab_area label{color:#e4578d;border: solid 1px #e4578d;border-radius: 1rem;}

.tab_area label:hover{
  cursor: pointer;
  transition: scale(1.25,1.25)
}
.panel_area{
  margin-top: 1rem;
}
.tab_panel{
  display:none;
}

#pc_btn:checked ~ .tab_area .tab1_label{background-color:#e4578d;color:#ffffff;padding: 0 0 .5rem 0 0 .5rem;border-radius: 1rem;}
#pc_btn:checked ~ .panel_area #pc_panel{display:block; animation:tabAnim ease-in 0.5s ; -ms-animation:tabAnim ease-in 0.5s ;}
#ec_btn:checked ~ .tab_area .tab2_label{background-color:#e4578d;color:#ffffff;padding: 0 0 .5rem 0 0 .5rem;border-radius: 1rem;}
#ec_btn:checked ~ .panel_area #ec_panel{display:block; animation:tabAnim ease-in 0.5s ; -ms-animation:tabAnim ease-in 0.5s ;}

.fadeout {
  animation : fadeOut 1.5s;
  animation-fill-mode: both;
}

@keyframes tabAnim{
  0%{opacity:0;}
  100%{opacity:1;}
}

@keyframes fadeOut {
  100% {
    opacity: 1;
  }
  0% {
    opacity: 0;
  }
}
/* タブ切り替え */