@charset "utf-8";
/* CSS Document */
.more1 a{
	display: inline-flex;
	gap: 20px;
	border-radius: 200px;
	padding: 10px 30px;
	background-color: #000000;
	max-width: 320px;
}
.more1 .icon{
	width: 17px;
}
.more1 a > .flex{
    display: inline-flex;
    align-items: center;
    gap: 20px;   
}

.more1 a .icon{
    display: inline-flex;
    transition: transform .25s ease;
}

.more1 a:hover .icon{
    transform: translateX(4px);
}
.header .menu img{
    height: 35px;
    width: auto;
}
.header .cart img{
   height: 35px;
    width: auto; 
}
.header .shop img{ 
height: auto;
    width: 200px;
} 
.lp-point {
  display: flex;
  gap: clamp(10px, 4vw, 40px);
  align-items: center;
  margin-bottom: clamp(30px, 6vw, 60px);
    flex-wrap: nowrap;
}
.lp-pointbody {
  width: calc(50% - 20px);
}
.lp-point .imgbox{
  width: calc(50% - 20px);
}
.lp-point .imgbox img {
  display: block;
  width: 100%;
  object-fit: cover;
  border-radius: 8px;
  border: 4px solid #000;
}
/* 右テキスト */
.lp-point .lp-pointbody p {
  margin: 0 0 8px;
  line-height: 1.9;
  font-size: clamp(13px, 1.5vw, 15px);
}
/* 見出し部分 */
.lp-point .lp-point__head {
  align-items: flex-end;
  gap: clamp(10px, 1.6vw, 16px);
  margin-bottom: clamp(20px, 1.6vw, 30px);
  justify-content: flex-start;
  flex-wrap: nowrap;
}
/* 番号アイコン */
.lp-point__no {
  position: relative;
}
.lp-point__no img {
  display: block;
  height: clamp(52px, 6vw, 60px);
  width: auto;
}
/* 黒いピル */
.lp-point__pill {
  background: #111;
  color: #fff;
  padding: 5px 10px;
}

.online-shop{
  position: relative;
  overflow: hidden;
  background-color: #3bb273;
  background-size: 20px 20px;
  padding: clamp(60px, 5vw, 80px) clamp(24px, 5vw, 60px) clamp(40px, 5vw, 60px) ;
}

.shop-inner{
  position: relative;
  z-index: 1;
  max-width: 420px;
    margin-left: 5%;
    margin-right: auto;
  color: #fff;
}

/* ---------- footer ---------- */

.shop-title {
  margin: 0 0 14px;
  line-height: 1.05;
}
.shop-title span {
  font-size: clamp(32px, 6vw, 64px);
  font-weight: 900;
  color: #fff;
  /* 8方向のシャドウで太めの黒縁取り（ドット感） */
  text-shadow:
    3px 0 #000, -3px 0 #000, 0 3px #000, 0 -3px #000, 3px 3px #000, -3px 3px #000, 3px -3px #000, -3px -3px #000;
}
/* 説明文 */
.shop-inner .text {
  line-height: 1.8;
  margin-bottom: 20px;
}
/* ボタン（白・黒文字＋丸枠アイコン） */
.shop-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: #fff;
  color: #000;
  font-weight: 700;
  border-radius: 8px;
  padding: 12px 18px;
  text-decoration: none;
}
.shop-btn .icon {
  width: 24px;
  height: 24px;
  border: 2px solid #000;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.shop-btn .icon img {
  width: 10px;
  height: auto;
}
.shop-btn:hover {
  transform: translateY(-1px);
  transition: .15s ease;
}
/* 右側の大きい商品帯画像 */
.shop-images {
  position: absolute;
  left: -80px;
  bottom: 0px;
  width: 100%;
  z-index: 0;
  max-height: 450px;
}
.shop-images img {
  display: block;
  width: auto;
  margin-right: 0;
  margin-left: auto;
  height: 100%;
  max-height: 450px;
}
.footer {
  background-color: #171717;
  padding-top: 6vw;
}
.footer p {
  color: #fff;
}
.footer .footer_top {
  padding-bottom: 6vw;
}

.footer .footer_top .leftbox .logo img{
max-width:200px;
}
.footer .footer_top .rightbox {
gap: clamp(10px, 3vw, 50px);
}
.footer .footer_top .rightbox .ul .li {
  min-width: 140px;
}
.footer .footer_top .rightbox .ul .li img{
 width: auto;
  height: 40px;
}

.footer .footer_top .rightbox .ul .li:not(:last-of-type) {
  margin-bottom: 10px;
}
.footer .footer_top .rightbox .ul .li p {
  position: relative;
  padding-left: 1em;
  font-size: 16px;
  color: #eaeaea;
  line-height: 1.8;
  margin: 0;
}
.footer .footer_top .rightbox .ul .li p::before {
  content: "";
  position: absolute;
  top: 0.7em;
  left: 0;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #fff; /* 白丸 */
}
.footer .footer_top .rightbox .ul .li a {
  display: block;
  padding: 5px 0;
  position: relative;
}
.footer .footer_top .rightbox .ul .li a img {
  position: absolute;
  top: 50%;
  right: 0;
  width: 130px;
  transform: translate(0, -50%);
  transition: ease 0.3s;
}
.footer .footer_top .rightbox .ul .li a:hover img {
  transform: translate(3px, -50%);
}
/* ---------- IEのみ ---------- */
@media all and (-ms-high-contrast: none) {
}
/* ---------- 1280px ~ ---------- */
@media screen and (max-width: 1280px){
      /* ---------- footer ---------- */
  .footer .top_footer .rightbox {
    width: 60%;
  }
}
/* ---------- 1080px ~ ---------- */
@media screen and (max-width: 1080px){
      .lp-point {
    flex-direction: column;
  }
    .lp-pointbody {
        width: 100%;
    }
  .lp-point .imgbox
  {
    width: 80%;
min-width: 300px;
  }
    .lp-point .imgbox img{
          max-height: 500px;
    }
  /* ---------- footer ---------- */
  .footer .top_footer {
    flex-direction: column;
    gap: 30px;
  }
  .footer .top_footer .rightbox .footer_list {
    display: none;
  }
  .footer .top_footer .rightbox .online_bt_link {
    justify-content: center;
  }
}
/* ---------- 768px ~ ---------- */
@media screen and (max-width: 768px){
       .lp-point .lp-point__head {
    align-items: center;
    justify-content: center;
}
  .header .shop img{ 
height: auto;
    width: 120px;
} 
  /* ---------- footer ---------- */
  .shop-images .item {
    display: none;
  }
  .shop-inner {
    margin-left: auto;
  }
  .footer {
    padding-top: 0;
  }
  .footer .footer_top {
    padding-top: 10vw;
    padding-bottom: 10vw;
  }
}
/* ---------- 576px ~ ---------- */
@media screen and (max-width: 576px){
.header .menu-bt .line {
  display:none;
  }
  /* ---------- footer ---------- */
  .header .menu-bt { justify-content: center;}
  
  .footer .footer_top {
    padding-top: 15vw;
    padding-bottom: 15vw;
  }
  

}
/* ---------- 350px ~ ---------- */
@media screen and (max-width: 350px){
}