@charset "utf-8";
/* CSS Document */

#home section p {
	line-height:2;
}

/*mainvisual
***************************************/
#loadimg {
	clear: both;
	text-align: center;
}
#loading {
	display: none;
}
#loadimg img {
	width: 32px;
	padding: 20% 0;
}

#mainvisual {
	position:relative;
}

#mainvisual:after {
	content:"";
	display:block;
    background-image: linear-gradient(rgba(0,0,0,0.6),rgba(0,0,0,0));
	width:100%;
	height:150px;
	position:absolute;
	top:0;
}

#mainvisual .textbox {
	position:absolute;
	z-index: 1;
	top: 48%;
	right: 10%;
}

#mainvisual .textbox p {
	font-size:clamp(24px, 3.6vw, 48px);
	font-weight:900;
	letter-spacing:0.2em;
	color:#FFF;
	position:relative;
	line-height:1.6;
	text-align:right;
  text-shadow: 5px 5px 5px rgba(0,0,0,0.25);
}


@media (max-width: 1600px) {
}

@media (max-width: 1200px) {
}

@media (max-width: 980px) {
#mainvisual .textbox {
	/*中央*/
	position: absolute;
	left: 50%;
	transform:translateX(-50%);
	-webkit- transform:translateX(-50%);
	margin: auto;
	display:inline-block;
	width:100%;
	right:inherit;
	top:36%;
}

#mainvisual .textbox p {
	text-align:center;
	text-indent:7%;
}
}

@media (max-width: 480px) {
}

.index_title01 {
	margin-bottom:2rem;
	border-bottom:4px solid #FFF;
	padding-bottom:3%;
}

.index_title01 span {
	font-size:clamp(55px, 6vw, 120px);
	line-height:0.8;
	color:#FFF;
	display:block;
	margin-bottom:1rem;
	z-index: 1;
	position: relative;
}

.index_title01 strong {
	font-size:clamp(18px, 1.4vw, 24px);
	font-weight:700;
	display:block;
	z-index: 1;
	position: relative;
	color:#FFF;
}

.index_title02 {
	margin-bottom:2rem;
}

.index_title02 span {
	font-size:clamp(55px, 6vw, 120px);
	line-height:0.8;
	color:#472e0b;
	display:block;
	margin-bottom:1rem;
	z-index: 1;
	position: relative;
}

.index_title02 strong {
	font-size:clamp(20px, 1.4vw, 24px);
	font-weight:700;
	display:block;
	z-index: 1;
	position: relative;
	color:#472e0b;
}

.index_title03 {
	margin-bottom:2rem;
}

.index_title03 span {
	font-size:clamp(55px, 6vw, 120px);
	line-height:0.8;
	color:#f76a0c;
	display:block;
	margin-bottom:1rem;
	z-index: 1;
	position: relative;
}

.index_title03 strong {
	font-size:clamp(20px, 1.4vw, 24px);
	font-weight:700;
	display:block;
	z-index: 1;
	position: relative;
	color:#f76a0c;
}

#main #primary section#index01 {
	padding-top:15rem;
	padding-bottom:15rem;
	background:url(../../images/index/index01_bg.jpg) no-repeat center center;
	background-size:cover;
	background-attachment:fixed;
	position:relative;
}

#index01 .index_title01 {
	margin-bottom:6%;
	position:relative;
}

#index01 p strong {
	display:block;
	font-weight:700;
	font-size:clamp(28px, 3.4vw, 60px);
	line-height:1.2;
	color:#FFF;
	margin-bottom:3%;
}

#index01 .column-outside-left {
  flex:1;
  margin-left:calc(50% - 50vw);
  padding-left: 3rem;
}

#index01 .column-outside-left img {
  width:100%;
  height:auto
}

#index01 p {
	font-size:clamp(16px, 1.4vw, 18px);
	margin-bottom:4.5rem;
	color:#FFF;
	font-weight:600;
}

#index01 .card {
	background:rgba(245,245,245,0.9);
	padding:3.5rem;
}

#index01 .card h3 {
	display: flex;
	align-items: center;
	justify-content: flex-start; /* 左揃え */
	text-align: left;
	gap: 1.5rem;
	margin-bottom:1rem;
}

#index01 .card h3 img {
	position:relative;
	top:-0.70rem;
}

#index01 .card h3 strong.font-bn {
  font-size: clamp(30px, 6vw, 110px);
  line-height: 1;
  color:#472e0b;
  letter-spacing:0.1rem;
}

#index01 .card h3 strong.font-bn span {
	position:relative;
	top:-1rem;
}

#index01 .card dl {
  display: flex;
  align-items: flex-start;
  gap: 2rem;
}

#index01 .card dl dt {
  flex-shrink: 0;
  order: 2; /* ← 画像を右側へ */
}

#index01 .card dl dt img {
  width: clamp(96px, 20vw, 196px);
  height: auto;
}

#index01 .card dd {
  flex: 1;
}

#index01 .card dl dd h4 {
	font-size:clamp(24px, 2.4vw, 30px);
	color:#472e0b;
	margin-bottom:1rem;
	font-weight:600;
}

#index01 .card dl dd p {
	color:#472e0b;
	font-size:clamp(14px, 1.2vw, 16px);
	margin-bottom:0;
}

@media (max-width: 1280px) {
#main #primary section#index01 {
  padding-top: 7.5rem;
  padding-bottom: 7.5rem;
}

#index01 .column-outside-left {
	width:70%;
	flex:inherit;
	margin-left: auto;
	margin-right:auto;
	padding-left: 0;
}

#index01 .w50 {
	width:100%;
}
}

@media (max-width: 980px) {
}

@media (max-width: 680px) {
#index01 .column-outside-left {
	width:85%;
}

#index01 .card h3 {
	gap:0;
	position:relative;
	left:-3%;
}

#index01 .card h3 img {
	transform:scale(0.6);
}

}

@media (max-width: 480px) {
#main #primary section#index01 {
  padding-top: 4.5rem;
  padding-bottom: 6rem;
}

#index01 .column-outside-left {
	width:100%;
	margin-bottom:2rem;
}

#index01 .card {
	padding:2rem;
}

#index01 .card dl {
  flex-wrap: wrap;
}

#index01 .card dl dt {
	order:inherit;
	width:100%;
	text-align:center;
	margin-bottom:1rem;
}

#index01 .card {
	position:relative;
}

#index01 .card dl dt {
	position: absolute;
	right: 2rem;
	top: 2rem;
	text-align: right;
}


#index01 .card h3 img {
  top: -0.2rem;
  left: -1.5rem;
}

#index01 .card h3 img {
    transform: scale(0.4);
}

#index01 .card h3 strong.font-bn {
  text-indent: -3rem;
}


}

#main #primary section#index02 {
	position:relative;
	padding-left:6rem;
	padding-right:6rem;
	background:url(../../images/index/index02_bg.png) no-repeat center center;
	background-size:cover;
	background-attachment:fixed;
}

#index02 .index_title02 {
	margin-bottom:6%;
}

#index02 ul li.w24 {
	width:23.9%;
	text-align:center;
}

#index02 ul li.w24 h3 {
	text-align:center;
	margin-top:-4.5rem;
	margin-bottom:6rem;
	position:relative;
	z-index:1;
}

#index02 ul li.w24 h3:after {
	content:"";
	width:25px;
	height:135%;
	display:inline-block;
	background:#e7484a;
	position:absolute;
	top:-14%;
	
	left: 50%;
	transform: translateX(-50%);
	-webkit- transform: translateX(-50%);
	margin: auto;
	z-index:0;
	
	transform: skewX(-42deg);
}

#index02 ul li.w24 h3 span {
	font-size:clamp(20px, 2vw, 36px);
	background: linear-gradient(transparent 0%,#f76a0c 0%);
	-webkit-box-decoration-break: clone;
	box-decoration-break: clone;
	color: #fff;
	padding: 0 1rem 0.4rem 1rem;
	line-height: 1.8;
	font-weight:900;
	position:relative;
	z-index:1;
}

#index02 ul li.w24 p {
	font-weight:600;
	font-size:clamp(16px, 1.4vw, 18px);
	text-align:justify;
}

@media (max-width: 1280px) {
#main #primary section#index02 {
padding-left:3rem;
padding-right:3rem;
padding-top:7.5rem;
padding-bottom:7.5rem;
}
}

@media (max-width: 980px) {
#index02 ul li.w24 {
	width:48%;
	margin-bottom:4.5rem;
}

#index02 ul li.w24 h3 {
	margin-bottom:4.5rem;
}

#index02 ul li.w24 h3 span {
  font-size: 30px;
}
}

@media (max-width: 680px) {
#index02 ul li.w24 h3 span {
  font-size: 22px;
}
}

@media (max-width: 480px) {
#main #primary section#index02 {
	padding-left:2rem;
	padding-right:2rem;
	padding-top:6rem;
	padding-bottom:6rem;
}

#index02 ul li.w24 {
	width:80%;
	margin-left:auto;
	margin-right:auto;
}

#index02 ul li.w24:last-child {
	margin-bottom:0;
}

#index02 ul li.w24 h3 span {
  font-size: 30px;
}
}

#main #primary section#index03 {
	padding-bottom:9rem;
}

#index03 .title_box01 {
	margin-bottom:7.5%;
}

#index03 .title_box01 .index_title02 {
	margin-bottom:0;
}

/* =========================
   在庫一覧
   ========================= */

#index03 .cpt-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 2rem;
}

#index03 .cpt-item {
  margin-bottom: 6rem;
  position:relative;
}

/* =========================
   画像ラッパー
   ========================= */

#index03 .cpt-item .img-wrap {
  position: relative;
  width: 100%;
  aspect-ratio: 2 / 3;
  overflow: hidden;
}

/* =========================
   商品番号（#0012 など）
   ========================= */

#index03 .cpt-item .img-wrap span.font-bn {
  position: absolute;
  left: 0;
  bottom: 0;
  display: inline-block;
  padding: 0.5rem 1rem;
  background: rgba(0,0,0,0.6);
  color: #fff;
  font-size: clamp(14px, 1.2vw, 15px);
  z-index: 10;              /* ← 画像より必ず上 */
  pointer-events: none;     /* ← hover/tap の邪魔をしない */
}

/* =========================
   画像共通
   ========================= */

#index03 .cpt-item .img-wrap .stock-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: opacity 0.4s ease;
}

/* 1枚目 */
#index03 .cpt-item .img-wrap .stock-img.is-first {
  opacity: 1;
  z-index: 1;
}

/* 2枚目 */
#index03 .cpt-item .img-wrap .stock-img.is-second {
  opacity: 0;
  z-index: 2;
}

/* =========================
   PC：2枚目がある場合のみ hover 切替
   ========================= */

@media (hover: hover) and (pointer: fine) {
  #index03
  .cpt-item
  .img-wrap:has(.stock-img.is-second):hover
  .stock-img.is-first {
    opacity: 0;
  }

  #index03
  .cpt-item
  .img-wrap:has(.stock-img.is-second):hover
  .stock-img.is-second {
    opacity: 1;
  }
}

/* 切替可能なときだけカーソル変更 */
#index03
.cpt-item
.img-wrap:has(.stock-img.is-second) {
}

/* =========================
   チェック画像（新着・商談中・売り切れ）
   ========================= */

#index03 .cpt-item span.check {
  width: 27%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 15;
}

/* =========================
   テキスト
   ========================= */

#index03 .cpt-item .text {
  padding: 1.5rem 0 0.5rem 0;
  font-weight: 600;
  letter-spacing: 0.2rem;
}

#index03 .cpt-item .text h3 {
  font-size: clamp(15px, 1.4vw, 16px);
}

#index03 .cpt-item .text_detail {
	margin-bottom:1.5rem;
}

#index03 .cpt-item .text_detail ul li {
  margin: 0 0 0.5rem 0;
  font-size: clamp(15px, 1.2vw, 16px);
  font-weight: 600;
  letter-spacing: 0.2rem;
}

#index03 .cpt-item .text_detail ul li.size {
  margin-bottom: 0;
  letter-spacing: 0.1rem;
}

#index03 .cpt-item .text_detail ul li span {
  font-size: clamp(16px, 1.4vw, 18px);
  font-weight: normal;
}

.contact_btn_stock {
	text-align:center;
}

.contact_btn_stock a {
	position: relative;
	padding:1rem 3rem;
	text-align:center;
	display:inline-block;
	border:1px solid #f76a0c;
	color:#f76a0c;
	border-radius:6rem;
	font-size:clamp(14px, 1.1vw, 15px);
	overflow:hidden;
	z-index:0;
	transition: color .3s ease;
}

/* 背景スライド用 */
.contact_btn_stock a::before {
	content:"";
	position:absolute;
	top:0;
	left:-100%;
	width:100%;
	height:100%;
	background:#f76a0c;
	border-radius:inherit;
	transition:left .35s ease;
	z-index:-1;
}

/* hover */
.contact_btn_stock a:hover {
	color:#fff;
}

.contact_btn_stock a:hover::before {
	left:0;
}

#main #primary section#index03 .title_box01 .link_box .detail_btn01 {
	text-align:right;
}

#main #primary section#index03 .title_box01 .link_box .detail_btn01 a {
	background:#f76a0c;
	color:#fff;
	display:inline-block;
	margin-bottom:1rem;
	text-align:center;
	padding:1.75rem 10% 2rem;
	font-size:clamp(16px, 1.8vw, 22px);
	font-weight:600;
	border-radius:6rem;
	position:relative;
	line-height:1;
	overflow:hidden;      /* ←必須 */
}

/* ========= ツヤ演出（hover用） ========= */
#main #primary section#index03 .title_box01 .link_box .detail_btn01 a::before {
	content:"";
	position:absolute;
	top:0;
	left:-120%;
	width:120%;
	height:100%;
	background:linear-gradient(
		120deg,
		transparent,
		rgba(255,255,255,.45),
		transparent
	);
	transition:left .5s ease;
	border-radius:inherit;
	pointer-events:none;
	z-index:1;
}

#main #primary section#index03 .title_box01 .link_box .detail_btn01 a:hover::before {
	left:100%;
}

#main #primary section#index03 .title_box01 .link_box .detail_btn01 a::after {
	content:url(../../images/icon_arrow02.svg);
	position:absolute;
	right:6%;
	top:50%;
	transform:translateY(-50%);
	display:inline-block;
	z-index:2; /* ←必ず最前面 */
}


#main #primary section#index03 .title_box01 .link_box {
	text-align:right;
	font-size:clamp(12px, 1.2vw, 14px);
	font-weight:600;
	width:64%;
}

/* =========================
   SP
   ========================= */

@media (max-width: 980px) {
#index03 .cpt-list {
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 1rem;
}

#index03 .cpt-item .text {
    display: inherit;
  }
.contact_btn_stock a {
	padding:1rem 1.5rem;
}

#main #primary section#index03 .title_box01 .link_box .detail_btn01 a::after {
	scale:0.7;
	top: 45%;
	transform: translateY(-45%);
	-webkit- transform: translateY(-45%);
}

}

@media (max-width: 680px) {
#index03 .cpt-list {
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
}

#main #primary section#index03 .title_box01 .link_box .detail_btn01 a {
	padding: 1.5rem 20% 1.75rem 20%;
}

#main #primary section#index03 .title_box01 .link_box p {
	font-size:12px;
	letter-spacing:0;
}

#index03 .cpt-item {
  margin-bottom: 3rem;
}

}

@media (max-width: 480px) {
#main #primary section#index03 {
	padding-top:6rem;
	padding-bottom:3rem;
}


#index03 .cpt-list {
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
}
}


#main #primary section#index04 {
	background:#f2f1ed;
	padding-top:0;
}

#index04 .title_box02 {
	position:relative;
	background:url(../../images/index/index04_title_bg.jpg) no-repeat center center;
	background-size:cover;
	background-attachment:fixed;
	padding:10rem 0;
	margin-bottom: 7.5%;
}

#index04 .title_box02 h2.index_title03 {
	position:relative;
	top:19.5rem;
	text-align:center;
}

#index04 .slick_box {
	margin-bottom:9rem;
}

#index04 .slick-list {
	overflow:inherit;
}

#index04 .slick-slide:nth-child(2n) {
	position:relative;
	top:6rem;
}

#index04 .slick-slide .slick_item {
	padding:3rem;
}

#index04 .slick-slide .slick_item a {
	display:block;
	position:relative;
}

#index04 .slick-slide .img-wrap {
	aspect-ratio: 1 / 1;
	overflow: hidden;
}

#index04 .slick-slide .img-wrap img {
	object-fit: cover;
	width: 100%;
	height: 100%;
    display: block;
    transition: transform 0.4s ease;
}

/* ホバーでズーム */
#index04 .slick-slide a:hover img {
    transform: scale(1.05);
}

/* テキストエリア（初期非表示） */
#index04 .slick-slide a .text {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 2rem;
    background: linear-gradient(
        to top,
        rgba(0,0,0,0.7),
        rgba(0,0,0,0) 60%
    );
    color: #fff;
    opacity: 0;
    transition: opacity 0.3s ease;
}

/* ホバー時に表示 */
#index04 .slick-slide a:hover .text {
    opacity: 1;
}

#index04 .slick-slide a .text h3 {  
	font-size: clamp(14px, 1.2vw, 16px);
	line-height: 1.4;
	margin: 0;
}

#index04 .detail_btn02 {
	text-align:center;
}

#index04 .detail_btn02 a {
	color:#f76a0c;
	border:1px solid #f76a0c;
	display:inline-block;
	text-align:center;
	padding:2.25rem 11rem 2.5rem 11rem;
	font-size:clamp(16px, 1.8vw, 22px);
	font-weight:600;
	border-radius:6rem;
	line-height:1;
	position:relative;
	transition:all .3s ease;
}

#index04 .detail_btn02 a::after {
	content:url(../../images/icon_arrow03.svg);
	position:absolute;
	right:3rem;
	top:50%;
	transform:translateY(-50%);
	transition:all .3s ease;
}

#index04 .detail_btn02 a:hover {
	box-shadow:inset 0 0 0 1.5px #f76a0c;
}

#index04 .detail_btn02 a:hover::after {
	right:2.3rem;
}

@media (max-width: 1280px) {
#index04 .title_box02 h2.index_title03 {
	top:18.5rem;
}
}

@media (max-width: 980px) {
#index04 .title_box02 {
	margin-bottom: 15%;
}

#index04 .title_box02 h2.index_title03 {
}

#index04 .slick_box {
	margin-bottom:3rem;
}

#index04 .slick-slide:nth-child(2n) {
  top: 0;
}
}

@media (max-width: 680px) {
#index04 .slick-slide .slick_item {
	padding:1.5rem;
}

#index04 .detail_btn02 a {
  padding: 1.75rem 7.5rem 2rem 7.5rem;
}
}

@media (max-width: 480px) {
#index04 .title_box02 {
	margin-bottom: 24%;
}
}


#main #primary section#index05 {
	background:url(../../images/index/index05_bg.png) no-repeat right top;
	background-size:cover;
	background-attachment:fixed;
}

#index05 .title_box03 {
	margin-bottom:4.5rem;
}

#index05 .title_box03 p {
	font-size:clamp(13px, 1.1vw, 14px);
}

#index05 .title_box03 p a {
	color:#f76a0c;
}

#index05 .title_box03 p a:before {
	content:url(../../images/icon_arrow04.svg);
	margin-right:1rem;
}

#index05 ul {
	height:194px;
	overflow:auto;
}

#index05 ul li {
	border-bottom:1px solid #DDD;
}

#index05 ul li:first-child {
	border-top:1px solid #DDD;
}

#index05 ul li a {
	display:block;
	padding:2rem 12rem 2rem 4rem;
	background:#FFF;
	position:relative;
	
	display:flex;
	-webkit-flex-wrap: wrap; /* Safari */
	flex-wrap:         wrap;
	-webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
	align-items: center; /* 縦方向中央揃え */
	-webkit-justify-content: space-between;
	justify-content: space-between;
	transition: background-color 0.4s ease;
	
	color:#472e0b;
}

#index05 ul li a strong {
	font-family: "Arial", "Noto Sans JP", sans-serif;
	width: 74%;
	font-size: clamp(15px, 1.4vw, 18px);
}

#index05 ul li a:after {
	content:url(../../images/icon_arrow04.svg);
	right:4.5rem;
	/*中央*/
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	-webkit- transform: translateY(-50%);
	margin: auto;
	display:inline-block;
  transition: right 0.4s ease;
}

/* hover時 */
#index05 ul li a:hover {
  background: #FAFAFA; /* 少し濃い色 */
}

/* hover時：矢印を少し右へ */
#index05 ul li a:hover:after {
  right: 3.5rem;
}

#index05 ul li a span {
	width:26%;
}

#index05 ul li a span em.date-year {
	font-size:clamp(18px, 1.8vw, 24px);
	font-style:normal;
	margin-right:1.5rem;
}

#index05 ul li a span em.date-month-day {
	font-style:normal;
	font-size:clamp(24px, 3.6vw, 48px);
	margin-right:3rem;
	position:relative;
	top:2px;
}

@media (max-width: 980px) {
#index05 ul {
	height:194px;
	width:100%;
	overflow:auto;
}
}

@media (max-width: 680px) {
#main #primary section#index05 {
	padding-bottom:9rem;
}

#index05 .title_box01.w20 {
	width:100%;
	position:relative;
}

#index05 .title_box01.w20 p {
	position:absolute;
	right:0;
	top:0;
	z-index:1;
}

#index05 ul.w76 {
	width:100%;
}

#index05 ul li a {
    padding: 1.5rem 8rem 1.5rem 2rem;
}

#index05 ul li a span {
	width: 25%;
}

#index05 ul li a strong {
	width: 75%;
	line-height: 1.4;
}

#index05 ul li a::after {
	right: 1.5rem;
}

/* hover時：矢印を少し右へ */
#index05 ul li a:hover:after {
  right: 1rem;
}

}

#main #primary section#index06 {
	background:url(../../images/index/insta_bg.png) no-repeat #f76a0c right top;
	background-size:cover;
	background-attachment:fixed;
}


#index06 .index_title01 {
	border:none;
	padding-bottom:0;
	margin-bottom:6rem;
}

@media (max-width: 980px) {
#main #primary section#index01 {background:url(../../images/index/index01_bg_sp.jpg) no-repeat center center;}
#main #primary section#index02 {background:url(../../images/index/index02_bg_sp.jpg) no-repeat center center;}
#index04 .title_box02 {background:url(../../images/index/index04_title_bg_sp.jpg) no-repeat center; background-size:cover;}
#main #primary section#index05 {background:url(../../images/index/index05_bg_sp.png) no-repeat right center; background-size:cover;}
#main #primary section#index06 {background:url(../../images/index/insta_bg_sp.png) #f76a0c no-repeat center center; background-size:cover;}
.cd-fixed-bg {
    position: relative;
    min-height: 100%;
    background-size: cover;
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-position: center center;
    z-index: 2;
  }
}

@media (max-width: 1200px){
}

@media (max-width: 980px){
}

@media (max-width: 680px){
}

@media (max-width: 480px){
}