@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Crimson+Text&family=Overpass:wght@500&family=Zen+Old+Mincho&display=swap');
.wrapper	{ overflow-x: hidden; }
#contents	{ width: 100%!important; max-width: 100%!important; padding: 0; }
#pisss	{ width: 100%!important; max-width: 100%!important; }
#pi	{ width: 100%!important; max-width: 100%!important; margin: 0 0 40px; background-color: #fff!important; padding: 0; }
#pi > img	{ display: none!important; }
picture	{ width: 100%; vertical-align: bottom; line-height: 1;  }
@media (min-width: 768px)	{
	.bread	{ margin-bottom: 8px!important; max-width: 980px; margin: 0 auto; }
	.bread ul, .bread ol { margin: 0 auto; }
	.section_common {  margin-left: 0!important; width: 100%; }
	.related_styling_list { justify-content: center; }
}
.bannerSwitch	{ width: 100%; margin: 0 auto; }
.bannerSwitch img	{ width: 100%; vertical-align: bottom; line-height: 0; }
.product_list	{ background-color: #fff; }
.pi_description	{ background-color: transparent!important; margin: 0 auto; min-width: 980px; max-width: 100%; padding: 0; }
.pi_lgzformat	{ color:#fff; display: block; width: 100%; padding: 0; margin: 0 0 100px; position: relative; font-feature-settings: "palt"; -webkit-text-size-adjust:100%; color:#000; -webkit-font-smoothing: antialiased; background-color: #000;}
.pi_lgzformat	{ font-family: 'Crimson Text', 'Zen Old Mincho', serif!important; font-size:14px; font-weight: 400; line-height:1.75; -webkit-text-size-adjust:100%; color:#000000; -webkit-font-smoothing: antialiased; letter-spacing:0; }
.pi_lgzformat ul:before,
.pi_lgzformat ol:before,
.pi_lgzformat dl:before, 
.pi_lgzformat ul:after, 
.pi_lgzformat ol:after, 
.pi_lgzformat dl:after	{ display: none!important; }
.pi_lgzformat img	{ width: 100%; vertical-align: bottom; line-height: 0; }
.pi_lgzformat a { transition: all .3s; color:#000000; }
.pi_lgzformat .small { font-size:80%; }
.pi_lgzformat .center-text	{ text-align: center; }
@media (max-width: 767.9px) {
	#pi { padding: 0 ; }
	.pi_description	{ padding: 0; min-width: auto; }
}

@media (min-width: 768px) {
	.pi_lgzformat.bg01::after	{ content:""; width: 100%; height: 100%; position: absolute; top: 0; bottom: 0; right: 0; left: 0; background: url(bgpc01.jpg) center right / cover no-repeat; opacity: .5; }
	.pi_lgzformat.bg02::after	{ content:""; width: 100%; height: 100%; position: absolute; top: 0; bottom: 0; right: 0; left: 0; background: url(bgpc02.jpg) center right / cover no-repeat; opacity: .5; }
}

/* ------------ LOOP ------------- */
@keyframes scroll-left {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-100%);
  }
}
.looparea	{ width: 100%; overflow: hidden; display: -webkit-flex; display: flex; }
.looparea > ul	{ width: 130%; list-style-type: none; display: -webkit-flex; display: flex; justify-content: space-between; }
.looparea > ul > li	{ width: calc(100vw / 5); padding: 20px 0 20px 20px; }
.looparea > ul	{ animation :scroll-left 50s infinite linear 0.5s both; }
@media (max-width: 1200px) {
	.looparea > ul	{ width: 160%; }
	.looparea > ul > li	{ width: calc(100vw / 4); }
	.looparea > ul	{ animation :scroll-left 40s infinite linear 0.5s both; }
}
@media (max-width: 767.9px) {
	.looparea > ul	{ width: 300%; }
	.looparea > ul > li	{ width: calc(100vw / 2); }
	.looparea > ul	{ animation :scroll-left 30s infinite linear 0.5s both; }
}

/* ------------ TAB ------------- */
.tabarea	{ display: -webkit-flex; display: flex; justify-content: center; width: 100%; position: relative; margin: 0 0 60px; z-index: 4; }
.tabarea::before	{ content:""; height: 1px; width: 100%; background-color: #707070; position: absolute; bottom: 0; left: 0; right: 0; z-index: 3;  }
.tabst	{ border-radius: 5px 5px 0 0; padding: 0; border: 0 solid #707070; border-bottom: 1px solid #707070; background-color: #707070; width: 100%; max-width: 300px; margin: 0 10px; display: -webkit-flex; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: all .3s; z-index: 4; }
.tabst > span	{ color:#fff; padding: 16px 10px 12px; font-size: clamp(18px, 22px, 1.8vw); font-family: 'Crimson Text', 'Zen Old Mincho', serif!important; font-weight: 400; transition: all .3s; }
.tabst.active	{ cursor: auto; color:#c0c0c0; border: 1px solid #707070; border-bottom: 1px solid #000; background-color: #000; }
.tabst.active > span	{ color:#c0c0c0; }
.tabcontents_wrapper	{ position: relative; overflow: hidden; padding: 0; }
.tabcontents01	{ opacity: 0; position: absolute; left: 120vw; right: -120vw; }
.tabcontents02	{ opacity: 0; position: absolute; left: 120vw; right: -120vw; }
.tabcontents01.active	{ opacity: 1; position: static; left: 0; right: 0; }
.tabcontents02.active	{ opacity: 1; position: static; left: 0; right: 0; }
@media (min-width: 768px) {
	.tabst:hover	{ background-color: #585858; }
	.tabst.active:hover	{ background-color: #000; }
}
@media (max-width: 767.9px) {
	.tabarea	{ padding: 0 10px; margin: 0 0 40px; }
	.tabst	{ margin: 0 4px; }
	.tabst > span	{ padding: 15px 10px 13px; font-size: 14px; }
	.tabcontents_wrapper	{ padding: 0; }
}

/* ------------ INTRODUCTION ------------- */
.introduction	{ text-align: center; padding: 60px 0; margin: 0; display: -webkit-flex; display: flex; flex-direction: column; align-items: center; justify-content: center; position: relative; z-index: 2; }
.introduction > strong	{ padding: 0; margin: 0 auto 40px; color:#000; font-size: 42px; line-height: 1; text-align: center; }
.introduction > h2	{ width: 100%; padding: 0; margin: 0 auto 23px; color:#000; font-size: 24px; line-height: 1; text-align: left; }
.introduction > p	{ width: 100%; padding: 0; margin: 0 auto; color:#fff; font-size: clamp(16px, 22px, 1.2vw); line-height: 2; text-align: center; }
@media (min-width: 768px) {
	.introduction > ul li a:hover	{ color:#fff; background-color: #000; opacity: 1!important; }
}
@media (max-width: 767.9px) {
	.introduction	{ padding: 20px 15px; margin: 0; }
	.introduction > strong	{ margin: 0 auto 20px; font-size: 16px; }
	.introduction > h2	{ font-size: clamp(20px, 30px, 7.5vw); padding: 0; margin: 0 auto 30px; }
	.introduction > p	{  font-size: 14px; font-size: clamp(14px, 18px, 4vw); line-height: 1.8; margin: 0 auto 20px; text-align: left; }
}

/* ------------ PRODUCT ------------- */
.product_wrapper	{ width: 100%; display: -webkit-flex; display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 0 10%; position: relative; z-index: 2; }
.productdetailset	{ width: 100%; display: -webkit-flex; display: flex; flex-direction: column; justify-content: center; align-items: center; margin: 0 0 40px; }
.prdtt	{ width: 100%; display: block; position: relative; margin: 0 0 40px; color:#707070; font-size: clamp(20px, 28px, 2vw); line-height: 1; font-family: 'Overpass', sans-serif; font-weight: 500; padding: 0 0 5px; border-bottom: 1px solid #707070;  }
.spitemimges	{ display: block; width: 100%; padding: 0 2% 20px; position: relative; z-index: 3; }
.spitemimges .slick-list	{ border: 1px solid #fff; }
.prdset	{ display: -webkit-flex; display: flex; flex-wrap: wrap; justify-content: space-between; list-style-type: none;  margin: 0 5% 40px; max-width: 1100px; position: relative; z-index: 3; }
.prdset > li	{ width: calc(50% - 20px); padding: 0; margin: 0 0 40px; border: 1px solid #fff; background-color: rgba(0,0,0,1);}
.prdset > li > a	{ opacity: 1; transition: all .3s; }
.prdset.reflect > li:nth-child(1)	{ order:1; }
.prdset.reflect > li:nth-child(2)	{ order:2; }
.prdset.reflect > li:nth-child(3)	{ order:4; }
.prdset.reflect > li:nth-child(4)	{ order:3; }
.prdset > li:last-child	{ display: -webkit-flex; display: flex; align-items: center; justify-content: center; background-color: rgba(0,0,0,.4); }
.prdtext	{ color:#fff; font-family: 'Crimson Text', 'Zen Old Mincho', serif!important; display: -webkit-flex; display: flex; flex-direction: column; align-items: flex-start; padding: 0 3%; }
.prdtext > h3	{ font-size: clamp(22px, 33px, 2.6vw); line-height: 1.2; margin: 0 0 5px; }
.prdtext > strong	{ font-size: clamp(16px, 26px, 2vw); line-height: 1.5; font-weight: 400; margin: 0 0 30px; }
.prdtext > strong span	{ font-size: clamp(13px, 18px, 1.4vw); }
.prdtext > p	{ font-size: clamp(12px, 16px, 1.1vw); line-height: 1.6; margin: 0 0 30px; }
.prdtext > b	{ display: -webkit-flex; display: flex; flex-direction: column; align-items: flex-start; }
.prdtext > b > a	{ color:#fff; font-family: 'Crimson Text', 'Zen Old Mincho', serif!important; font-size: clamp(18px, 24px, 1.8vw); line-height: 1; font-weight: 400; letter-spacing:.04rem; margin: 0 0 20px; position: relative; z-index: 2; transition: all .3s; }
.prdtext > b > a span	{ font-size: clamp(14px, 18px, 1.4vw); letter-spacing:0; }
.prdtext > b > a::before	{ position: absolute; content:""; width: 100%; height: 1px; bottom: 0; left: 0; right: 0; background-color: #fff; transition: all .5s; }
.prdtext > b > a:hover	{ text-decoration: none!important; }
@media (min-width: 1400px) {
	.prdset > li:last-child	{ padding: 0 4%; }
}
@media (min-width: 768px) {
	.spitemimges	{ display: none; }
	.prdset > li > a:hover	{ opacity: .6; }
	.prdtext > b > a:hover	{ text-decoration: none!important; color:#666; }
	.prdtext > b > a:hover::before	{ background-color: #666; }
}
@media (min-width: 768px) {
	.spitemimges	{ display: none; }
	.prdset > li > a:hover	{ opacity: .6; }
	.prdtext > b > a:hover	{ text-decoration: none!important; color:#666; }
	.prdtext > b > a:hover::before	{ background-color: #666; }
}
@media (max-width: 1170px) {
	.product_wrapper	{ padding: 0 5%; }
	.prdset	{ margin: 0 2% 40px; }
	.prdset > li	{ width: calc(50% - 10px); margin: 0 0 20px; background-color: rgba(0,0,0,0);}
	.prdtext > h3	{ margin: 0; }
	.prdtext > strong	{ margin: 0 0 15px; }
	.prdtext > p	{ margin: 0 0 15px; }
	.prdtext > b > a	{ margin: 0 0 10px; }
}
@media (max-width: 767.9px) {
	.product_wrapper	{ padding: 0; }
	.productdetailset	{ margin: 0; padding: 0 4% 20px; position: relative; }
	.prdset	{ margin: 0 2% 30px; }
	.prdset > li	{ display: none; }
	.prdset > li:last-child	{ display: -webkit-flex; display: flex; width: 100%; padding: 0; border: none; border: 0; background-color: rgba(0,0,0,0); }
	.prdtext > h3	{ font-size:20px; font-size: clamp(20px, 30px, 7vw); margin: 0 0 5px; }
	.prdtext > strong	{ font-size:16px; font-size: clamp(16px, 24px, 6vw); margin: 0 0 20px; }
	.prdtext > strong span	{ font-size:13px; font-size: clamp(13px, 18px, 4vw); }
	.prdtext > p	{ font-size:13px; font-size: clamp(13px, 18px, 4.3vw); margin: 0 0 30px; }
	.prdtext > b > a	{ font-size:16px; font-size: clamp(16px, 24px, 6vw); margin: 0 0 20px; }
	.prdtext > b > a span	{ font-size:14px; font-size: clamp(14px, 18px, 5vw); }
	.productdetailset.setbg01::after	{ content:""; width: 100%; height: 100%; position: absolute; top: 0; bottom: 0; right: 0; left: 0; background: url(bgsp01.jpg) bottom right / contain no-repeat; opacity: .4; z-index: 1; }
	.productdetailset.setbg02::after	{ content:""; width: 100%; height: 100%; position: absolute; top: 0; bottom: 0; right: 0; left: 0; background: url(bgsp02.jpg) bottom right / contain no-repeat; opacity: .4; z-index: 1; }
	.productdetailset.setbg03::after	{ content:""; width: 100%; height: 100%; position: absolute; top: 0; bottom: 0; right: 0; left: 0; background: url(bgsp03.jpg) bottom right / contain no-repeat; opacity: .4; z-index: 1; }
	.productdetailset.setbg04::after	{ content:""; width: 100%; height: 100%; position: absolute; top: 0; bottom: 0; right: 0; left: 0; background: url(bgsp04.jpg) bottom right / contain no-repeat; opacity: .4; z-index: 1; }
	.productdetailset.setbg05::after	{ content:""; width: 100%; height: 100%; position: absolute; top: 0; bottom: 0; right: 0; left: 0; background: url(bgsp05.jpg) bottom right / contain no-repeat; opacity: .4; z-index: 1; }
	.productdetailset.setbg06::after	{ content:""; width: 100%; height: 100%; position: absolute; top: 0; bottom: 0; right: 0; left: 0; background: url(bgsp06.jpg) bottom right / contain no-repeat; opacity: .4; z-index: 1; }
}



/* ------------ SLICK ------------- */
.slick-dots	{ display: -webkit-flex; display: flex; justify-content: flex-end; bottom: 0; padding: 0 4%; }
.slick-dots li	{ margin: 0; width: 18px; height: 15px; }
.slick-dots li button	{ padding: 0; width: 18px; height: 15px; }
.slick-dots li button::before	{ content:"●"; color:#fff; opacity: 1!important; line-height: 1!important; font-size: 14px; width: 18px; height: 15px; text-align: center; }
.slick-dots li.slick-active button:before	{ color:#666; opacity: 1!important; }
.slick-dotted.slick-slider	{ margin-bottom: 0; }


h3.subttle	{ width: 100%; padding: 0; margin: 0 0 98px; position: relative; z-index: 1; }
h3.subttle::before	{ content:""; position: absolute; top: 50%; width: 100%; height: 1px; background-color: #e5413e; }
h3.subttle > span	{ position: relative; color:#e5413e; font-size: 24px; line-height: 1; letter-spacing:-.05rem; padding: 0 8px; margin: 0 0 0 120px; background-color: #e6e6e1; z-index: 2; }
h3.subttle.black::before	{ background-color: #000; }
h3.subttle.black > span	{ color:#000; }
@media (max-width: 767.9px) {
	h3.subttle	{ margin: 0 0 50px; }
	h3.subttle::before	{ top: 48%; }
	h3.subttle > span	{ font-size: clamp(16px, 26px, 5.4vw); padding: 0 5px; margin: 0 0 0 15%; }
}

.item_wrapper	{ position: relative; width: 100%; display: -webkit-flex; display: flex; justify-content: space-between; align-items: flex-start; }
.item_mainimg	{ position: -webkit-sticky; position: sticky; top: 100px; left: 0; width: calc(46% - 30px); }
.item_mainimg_inner	{ width: 100%; position: relative; }
.mainpcimg	{ width: 100%; position: absolute; top: 0; left: 0; right: 0;  }
.item_lists	{ width: calc(54% - 30px); }
.item_lists_inner	{ width: 100%; padding: 0 0 60px; margin: 0; }
.item_lists_inner > ul	{ display: -webkit-flex; display: flex; list-style-type: none; width: 100%; justify-content: space-between; margin: 0 0 20px; padding: 60px 0 0; }
.item_lists_inner > ul > li	{ width: calc(33% - 18px); position: relative; display: -webkit-flex; display: flex; flex-direction: column; }
.item_lists_inner > ul > li:not(:last-child)::after	{ content:""; width: 1px; height: 100%; position: absolute; top: 0; bottom: 0; right: -16px; background-color: #000; }
.item_lists_inner.itliscate01 > ul > li:not(:last-child)::after	{ background-color: #427c72; }
.item_lists_inner.itliscate02 > ul > li:not(:last-child)::after	{ background-color: #cb6e41; }
.item_lists_inner.itliscate03 > ul > li:not(:last-child)::after	{ background-color: #40568f; }
.item_lists_inner.itliscate04 > ul > li:not(:last-child)::after	{ background-color: #cda020; }

.itemimges .slick-dots	{ display: -webkit-flex; display: flex; justify-content: flex-end; bottom: -20px; }
.itemimges .slick-dots li	{ margin: 0; width: 15px; height: 15px; }
.itemimges .slick-dots li button	{ padding: 0; width: 15px; height: 15px; }
.itemimges .slick-dots li button::before	{ content:"●"; color:#d5d5d5; opacity: 1!important; line-height: 1!important; font-family: 'Zen Old Mincho', serif!important; font-size: 8px; width: 15px; height: 15px; }
.itemimges .slick-dots li.slick-active button:before	{ color:#000; opacity: 1!important; }
.slick-dotted.slick-slider	{ margin-bottom: 25px; }

.itliscate01 .itemimges .slick-dots li.slick-active button:before	{ color:#427c72; }
.itliscate02 .itemimges .slick-dots li.slick-active button:before	{ color:#cb6e41; }
.itliscate03 .itemimges .slick-dots li.slick-active button:before	{ color:#40568f; }
.itliscate04 .itemimges .slick-dots li.slick-active button:before	{ color:#cda020; }


.itemtxt_wrapper	{ display: -webkit-flex; display: flex; flex-direction: column; justify-content: space-between; flex-grow:1; }
.itemtxt	{ width: 100%; font-family: 'Crimson Text', serif; font-size: clamp(13px, 16px, 1vw); line-height: 1.4!important; padding: 0; margin: 0 0 15px; }
.buybutton	{ width: 100%; display: -webkit-flex; display: flex; justify-content: flex-start; }
.buybutton > a	{ position: relative; overflow: hidden; padding: 0; margin: 0; border-radius: 50%; border: 1px solid #000; transition: all .3s; text-decoration: none; }
.buybutton > a::after	{ content:""; position: absolute; top: 0; bottom: 0; right: 0; left: 0; width: 100%; height: 100%; background-color: #000; transition: all .3s; transform: translateY(100%); }
.buybutton > a > span	{ color:#000; position: relative; z-index: 2; display: block; padding: 12px 14px 10px; font-family: 'Overpass', sans-serif; font-weight: 500; line-height: 1!important; font-size: clamp(11px, 15px, 1.1vw); transition: all .3s; }
@media (min-width: 768px) {
	.buybutton > a:hover	{ border: 1px solid #000; text-decoration: none!important; color:#fff; }
	.buybutton > a:hover > span	{ color:#fff; }
	.buybutton > a:hover::after	{ transform: translateY(0); }
	.itliscate01 .buybutton > a::after	{ background-color: #427c72; }
	.itliscate02 .buybutton > a::after	{ background-color: #cb6e41; }
	.itliscate03 .buybutton > a::after	{ background-color: #40568f; }
	.itliscate04 .buybutton > a::after	{ background-color: #cda020; }
}
.itliscate01 .buybutton > a	{ border: 1px solid #427c72; }
.itliscate02 .buybutton > a	{ border: 1px solid #cb6e41; }
.itliscate03 .buybutton > a	{ border: 1px solid #40568f; }
.itliscate04 .buybutton > a	{ border: 1px solid #cda020; }

h4.catettle	{ width: 100%; display: block; border-top: 1px solid #000; color:#000; margin: 0 0 60px; padding: 10px 0 0; font-family: 'Crimson Text', serif; font-size: clamp(16px, 24px, 1.8vw); line-height: 1!important; }
.itliscate01 h4.catettle	{ border-top: 1px solid #427c72; color:#427c72; }
.itliscate02 h4.catettle	{ border-top: 1px solid #cb6e41; color:#cb6e41; }
.itliscate03 h4.catettle	{ border-top: 1px solid #40568f; color:#40568f; }
.itliscate04 h4.catettle	{ border-top: 1px solid #cda020; color:#cda020; }
.item_lists_outer	{ display: none; }

@media (max-width: 767.9px) {
	.itemtxt	{ font-size: 14px; margin: 0 0 10px; }
	.buybutton > a > span	{ font-size: 13px; }
	.item_mainimg	{ display: none; }
	.item_lists	{ width: 100%; padding: 0; }
	.item_lists_inner	{ padding: 0 15px 0 20px; }
	.item_lists_inner > ul	{ flex-wrap: wrap; margin: 0 0 20px; padding: 20px 0 0; }
	.item_lists_inner > ul > li	{ width: 100%; border-left: 1px solid #000; padding: 0 0 0 15px; margin: 0 0 20px; }
	.item_lists_inner > ul > li:not(:last-child)::after	{ display: none; }
	.item_lists_outer	{ display: -webkit-flex; display: flex; flex-direction: column; width: 100%; position: relative; }
	.item_lists_outer > h4	{ position: absolute; bottom: 0; left: 0; right: 0; line-height: 1; width: 100%; padding: 0 0 0 20px; border: 1px solid #000; border-width: 1px 0; display: -webkit-flex; display: flex; }
	.item_lists_outer > h4 > span	{ width: 100%; height: 100%; line-height: 1; border: 1px solid #000; border-width: 0 0 0 1px; padding: 5px 0 4px 15px; font-size: 17px; }
	h4.catettle	{ display: none; }
	.slick-dotted.slick-slider	{ margin-bottom: 15px; }
	.item_lists_outer.cate01 > h4	{ border: 1px solid #427c72; border-width: 1px 0; }
	.item_lists_outer.cate01 > h4 > span	{ color:#427c72; border: 1px solid #427c72; border-width: 0 0 0 1px; }
	.item_lists_outer.cate02 > h4	{ border: 1px solid #cb6e41; border-width: 1px 0; }
	.item_lists_outer.cate02 > h4 > span	{ color:#cb6e41; border: 1px solid #cb6e41; border-width: 0 0 0 1px; }
	.item_lists_outer.cate03 > h4	{ border: 1px solid #40568f; border-width: 1px 0; }
	.item_lists_outer.cate03 > h4 > span	{ color:#40568f; border: 1px solid #40568f; border-width: 0 0 0 1px; }
	.item_lists_outer.cate04 > h4	{ border: 1px solid #cda020; border-width: 1px 0; }
	.item_lists_outer.cate04 > h4 > span	{ color:#cda020; border: 1px solid #cda020; border-width: 0 0 0 1px; }
	.item_lists_inner.itliscate01 > ul > li	{ border-left: 1px solid #427c72; }
	.item_lists_inner.itliscate02 > ul > li	{ border-left: 1px solid #cb6e41; }
	.item_lists_inner.itliscate03 > ul > li	{ border-left: 1px solid #40568f; }
	.item_lists_inner.itliscate04 > ul > li	{ border-left: 1px solid #cda020; }
}

.lastcredit	{ width: 100%; display: -webkit-flex; display: flex; justify-content: flex-end; }
.lastcredit > p	{ font-family: 'Crimson Text', serif; font-size: clamp(13px, 16px, 1vw); line-height: 1.6!important; padding: 0; margin: 0; }
@media (max-width: 767.9px) {
	.lastcredit	{ justify-content: flex-start; padding: 0 20px;  }
	.lastcredit > p	{ font-size: 14px; }
}

/* ------------ BLOCK ------------- */
@media (max-width: 767.9px)	{ .pconly { display: none!important; } }
@media (min-width: 768px)	{ .pconly { display: inline-block; } }
@media (max-width: 767.9px)	{ .sponly { display: inline-block; } }
@media (min-width: 768px)	{ .sponly { display: none!important; } }


