@charset "utf-8";

#name-fixed-btn {
margin: 0;
padding: 10px 12px 10px 8px;
position: fixed;
right: 0;
top: 20px;
background: url(../img/stripe.png) repeat left top transparent;
border-radius: 4px 0 0 4px;
z-index: 100;
line-height: 0; /* Edge */
}

#name-fixed-btn[aria-hidden="true"] {
display: none;
opacity: 0;
transition: all 1s;
}

#name-fixed-btn[aria-hidden="false"] {
display: block;
opacity: 1;
transition: opacity 1s;
}

#name-fixed-btn ul {
margin: 0;
padding: 0;
}

#name-fixed-btn li {
list-style: none;
margin: 0;
padding: 0;
overflow: hidden;
}

#name-fixed-btn li a {
display: block;
width: 60px;
height: 220px;
overflow: hidden;
text-indent: -9999rem;
}

#name-fixed-btn li a:hover {
opacity: 0.85;
}

#name-fixed-btn li {
margin-bottom: 10px;
}

#name-fixed-btn li:last-child {
  margin-bottom: 0;
}



/* --- */

#name-fixed-btn[class*=med] {
background-color: #c0c0c0;
}

#name-fixed-btn[class*=med] li.fixed-btn-event a {
  background: url(../img/med/btn-02.png) no-repeat center top transparent;
}

#name-fixed-btn[class*=med] li.fixed-btn-online a {
  background: url(../img/med/btn-03.png) no-repeat center top transparent;
}

#name-fixed-btn[class*=med] li.fixed-btn-order a {
  background: url(../img/med/btn-01.png) no-repeat center top transparent;
}

#name-fixed-btn[class*=med] li.fixed-btn-line a {
  background: url(../img/med/btn-04.png) no-repeat center top transparent;
}

.name-hiroshima-med #name-fixed-btn[class*=med] li.fixed-btn-order a {
  background: url(../img/med/btn-01-hiroshima.png) no-repeat center top transparent;
}

/* - */

#name-fixed-btn[class*=beauty] {
background-color: #777;
}

#name-fixed-btn[class*=beauty] li.fixed-btn-event a{
background: url(../img/beauty/btn-02.png) no-repeat center top transparent;
}

#name-fixed-btn[class*=beauty] li.fixed-btn-online a{
background: url(../img/beauty/btn-03.png) no-repeat center top transparent;
}

#name-fixed-btn li.fixed-btn-order a{
background: url(../img/beauty/btn-01.png) no-repeat center top transparent;
}

#name-fixed-btn.name-tokyo-beauty-btn li.fixed-btn-line a{
background: url(../img/beauty/btn-04-tokyo.png) no-repeat center top transparent;
}

#name-fixed-btn li.fixed-btn-line a{
background: url(../img/beauty/btn-04.png) no-repeat center top transparent;
}

/* - */

#name-fixed-btn[class*=sweets] {
background-color: #d7cfb5;
}

#name-fixed-btn[class*=sweets] li.fixed-btn-event a {
background: url(../img/sweets/btn-02.png) no-repeat center top transparent;
}

#name-fixed-btn[class*=sweets] li.fixed-btn-online a {
background: url(../img/sweets/btn-03.png) no-repeat center top transparent;
}

#name-fixed-btn[class*=sweets] li.fixed-btn-order a {
background: url(../img/sweets/btn-01.png) no-repeat center top transparent;
}

#name-fixed-btn[class*=sweets] li.fixed-btn-line a {
background: url(../img/sweets/btn-04.png) no-repeat center top transparent;
}

#name-fixed-btn[class*=sweets] li.fixed-btn-event a[href*=sendai] {
  background: url(../img/sweets/sweets_btn-02sendai.png) no-repeat center top transparent;
  }


/* - */

#name-fixed-btn[class*=chori] {
background-color: #0e3365;
}

#name-fixed-btn[class*=chori] li.fixed-btn-event a {
background: url(../img/nagoya-chori/btn-02.png) no-repeat center top transparent;
}

#name-fixed-btn[class*=chori] li.fixed-btn-online a {
background: url(../img/nagoya-chori/btn-03.png) no-repeat center top transparent;
}

#name-fixed-btn[class*=chori] li.fixed-btn-order a {
background: url(../img/nagoya-chori/btn-01.png) no-repeat center top transparent;
}

#name-fixed-btn[class*=chori] li.fixed-btn-line a {
background: url(../img/nagoya-chori/btn-04.png) no-repeat center top transparent;
}

/* - */

#name-fixed-btn[class*=nagoya-chori] {
background-color: #0e3365;
}

#name-fixed-btn[class*=nagoya-chori] li.fixed-btn-event a {
background: url(../img/nagoya-chori/btn-02.png) no-repeat center top transparent;
}

#name-fixed-btn[class*=nagoya-chori] li.fixed-btn-online a {
background: url(../img/nagoya-chori/btn-03.png) no-repeat center top transparent;
}

#name-fixed-btn[class*=nagoya-chori] li.fixed-btn-order a {
background: url(../img/nagoya-chori/btn-01.png) no-repeat center top transparent;
}

#name-fixed-btn[class*=nagoya-chori] li.fixed-btn-line a {
background: url(../img/nagoya-chori/btn-04.png) no-repeat center top transparent;
}

/* - */

#name-fixed-btn[class*=eiyo] {
background-color: #f5e5bd;
}

#name-fixed-btn[class*=eiyo] li.fixed-btn-event a {
background: url(../img/eiyo/btn-02.png) no-repeat center top transparent;
}

#name-fixed-btn[class*=eiyo] li.fixed-btn-online a {
background: url(../img/eiyo/btn-03.png) no-repeat center top transparent;
}

#name-fixed-btn[class*=eiyo] li.fixed-btn-order a {
background: url(../img/eiyo/btn-01.png) no-repeat center top transparent;
}

#name-fixed-btn[class*=eiyo] li.fixed-btn-line a {
background: url(../img/eiyo/btn-04.png) no-repeat center top transparent;
}

/* - */

#name-fixed-btn[class*=fukushi] {
background-color: #ebebeb;
}

#name-fixed-btn[class*=fukushi] li.fixed-btn-event a {
background: url(../img/fukushi/btn-02.png) no-repeat center top transparent;
}

#name-fixed-btn[class*=fukushi] li.fixed-btn-online a {
background: url(../img/fukushi/btn-03.png) no-repeat center top transparent;
}

#name-fixed-btn[class*=fukushi] li.fixed-btn-order a {
background: url(../img/fukushi/btn-01.png) no-repeat center top transparent;
}

#name-fixed-btn[class*=fukushi] li.fixed-btn-line a {
background: url(../img/fukushi/btn-04.png) no-repeat center top transparent;
}

/* - */

#name-fixed-btn[class*=fukushi-tsushin] {
background-color: #ebebeb;
}

#name-fixed-btn[class*=fukushi-tsushin] li:first-child a {
background: url(../img/fukushi-tsushin/btn-01.png) no-repeat center top transparent;
}

#name-fixed-btn[class*=fukushi-tsushin] li:last-child a {
background: url(../img/fukushi-tsushin/btn-02.png) no-repeat center top transparent;
}





@media (max-width: 1250px), (max-height: 700px) {

.page-top #name-fixed-btn,
#name-fixed-btn {
right: 0;
left: 0;
top: auto;
bottom: 0;
margin: 0 auto;
padding: 3px 0 0 0;
text-align: center;
border-radius: 0;
}

#name-fixed-btn.name-fixed-btn-top {
top: 0;
bottom: auto;
padding: 3px 0 5px;
}

#name-fixed-btn ul {
position: relative;
top: -5px;
}


#name-fixed-btn.name-fixed-btn-top ul {
position: static;
}

#name-fixed-btn li {
width: 112px;
height: auto;
display: inline-block;
margin-bottom: 0;
margin-right: 5px;
}

#name-fixed-btn li a {
width: 100%;
height: 90px;
}

#name-fixed-btn li {
margin-right: 3px;
}

#name-fixed-btn li:last-child{
  margin-right: 0;
}

#name-fixed-btn[class*="beauty-btn"] li a{
  height: 61px;
}

/* --- */
#name-fixed-btn[class*=med] li.fixed-btn-event a {
background: url(../img/med/btn-sp-01.png) no-repeat center bottom transparent;
background-size: contain;
}

#name-fixed-btn[class*=med] li.fixed-btn-online a {
background: url(../img/med/btn-sp-03.png) no-repeat center bottom transparent;
background-size: contain;
}

#name-fixed-btn[class*=med] li.fixed-btn-order a {
background: url(../img/med/btn-sp-02.png) no-repeat center bottom transparent;
background-size: contain;
}

#name-fixed-btn[class*=med] li.fixed-btn-line a {
background: url(../img/med/btn-sp-04.png) no-repeat center bottom transparent;
background-size: contain;
}


.name-hiroshima-med #name-fixed-btn[class*=med] li.fixed-btn-order a {
  background: url(../img/med/btn-sp-02-hiroshima.png) no-repeat center bottom transparent;
  background-size: contain;
  }

/* - */

#name-fixed-btn[class*=beauty] li.fixed-btn-event a {
background: url(../img/beauty/btn-sp-02.png) no-repeat center bottom transparent;
background-size: contain;
}

#name-fixed-btn[class*=beauty] li.fixed-btn-online a {
background: url(../img/beauty/btn-sp-03.png) no-repeat center bottom transparent;
background-size: contain;
}

#name-fixed-btn[class*=beauty] li.fixed-btn-order a {
background: url(../img/beauty/btn-sp-01.png) no-repeat center bottom transparent;
background-size: contain;
}

#name-fixed-btn[class*=beauty] li.fixed-btn-line a {
background: url(../img/beauty/btn-sp-04.png) no-repeat center bottom transparent;
background-size: contain;
}

#name-fixed-btn.name-tokyo-beauty-btn li.fixed-btn-line a {
background: url(../img/beauty/btn-sp-04-tokyo.png) no-repeat center bottom transparent;
background-size: contain;
}

/* - */

#name-fixed-btn[class*=sweets] li.fixed-btn-event a {
background: url(../img/sweets/btn-sp-02.png) no-repeat center bottom transparent;
background-size: contain;
}

#name-fixed-btn[class*=sweets] li.fixed-btn-online a {
background: url(../img/sweets/btn-sp-03.png) no-repeat center bottom transparent;
background-size: contain;
}

#name-fixed-btn[class*=sweets] li.fixed-btn-order a {
background: url(../img/sweets/btn-sp-01.png) no-repeat center bottom transparent;
background-size: contain;
}

#name-fixed-btn[class*=sweets] li.fixed-btn-line a {
background: url(../img/sweets/btn-sp-04.png) no-repeat center bottom transparent;
background-size: contain;
}

#name-fixed-btn[class*=sweets] li.fixed-btn-event a[href*=sendai] {
  background: url(../img/sweets/btn-sp-02sendai.png) no-repeat center bottom transparent;
  background-size: contain;
  }


/* - */

#name-fixed-btn[class*=chori] li.fixed-btn-event a {
background: url(../img/nagoya-chori/btn-sp-02.png) no-repeat center bottom transparent;
background-size: contain;
}

#name-fixed-btn[class*=chori] li.fixed-btn-online a {
background: url(../img/nagoya-chori/btn-sp-03.png) no-repeat center bottom transparent;
background-size: contain;
}

#name-fixed-btn[class*=chori] li.fixed-btn-order a {
background: url(../img/nagoya-chori/btn-sp-01.png) no-repeat center bottom transparent;
background-size: contain;
}

#name-fixed-btn[class*=chori] li.fixed-btn-line a {
background: url(../img/nagoya-chori/btn-sp-04.png) no-repeat center bottom transparent;
background-size: contain;
}

/* - */

#name-fixed-btn[class*=nagoya-chori] li.fixed-btn-event a {
background: url(../img/nagoya-chori/btn-sp-02.png) no-repeat center bottom transparent;
background-size: contain;
}

#name-fixed-btn[class*=nagoya-chori] li.fixed-btn-online a {
background: url(../img/nagoya-chori/btn-sp-03.png) no-repeat center bottom transparent;
background-size: contain;
}

#name-fixed-btn[class*=nagoya-chori] li.fixed-btn-order a {
background: url(../img/nagoya-chori/btn-sp-01.png) no-repeat center bottom transparent;
background-size: contain;
}

#name-fixed-btn[class*=nagoya-chori] li.fixed-btn-line a {
background: url(../img/nagoya-chori/btn-sp-04.png) no-repeat center bottom transparent;
background-size: contain;
}

/* - */

#name-fixed-btn[class*=eiyo] li.fixed-btn-event a {
background: url(../img/eiyo/btn-sp-02.png) no-repeat center bottom transparent;
background-size: contain;
}

#name-fixed-btn[class*=eiyo] li.fixed-btn-online a {
background: url(../img/eiyo/btn-sp-03.png) no-repeat center bottom transparent;
background-size: contain;
}

#name-fixed-btn[class*=eiyo] li.fixed-btn-order a {
background: url(../img/eiyo/btn-sp-01.png) no-repeat center bottom transparent;
background-size: contain;
}

#name-fixed-btn[class*=eiyo] li.fixed-btn-line a {
background: url(../img/eiyo/btn-sp-04.png) no-repeat center bottom transparent;
background-size: contain;
}

/* - */

#name-fixed-btn[class*=fukushi] li.fixed-btn-event a {
background: url(../img/fukushi/btn-sp-02.png) no-repeat center bottom transparent;
background-size: contain;
}

#name-fixed-btn[class*=fukushi] li.fixed-btn-online a {
background: url(../img/fukushi/btn-sp-03.png) no-repeat center bottom transparent;
background-size: contain;
}

#name-fixed-btn[class*=fukushi] li.fixed-btn-order a {
background: url(../img/fukushi/btn-sp-01.png) no-repeat center bottom transparent;
background-size: contain;
}

#name-fixed-btn[class*=fukushi] li.fixed-btn-line a {
background: url(../img/fukushi/btn-sp-04.png) no-repeat center bottom transparent;
background-size: contain;
}

/* - */

#name-fixed-btn[class*=fukushi-tsushin] li:first-child a {
background: url(../img/fukushi-tsushin/btn-sp-01.png) no-repeat center top transparent;
background-size: contain;
}

#name-fixed-btn[class*=fukushi-tsushin] li:last-child a {
background: url(../img/fukushi-tsushin/btn-sp-02.png) no-repeat center top transparent;
background-size: contain;
}

}
