@charset "utf-8";

#Helmet header {
    position: unset;
    transform: unset !important;
    height: unset;
}
#Helmet main{
  overflow: hidden;
  padding-top: 0;
}
#Helmet .contents_area{
  position: relative;
  padding-top: 50px;
}
#Helmet .contents_area::before{
  position: absolute;
  content: "";
  width: 50%;
  height: calc(100% - 50px);
  left: 0;
  top: 50px;
  border-radius: 0 30px 30px 0;
  background-color: #000;
  z-index: -1;
}
#Helmet .container{
  position: relative;
  max-width: 1600px;
  padding-left: calc(100vw * 23 / 750);
  padding-right: calc(100vw * 23 / 750);

}

#Helmet .container .row{
  display: flex;
  flex-flow: row;
  font-family: "Noto Serif JP", serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
  
}
#Helmet .container .row .col{
  width: 50%;
}

#Helmet .title_sec {
  padding-top: calc(100vw * 95 / 750);
  padding-bottom: calc(100vw * 95 / 750);
}
#Helmet .title_sec .helmet_logo {
  text-align: center;
}
#Helmet .title_sec .helmet_logo img{
  width: calc(100% * 200 / 375);
  max-width: calc(200px * 2);
}

#Helmet .products_sec{
   padding-bottom: calc(100% * 150 / 750);
}
#Helmet .products_sec .helmet_block{
  text-align: right;
  padding-right: calc(100vw * 23 / 750);
}
#Helmet .products_sec .helmet_block img{
  width: calc(100% * 335 / 375);
  max-width: calc(335px * 2);
}
#Helmet .products_sec .products_block{
  padding-left: calc(100vw * 35 / 750);
}
#Helmet .products_sec .hyodo-collaborate_logo{
  display: block;
  text-align: center;
  padding-bottom: calc(100vw * 35 / 750);
  width: calc(100vw * 234 / 750);
  max-width: calc(234px * 2);
  margin: 0 auto;

}
#Helmet .products_sec.hyodo-collaborate_logo img{
  width: calc(100vw * 234 / 750);
  max-width: calc(234px * 2);
}
#Helmet .products_sec .products_list{
  display: flex;
  justify-content: space-between;
  width: calc(100vw * 330 / 750);
  max-width: calc(330px * 2);
  padding-bottom: 28px;
}
#Helmet .products_sec .products_list li{
  width: calc(100% * 316 / 660);
  max-width: 316px;
}
#Helmet .products_sec .products_list li figure figcaption{
  font-size: clamp(0.5rem, 0.1rem + 1.02vw, 1.2rem);
  text-align: center;
}
#Helmet .products_sec .products_data {
  width: calc(100vw * 330 / 750);
  max-width: calc(330px * 2);
}
#Helmet .products_sec .products_data figure{
  width: calc(100% * 158 / 330);
  max-width: calc(158px * 2);
  padding-bottom: 25px;
}
#Helmet .products_sec .products_data p{
  font-size: clamp(0.6rem, 0.1rem + 1.19vw, 1.2rem);
  padding-bottom: 1.0rem;
  line-height: 1.3;
}
#Helmet .products_sec .products_data p > span{
  font-size: clamp(0.6rem, 0.1rem + 1.02vw, 1.2rem);
}
#Helmet .products_sec .products_data .note{
  font-size: clamp(0.4rem, 0.1rem + 1.02vw, 1.0rem);
}


#Helmet .link-sec{
  padding-top: 145px;
}
#Helmet .link-sec p{
  text-align: center;
  font-size: 20px;
  font-weight: 600;
  padding-bottom: 20px;
}
#Helmet .link-sec .link_wrap{
  text-align: center;
}
#Helmet .link-sec .link_wrap a{
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: 0.13em;
  width: 330px;
  height: 60px;
  background: #000;
  box-sizing: border-box;
  font-feature-settings: "palt";
  position: relative;
  transition: opacity 0.4s cubic-bezier(0.38, 0.41, 0.27, 1), transform 0.2s cubic-bezier(0.235, 0, 0.05, 0.95), box-shadow 0.2s cubic-bezier(0.235, 0, 0.05, 0.95);
  color: #fff;
  box-sizing: border-box;
  transition: 0.3s;
  margin: 0 auto;
  border-radius: 30px;
  z-index: 1;
}
#Helmet .link-sec .link_wrap a::after{
  content: "";
  display: inline-block;
  width: 7px;
  height: 15px;
  mask: url(/img/common/icon_arrow_flat.svg) no-repeat center center / cover;
  background-color: #fff;
  margin-left: 20px;
}

@media (min-width: 900px){
  #Helmet .link-sec .link_wrap a:hover{
    transform: scale(1.05);
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.55);
  }

}
@media (max-width: 899px){
  #Helmet .link-sec{
    padding-top: calc(100vw * 145 / 750);
  }
  #Helmet .link-sec p{
    font-size: 17px;
  }
  #Helmet .link-sec .link_wrap a{
    font-size: 15px;
    width: 250px;

  }
}