@charset "UTF-8";

.hit-item-2022 .main-title{
  margin: 0;
  padding: 0;
  width: 100%;
}

.hit-item-2022 section{
  width: 100%;
}

.hit-item-2022 #HIT01,
.hit-item-2022 #HIT02,
.hit-item-2022 #HIT03,
.hit-item-2022 #HIT04,
.hit-item-2022 #HIT05,
.hit-item-2022 #HIT06{ padding: 0 0 0.1rem 0;}

.hit-item-2022 #HIT01{ 
  background: url(/store/img/hit_item_2022/bg_01.jpg) center no-repeat;
  background-size: cover;
}
.hit-item-2022 #HIT02{ 
  background: url(/store/img/hit_item_2022/bg_02.jpg) center no-repeat;
  background-size: cover;
}
.hit-item-2022 #HIT03{ 
  background: url(/store/img/hit_item_2022/bg_03.jpg) center no-repeat;
  background-size: cover;
}
.hit-item-2022 #HIT04{ 
  background: url(/store/img/hit_item_2022/bg_04.jpg) center no-repeat;
  background-size: cover;
}
.hit-item-2022 #HIT05{ 
  background: url(/store/img/hit_item_2022/bg_05.jpg) center no-repeat;
  background-size: cover;
}
.hit-item-2022 #HIT06{ 
  background: url(/store/img/hit_item_2022/bg_06.jpg) center no-repeat;
  background-size: cover;
}

.backto-top{
  position:fixed;  
  right: 15px;
  bottom: 40px;  
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.4rem;
  background-color: #7c7772;
  z-index: 1000;
}

.backto-top a{
  position: relative;
  padding-top: 2rem;  
  width: 7.6rem;
  height: 7.6rem;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 2rem;
  font-weight: bold;
}

.backto-top a:before{
  position: absolute;
  top: 1.5rem;
  left: 0;
  right: 0;
  margin: auto;
  width: 0;
  height: 0;
  display: block;  
  border-style: solid;
  border-width: 0 1.2rem 1.5rem 1.2rem;
  border-color: transparent transparent #fff transparent;
  content: "";
}

.br-block{ display: none;}

.hit-navi{
  position: relative;
}

.hit-navi ul{
  position: absolute;
  bottom: 0;
  left: 50.5%;
  transform: translateX(-50%);
  margin: auto;
  padding:  0 0 2em 0;
  width: 75%;
  display: flex;
  justify-content: center;
}

.hit-navi ul li{
  margin: 0 1rem 0 0;
  padding: 0;
  width: 16.6666%;
  max-width: 9rem;
}

.hit-item-2022 ol{margin: 0 0 5rem 0;}
.hit-item-2022 ol li{position: relative;}

.button-box{
  position: relative;
  margin: 1rem 0 2.5rem 0;
  width: 100%;
  height: 60px;
}

.button-box img{
  position: absolute;
  left: 0;
  top: 0.2rem;
  margin: 0 0 0 4.3%;
  width: 21%; 
  max-width: 18.7rem;
}

.button{
  width: auto;
  text-align: center;
}

.button a{
  position: relative;
  display: inline-block;
  padding: 1.2rem 6rem 0.8rem 3rem;
  background-color: #f3de1e;
  box-shadow: 0px 5px 10px 1px rgba(45, 156, 118, 0.8);
  border-bottom: 3px solid #daaa04;
  border-radius: 23px;
  font-size: 1.5rem;
  font-weight: 800;
  text-align: center;
  color: #1b1d6e;
  transition: 0.1s ease-in-out;
  opacity: 1;
}

.button a:hover{
  text-decoration: none;
  margin-top: 3px;
  background: #f3de1e;
  border-bottom: 1px solid #daaa04;
}

#HIT02 .button a{ box-shadow: 0px 5px 10px 1px rgba(3, 92, 167, 0.8);}
#HIT03 .button a{ box-shadow: 0px 5px 10px 1px rgba(100, 168, 74, 0.8);}
#HIT04 .button a{ box-shadow: 0px 5px 10px 1px rgba(3, 153, 167, 0.8);}
#HIT05 .button a{ box-shadow: 0px 5px 10px 1px rgba(153, 3, 167, 0.8);}
#HIT06 .button a{ box-shadow: 0px 5px 10px 1px rgba(167, 3, 71, 0.8);}

.button :after{
  display: block;
  text-decoration: none;
  position: absolute;
  top: 0;
  right: 1.5rem;
  bottom: 0;
  margin: auto;
  padding: 0;
  width: 2rem;
  height: 2rem;
  background: url(/store/img/hit_item_2022/icon_arrow_bl.svg) center center no-repeat;
  background-size: contain;
  content: "";
}

@media screen and (max-width: 1000px) {

.hit-navi ul{
  padding: 0em 0 1em;
}

.button-box { height: 45px;}

}/* End max 1000 */


@media screen and (max-width: 640px) {

.hit-navi ul{
  left: 52%;
  padding: 0 0 1em;
  width: 100%;
}

.hit-navi ul li{
  margin: 0 0.5em 0 0;
}

.hit-item-2022 ol {
  margin: 0 0 5rem 0;
}

.hit-item-2022 ol li{
  margin: 0 0 1rem 0;
}

.backto-top{
  position:fixed;
  right: 15px;
  bottom: 105px;
}

.backto-top a{
  display: flex;
  padding-top: 1.5rem;
  width: 5rem;
  height: 5rem;  
  color: #fff;
  font-size: 1.6rem;
  font-weight: bold;
}

.backto-top a:before{
  position: absolute;
  top: 0.8rem;
  border-width: 0 0.8rem 1rem 0.8rem;
}

.br-block{ display: block;}


}/* End max 640 */



@media screen and (min-width: 769px) and (max-width:980px) {



}/* End 769-980 */



@media screen and (max-width: 580px) {

.hit-item-2022 #HIT01{ 
  background: url(/store/img/hit_item_2022/bg_01_sp.jpg) center no-repeat;
  background-size: cover;
}
.hit-item-2022 #HIT02{ 
  background: url(/store/img/hit_item_2022/bg_02_sp.jpg) center no-repeat;
  background-size: cover;
}
.hit-item-2022 #HIT03{ 
  background: url(/store/img/hit_item_2022/bg_03_sp.jpg) center no-repeat;
  background-size: cover;
}
.hit-item-2022 #HIT04{ 
  background: url(/store/img/hit_item_2022/bg_04_sp.jpg) center no-repeat;
  background-size: cover;
}
.hit-item-2022 #HIT05{ 
  background: url(/store/img/hit_item_2022/bg_05_sp.jpg) center no-repeat;
  background-size: cover;
}
.hit-item-2022 #HIT06{ 
  background: url(/store/img/hit_item_2022/bg_06_sp.jpg) center no-repeat;
  background-size: cover;
}

.hit-item-2022 .button-box { 
  height: auto;
  max-height: 75px;
}

.button-box img {
  position: relative;
  top: 0;
  margin: 0 0 0 4.5%;
  width: 32%;
  max-width: 18.7rem;
}

.button {
  margin: 2rem 0 1rem 0;
  width: 100%;
  text-align: center;
}

.button a {
  padding: 1.8rem 5rem 1.4rem 3rem;
  width: 60%;
  border-radius: 30px;
}

}/* End max 580 */


/* IE */
@media all and (-ms-high-contrast: none) {


}/* End IE */


