
/**sub menu*/
.sub_menu {
  max-width: 1110px;
  padding: 0 15px 0 15px;
  margin-left: auto;
  margin-right: auto;
  background-color: rgb(224, 224, 224);
}

.btn1 {
display: inline-block;
padding: 1px 5px;
border-radius: 3px;
text-decoration: none;
color: rgba(20,15,50,1);
background-color: rgba(224,224,224);
border:1px solid rgba(20,15,50,1);
transition: .2s;
}

.btn1:hover {
color: #fff;
background-color: rgba(20,15,50,1);
}


.title {
  position: relative;
  margin: 5px auto 5px auto;
  padding: 0;
  border-bottom: 1px solid #999;
  background-color: rgb(240, 240, 240);
}
.title p {
position: absolute;
margin: 0px;
color: #fff;
font-size: 16px;
top: 25px;
right: 5px;
color: #333;
}

/*list item*/
@media screen and (min-width:0px) and (max-width:374px) {
  .category_text {
    max-width: 374px;
  }
  .item_block {
    width: 145px;
    vertical-align: top;
    text-align: left;
    display: inline-block;
    margin: 4px 2px 4px 2px;
    font-family: 'M PLUS Rounded 1c', sans-serif;
    font-weight: 400;
    padding-top: 5px;
    border-top: 1px dotted #999;
  }
  .item_switch {
    visibility:hidden;
  }
  .pro_img {
    max-width: 600px; 
    display: inline-block; 
    vertical-align: top;
  }
  
}
@media screen and (min-width:375px) and (max-width:450px) {
  .category_text {
    max-width: 450px;
  }

  .item_block {
    width: 180px;
    vertical-align: top;
    text-align: left;
    display: inline-block;
    margin: 4px 2px 4px 2px;
    font-family: 'M PLUS Rounded 1c', sans-serif;
    font-weight: 400;
    padding-top: 5px;
    border-top: 1px dotted #999;

  }
  .item_switch {
    visibility:hidden;
  }
  .pro_img {
    max-width: 600px; 
    display: inline-block; 
    vertical-align: top;
  }
  
}
@media screen and (min-width:451px) and (max-width:540px) {
  .category_text {
    max-width: 540px;
  }

  .item_block {
    width: 210px;
    vertical-align: top;
    text-align: left;
    display: inline-block;
    margin: 4px 2px 4px 2px;
    font-family: 'M PLUS Rounded 1c', sans-serif;
    font-weight: 400;
    padding-top: 5px;
    border-top: 1px dotted #999;

  }
  .item_switch {
    visibility:hidden;
  }
  .pro_img {
    max-width: 600px; 
    display: inline-block; 
    vertical-align: top;
  }
  
}
@media screen and (min-width:541px) and (max-width:725px) {
  .category_text {
    max-width: 300px;
  }

  .item_block {
    width: 220px;
    vertical-align: top;
    text-align: left;
    display: inline-block;
    margin: 4px 2px 4px 2px;
    font-family: 'M PLUS Rounded 1c', sans-serif;
    font-weight: 400;
    padding-top: 5px;
    border-top: 1px dotted #999;

  }
  .item_switch {
    visibility:hidden;
  }
  .pro_img {
    max-width: 725px; 
    display: inline-block; 
    vertical-align: top;
  }
}
@media screen and (min-width:726px) and (max-width:800px) {
  .category_text {
    max-width: 400px;
  }
  .item_block {
    width: 230px;
    vertical-align: top;
    text-align: left;
    display: inline-block;
    margin: 4px 2px 4px 2px;
    font-family: 'M PLUS Rounded 1c', sans-serif;
    font-weight: 400;
    padding-top: 5px;
    border-top: 1px dotted #999;
  }
  .item_switch {
    visibility:hidden;
  }
  .pro_img {
    max-width: 500px; 
    display: inline-block; 
    vertical-align: top;
  }
}
@media screen and (min-width:801px) and (max-width:2000px) {
  .category_text {
    max-width: 550px;
  }
  .item_block {
    width: 230px;
    vertical-align: top;
    text-align: left;
    display: inline-block;
    margin: 4px 2px 4px 2px;
    font-family: 'M PLUS Rounded 1c', sans-serif;
    font-weight: 400;
    padding-top: 5px;
    border-top: 1px dotted #999;
  }
  .item_switch {
    visibility:hidden;
  }
  .pro_img {
    max-width: 600px;
    display: inline-block; 
    vertical-align: top;
  }
}

.btn2 {
  display: inline-block;
  padding: 1px 5px;
  border-radius: 3px;
  text-decoration: none;
  color: rgba(20,15,50,1);
  background-color: rgb(214, 214, 214);
  /*border:1px solid rgba(20,15,50,1);*/
  transition: .2s;
  width: 100px;
  }
  
.btn2:hover {
  color: #fff;
  background-color: rgba(20,15,50,1);
  width: 100px;
  }


/*PRO*/
.pro_btn {
    display: inline-block;
    padding: 1px 5px;
    border-radius: 3px;
    text-decoration: none;
    color: #fff;
    background-color: rgba(20,15,50,1);
    border:1px solid #fff;
    transition: .2s;
    width: 180px;
    margin: 5px;
  }
    
.pro_btn:hover {
    color: rgba(20,15,50,1);
    background-color: #fff;
    width: 180px;
    margin: 5px;
  }  

/*google font*/
.Noto_Sans_JP {
  font-family: 'Noto Sans JP', sans-serif;
}

/*arrow top*/
.upper {
  position: fixed;
  right: 5px;
  bottom: 10px;
  transition: 1s;
  opacity: 0.7;
}
.upper:hover {
  opacity: 1;
}