* {
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
}
#hogsyland_selfcare {
  font-family: "Noto Sans JP", sans-serif;
}
img {
  width: 100%;
  vertical-align: bottom;
}
.spOnly {
  display: block;
}
.bold {
  font-weight: bold;
}
.red {
  font-weight: bold;
  color: #ff6363;
}
.red.size {
  font-size: 5vw;
}
.kvBox__img {
  width: 100%;
}
.mainCont {
  position: relative;
}
.mainCont a img:hover {
  opacity: 0.5;
}
.kvBox a img:hover {
  opacity: 0.5;
}
@media (min-width: 769px) {
  .sp {
    display: none !important;
  }
}
@media (max-width: 768px) {
  .pc {
    display: none !important;
  }
}
.midashi_p {
  width: 39%;
  text-align: center;
  margin: 0 AUTO 50px;
}
.midashi_p2 {
  width: 80%;
  text-align: center;
  margin: 0 AUTO 50px;
}
.tokucyo_er {
  background: url(/elekiban/hogsyland_selfcare/img/base_pc.png);
  width: 900px;
  height: 2340px;
  margin: 0 auto;
}
.toku_movie {
  position: relative;
  top: 544px;
  left: 473px;
  width: 339px;
  margin-top: 38px;
}
.toku_a1,
.toku_a2,
.toku_a3 {
  width: 800px;
  margin: 0 auto 30px;
}
.sp_01 {
  margin-bottom: 50px;
}
.special_3 {
  margin-bottom: 50px;
}
.special_4 {
  margin-bottom: 50px;
}
.cm_gallery {
  width: 50%;
  text-align: center;
  margin: 40px AUTO 50px;
}
.pip_logo {
  margin: 0 auto;
  text-align: center;
}
.pip_logo img {
  max-width: 114px;
}
.sp4_product {
  background-color: #00a041;
  padding: 40px;
}
.sp4_product ul {
  display: flex;
  width: 560px;
  margin: 0 auto;
  justify-content: space-around;
}
.sp4_product li {
  width: 120px;
}
.sp4_text {
  color: #fff;
  font-size: 22px;
  font-weight: bold;
  text-align: center;
  margin: 20px auto;
}
.ec_link {
  width: 400px;
  text-align: center;
  margin: 0 auto;
}
.toku_more {
  width: 308px;
  position: relative;
  top: 679px;
  left: 112px;
  margin-top: -195px;
}
.sp2_product {
  text-align: center;
  margin: 120px auto 40px;
}
.ec_link_2 {
  width: 300px;
  position: relative;
  top: 661px;
  text-align: center;
  margin: 0 auto;
  margin-top: -100px;
}
.special_3 .midashi_p {
  width: 50%;
  margin-top: 10px;
}
.shopsm {
  position: absolute !important;
  z-index: -10000;
  right: 0;
  left: 0;
  display: none;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 730px;
  height: 120px;
  margin: 0 auto;
  -webkit-transform: scale(0.9, 0.9);
  transform: scale(0.9, 0.9);
  background: #f0f0f0;
}
.shopsm ul {
  position: relative !important;
  margin: 0 !important;
  padding: 10px 30px 0;
  text-align: center !important;
  display: flex;
  justify-content: space-between;
}
.shopsm ul li {
  width: 150px !important;
}
.shopsm ul li img {
  width: 100%;
}
.shopsm p {
  font-size: 14px !important;
  font-family: sans-serif;
  line-height: 1 !important;
  padding-top: 8px !important;
  text-align: center !important;
  color: black !important;
}
.slider-2 .slick-slide {
  width: 600px;
  margin: 0 10px;
  position: relative;
  overflow: hidden;
}
.slider-2 .slick-slide a {
  text-decoration: none;
  font-size: 20px;
}
.slider-2 .slick-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.slider-2 .slick-next {
  right: 0;
}
.slider-2 .slick-prev {
  left: 0;
}
.slider-2 .slick-next::before {
  left: 20px;
}
.slider-2 .slick-prev::before {
  border-width: 0 0 3px 3px;
  right: 22px;
}
.dots-2 .slick-dots {
  text-align: center;
}
.dots-2 .slick-dots li {
  display: inline-block;
}
.dots-2 .slick-dots button {
  display: block;
  width: 10px;
  height: 10px;
  margin: 6px;
  font-size: 0;
  padding: 0;
  border: 0;
  outline: none;
  cursor: pointer;
  background: #bcbcbc;
  border-radius: 50%;
}
.dots-2 .slick-dots .slick-active button {
  background: #0a467d;
}
.secInnerclipTop {
  width: 93%;
  margin: 8% auto 12%;
}
.secInnerclipTop a {
  position: relative;
  display: block;
  text-align: center;
  font-size: 4.67vw;
  text-decoration: none;
  border: solid 1px #000;
  padding: 5% 0;
  border-radius: 10px;
  line-height: 1;
}
.secInnerclipTop a:after {
  position: absolute;
  top: 50%;
  right: 4%;
  content: "";
  display: inline-block;
  width: 3%;
  height: 37%;
  background: url(../img/innerclip/icon_arrow.png) no-repeat;
  background-size: 100%;
  transform: translateY(-50%);
}
.kvBox {
  width: 100%;
  margin: 0 auto 5%;
}
.sp_products {
  width: 900px;
  background-color: #ffffd9;
  padding: 40px 0;
  margin: 0 auto 50px;
}
.sp_p_title {
  width: 680px;
  margin: 0 auto;
}
.sp_p_att {
  border: solid 1px #ec7a2c;
  border-radius: 10px;
  margin: 20px auto;
  padding: 10px;
  width: 305px;
  font-size: 14px;
  text-align: center;
  font-weight: 00;
}
.sp_p_att span {
  color: #ec7a2c;
  font-size: 16px;
}
.sp_products ul {
  display: grid;
  grid-template-columns: repeat(2, 240px);
  justify-content: center;
  width: 800px;
  margin: 0 auto;
  gap: 45px 60px;
}
#product .sp_products li img {
  width: 186px;
  object-fit: contain;
  transition: all 0.3s ease;
}
.sp_products li a {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-decoration: none !important;
  margin: 0 0.4%;
}
.sp_products li p {
  font-size: 14px;
  width: 240px;
  text-align: left;
  line-height: 1.8;
  font-weight: 700;
  font-family: "Zen Maru Gothic", sans-serif !important;
  color: #632c17;
  margin-top: 10px;
}
.sp_products li div {
  font-size: 27px;
  line-height: 1.2;
  font-weight: 900;
  color: #ed781f;
  text-align: center;
  margin-top: 20px;
  font-family: "Zen Maru Gothic", sans-serif;
}
@media screen and (min-width: 769px) {
  .spOnly {
    display: none;
  }
  .red.size {
    font-size: 20px;
  }
  .kvBox {
    width: 1020px;
    margin: 0 auto 50px;
  }
  .mainCont {
    max-width: 100%;
    padding-top: 18px;
  }
  .purchase {
    margin-bottom: 40px;
  }
  .purchase.mb {
    margin-bottom: 70px;
  }
  .purchase .link:hover {
    opacity: 0.7;
    color: #000;
  }
  .purchase > .link {
    font-size: 20px;
    width: 250px;
    border-radius: 4px;
    padding: 14px 0;
  }
  .purchase > .link:before {
    left: 11%;
    width: 22px;
    padding-top: 19px;
  }
  .purchase > .link:after {
    width: 7px;
    height: 14px;
  }
  .shopsm.on {
    z-index: 100;
    display: block;
    -webkit-animation: show 0.1s ease-out 0s;
    animation: show 0.1s ease-out 0s;
    opacity: 1;
    background: #f0f0f0;
  }
  .shopsm ul li a:hover {
    opacity: 0.7;
  }
  .secInnerclipTop {
    width: 250px;
    margin: 95px auto 60px;
  }
  .secInnerclipTop a {
    font-size: 20px;
    padding: 14px 0;
    border-radius: 5px;
  }
  .secInnerclipTop a:hover {
    opacity: 0.7;
    color: #000;
  }
  .secInnerclipTop a:after {
    background: none;
  }
  .sec-lineup .sec-lineup-inner .sec-lineupRow2 .sec-lineupRightBox2 > a {
    width: auto;
  }
  .recommendContentWrp .recommendContent .recommendRight {
    width: 270px;
  }
}
@media screen and (max-width: 769px) {
  .midashi_p.first_m {
    position: inherit;
    margin: 10px auto;
    width: 50%;
  }
  .sp_01 {
    margin-bottom: 20px;
  }
  .midashi_p {
    width: 50%;
    margin: 0 AUTO 20px;
  }
  .cm_gallery {
    margin: 20px AUTO 30px;
  }
  .sp4_product ul {
    width: 100%;
  }
  .sp4_product {
    padding: 40px 25px;
  }
  .pip_logo img {
    max-width: 19%;
    margin-bottom: 10px;
  }
  .sp4_text {
    font-size: 18px;
  }
  .sp4_product li {
    margin: 0 1%;
  }
  .ec_link {
    width: 60%;
  }
  .special_4 {
    margin-bottom: 30px;
  }
  .midashi_p2 {
    margin: 0 AUTO 30px;
  }
  .tokucyo_er {
    background: url(/elekiban/hogsyland_selfcare/img/base_sp.png);
    width: 100%;
    margin: 0 auto;
    padding: 10px 0px;
    background-repeat: repeat-y;
    height: 100%;
  }
  .toku_a1 {
    position: inherit;
    padding-top: 10px;
  }
  .toku_a2 {
    position: inherit;
    padding-top: 10px;
  }
  .toku_a3 {
    position: inherit;
    padding-top: 10px;
  }
  .toku_a1,
  .toku_a2,
  .toku_a3 {
    width: 86%;
  }
  .toku_movie {
    top: 61vh;
    left: 13vw;
    width: 73%;
    margin-top: -2vh;
  }
  .toku_more {
    width: 80%;
    top: 85vh;
    left: 9vw;
  }
  .sp2_product {
    text-align: center;
    margin: 28px auto 20px;
  }
  .ec_link_2 {
    width: 54%;
    top: 32vh;
    left: 0vw;
    margin-top: -3vh;
  }
  .slider-2 .slick-slide {
    width: 85vw;
  }
  .slider-2 .slick-slide a {
    font-size: 15px;
  }
  .toku_a1_sp {
    background-image: url(/elekiban/hogsyland_selfcare/img/toku1_base_sp.png);
    background-size: cover;
    width: 85%;
    margin: 0 auto;
    padding: 5% 6% 8%;
  }
  .toku_a1_1 {
    padding-top: 12%;
  }
  .toku_a1_more {
    padding: 2% 0 4%;
  }
  .sp2_product_sp {
    background-image: url(/elekiban/hogsyland_selfcare/img/9base_sp.png);
    background-size: cover;
    width: 100%;
  }
  .roduct_sp_2 {
    padding: 2% 0;
    width: 46%;
    margin: 0 auto;
  }
}
.special_selfcare {
  margin-bottom: 60px;
}
.special_selfcare img {
  margin-bottom: 5px;
}
.special_selfcare div {
  margin: 0 auto;
  width: 60%;
}
.special_selfcare dl {
  display: flex;
  align-items: flex-start;
}
.special_selfcare dt {
  margin-right: 10px;
  width: 10%;
  text-align: right;
}
@media screen and (max-width: 769px) {
  .special_selfcare div {
    width: 80%;
  }
  .special_selfcare dt {
    width: 23%;
  }
  .special_selfcare dd {
    width: calc(100% - 23%);
  }
}
.sp_products {
  width: 900px;
  background-color: #ffffd9;
  padding: 40px 0;
  margin: 0 auto 50px;
}
.sp_p_title {
  width: 680px;
  margin: 0 auto;
}
.sp_p_att {
  border: solid 1px #ec7a2c;
  border-radius: 10px;
  margin: 20px auto;
  padding: 10px;
  width: 305px;
  font-size: 14px;
  text-align: center;
  font-weight: 00;
}
.sp_p_att span {
  color: #ec7a2c;
  font-size: 16px;
}
.sp_products li a {
  text-decoration: none;
}
@media screen and (max-width: 768px) {
  #product {
    margin-bottom: 50px;
  }
  #product .midashi_p {
    width: calc(503 / 768 * 100vw);
    margin: 0 auto calc(30 / 768 * 100vw);
  }
  .sp_products li p {
    font-size: max(2.8vw, 13px);
    margin-top: 2vw;
    width: fit-content;
    white-space: nowrap;
  }
  .sp_products {
    width: 100%;
  }
  .sp_p_title {
    width: 85%;
  }
  .sp_p_att {
    display: flex;
    align-items: center;
    justify-content: space-around;
    padding: 7px;
    font-size: 12px;
    width: 90%;
  }
  .sp_p_att span {
    font-size: 14px;
  }
  .sp_products ul {
    width: 100vw;
    padding: 8.3vw 0 15vw;
    margin-top: 6.9vw;
    border-radius: unset;
    grid-template-columns: repeat(2, 42.4vw);
    gap: 13vw 0;
  }
  #product .sp_products li img {
    width: 26vw;
  }
  .sp_products li div {
    font-size: max(3.7vw, 15px);
    margin-top: 2.7vw;
    white-space: nowrap;
  }
  .sp_products p span {
    font-size: max(2.4vw, 13px);
    margin-top: 0.7vw;
    display: block;
  }
  .slider-2 .slick-slide {
    width: 85vw;
  }
  .slider-2 .slick-slide a {
    font-size: 15px;
  }
}
