
:root{
	--s20:clamp(15px, calc(20 / 1100 * 100vw), 20px);
	--s30:clamp(20px, calc(30 / 1100 * 100vw), 30px);
	--s40:clamp(30px, calc(40 / 1100 * 100vw), 40px);
	--s50:clamp(30px, calc(50 / 1100 * 100vw), 50px);
	--s60:clamp(40px, calc(60 / 1100 * 100vw), 60px);
	--s80:clamp(60px, calc(80 / 1100 * 100vw), 80px);
	--s100:clamp(80px, calc(100 / 1100 * 100vw), 100px);
	--s120:clamp(100px, calc(120 / 1100 * 100vw), 120px);
}

#shiga{
overflow: hidden;
font-size: clamp(14px, calc(16 / 1100 * 100vw), 16px);
font-weight: bold;
color: #121212;
line-height: 2.1;
letter-spacing: 0;
}
#shiga .inner {
  position: relative;
  width: 100%;
  max-width: 1100px;
  margin: 0 auto;
}
#shiga a:hover{
opacity: .7;
letter-spacing: 0;
}
#shiga .mv{
	background: #E8EAE9;
}
#shiga .mv img{
	display: block;	
}
#shiga h1{
font-size: clamp(20px, calc(24 / 1100 * 100vw), 24px);
line-height: 1.95;
margin-top: var(--s60);
margin-bottom: var(--s50);
}
#shiga h2{
font-size: var(--s40);
margin-top: var(--s120);
margin-bottom: var(--s80);
border-bottom: 3px solid #000;
}
#shiga h3{
font-size: var(--s20);
margin-bottom: var(--s50);
border: 1px solid #000;
padding: .5em 2em;
text-align: center;
}
#shiga h4{
font-size: clamp(14px, calc(19 / 1100 * 100vw), 19px);
margin-top: var(--s100);
margin-bottom: var(--s60);
border-bottom: 2px solid #000;
padding: .5em 0;
font-weight: bold;
}
#shiga .flex{
display: flex;
align-items: center;
}
#shiga .flex2{
display: flex;
}
#shiga .flex .flex-text-l>*{
margin-right: var(--s100);
}
#shiga .flex .flex-text-r>*,
#shiga .flex2 .flex-text-r>*{
margin-left: var(--s100);
}
#shiga .flex>*,
#shiga .flex2>*{
flex: 1;
}

.bg1{
	background: #F1F1F1;
	padding: var(--s60) 0;
	
}
.bg1 img{
	display: block;
}
#shiga .feature1 h3{
	display: inline-block;
}
#shiga .feature2-img{
	padding: var(--s60);
}
@media screen and (max-width:768px) {
  #shiga .feature2 .mt30{
    padding: 0 var(--s60);
  }
}


#shiga .slider-wrapper {
  width: 100%;
  margin: 0 auto;
  text-align: center;
}

#shiga .slider3d {
  width: 100%;
  padding-bottom: 40px;
}

#shiga .slider3d .swiper-slide {
  transition: transform 0.6s, opacity 0.6s;
  transform: scale(0.8);
  opacity: 0.5;
}

#shiga .slider3d .swiper-slide-active {
  transform: scale(1);
  opacity: 1;
  z-index: 2;
}

#shiga .swiper-slide img {
  width: 100%;
  height: auto;
  display: block;
}

#shiga .slider-text {
  max-width: 630px;
  margin: auto;
  text-align: left;
  min-height: 9.6875em;
}
#shiga .slider-title {
  font-size: 1.125em;
}
#shiga .slider-caption {
  font-size: .875em;
}

#shiga .swiper-button-prev,
#shiga .swiper-button-next {
	width: 4em;
	height: 4em;
}
#shiga .swiper-button-prev{
	left: 14%;
}
#shiga .swiper-button-next{
	right: 14%;
}
#shiga .swiper-button-prev::after,
#shiga .swiper-button-next::after {
    background: url(/img/b/product/shiga/slide-arrow.png)no-repeat center;
	background-size: contain;
	filter: none;
}
/* フェード演出用 */
.fade {
  opacity: 0;
}
@media (min-width: 769px) {
  #shiga .flex-col3 .swiper-button-prev,
  #shiga .flex-col3 .swiper-button-next{
    display: none;
  }
  .flex-col3 .swiper-wrapper {
    transform: none !important;
    width: auto !important;
    display: flex;
    gap: 1em;
    padding: 0 var(--s60);
  }
  .flex-col3 .swiper-slide {
    width: auto !important;
    margin-right: 0 !important;
    flex-shrink: 0 !important;
    flex: 1;
  }
}

#shiga .select-btn{
	display: flex;
	justify-content: center;
}
#shiga .select-btn a{
	border: 3px solid;
	padding: .5em 1.5em .5em 2.5em;
	display: inline-block;
	margin-top: var(--s20);
	font-size: .875em;
  min-width: 257px;
  text-align: center;
}

#shiga .select-btn a:after{
	content: "";
	display: inline-block;
	width: 5.5px;
	height: 9.5px;
	background: url(/img/b/product/shiga/btn-arrow.png)no-repeat center right;
	background-size: contain;
	padding-left: 2em;
}
#shiga .select-btn-bottom{
	font-size: .875em;
  text-align: center;
  margin-top: 1em;
}
#shiga .product-code{
	font-size: .875em;
  font-weight: normal;
  line-height: 1.5;
  padding-left: 2em;
}
#shiga .salon h4{
	margin-bottom: var(--s40);
	margin-top: 0;
}
#shiga .salon .select-list{
	font-weight: normal;
	font-size: .875em;
}
#shiga .salon .salon-btn{
	background: #575757;
	color: #fff;
	padding: 1em 2em;
	display: flex;
    align-items: center;
    justify-content: left;
    max-width: max-content;
}
#shiga .salon .salon-btn::after{
	content: "";
	display: inline-block;
	width: 9px;
	height: 16px;
	background: url(/img/b/product/shiga/btn-arrow2.png)no-repeat center right;
	background-size: contain;
	padding-left: 2em;
}
.tab-container {
  width: 100%;
  text-align: center;
}

.tab-buttons {
  display: flex;
  align-items: end;
}

.tab-buttons button {
  border: none;
  cursor: pointer;
  font-size: .75em;
  transition: all 0.2s;
  background: none;
  padding: var(--s30) .625em;
}
.tab-buttons button:hover {
  opacity: .7;
}
.tab-buttons button img{
  display: block;
  transition: all 0.2s;
}

.tab-buttons button.active {
  background: #F1F1F1;
}
.tab-buttons button.active img{
  mix-blend-mode: multiply;
}
.tab-contents{
	background: #F1F1F1;
	padding: var(--s40) 0;
}
.tab-content {
  display: none;
  text-align: center;
}

.tab-content.active {
  display: block;
}

.tab-content .tab-img-wrap {
  width: 100%;
  height: auto;
  background: #fff;
  padding: var(--s30);
}
.tab-content .tab-img-wrap2 {
  width: 100%;
  height: auto;
  background: #fff;
  padding: 0 var(--s30);
}
.tab-content img{
  max-width: 800px;
}
.tab-content .tab-txt {
  background: #E2E0D9;
  display: flex;
  padding: var(--s20);
  font-size: .875em;
  line-height: 1.2;
  gap: 5px;
}
.tab-content .tab-txt>* {
  flex: 1;
  background: #FFF;
  border: 1px solid #C3C1BD;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: .5em 0;
}
.tab-content .tab-txt>*:nth-child(even) {
  background: #F6F5F3;
}
.txt-red{color: #DE0000;}
#shiga .mt20{margin-top: var(--s20)}
#shiga .mt30{margin-top: var(--s30)}
#shiga .mt40{margin-top: var(--s40)}
#shiga .mt50{margin-top: var(--s50)}
#shiga .mt60{margin-top: var(--s60)}
#shiga .mt80{margin-top: var(--s80)}
#shiga .mt100{margin-top: var(--s100)}
#shiga .mt120{margin-top: var(--s120)}

@media screen and (max-width:768px) {
:root{
	--s80:clamp(30px, calc(40 / 390 * 100vw), 40px);
	--s100: clamp(50px, calc(60 / 390 * 100vw), 60px);
	--s120:clamp(50px, calc(60 / 390 * 100vw), 60px);
	--s20sp:clamp(15px, calc(20 / 390 * 100vw), 20px);
	--s30sp:clamp(25px, calc(30 / 390 * 100vw), 30px);
	--s40sp:clamp(35px, calc(40 / 390 * 100vw), 40px);
}
.sp-none{display: none!important;}
#shiga{
font-size: clamp(9px, calc(14 / 390 * 100vw), 14px);
}
#shiga .inner {
  width: 100%;
  padding: 0 var(--s20sp);
}
#shiga h1 {
    padding: 0;
	font-size: clamp(17px, calc(22 / 390 * 100vw), 22px);
}
#shiga h2 {
    background: none;
	padding: 0;
	font-size: clamp(25px, calc(30 / 390 * 100vw), 30px);
}
#shiga h3 {
	font-size: clamp(13px, calc(18 / 390 * 100vw), 18px);
	padding: .5em;
}
#shiga h4 {
	font-size: clamp(11px, calc(16 / 390 * 100vw), 16px);
}
#shiga .feature1 h3 {
    display: block;
}
#shiga .mv .inner{
    padding: 0;
}
#shiga .flex,
#shiga .flex2{
    display: block;
}
#shiga .flex .flex-text-l>*{
    margin-right: 0;
}
#shiga .flex .flex-text-r>*,
#shiga .flex2 .flex-text-r>*{
    margin-left: 0;
}
#shiga .img-scroll2{
    overflow: scroll;
}
#shiga .img-scroll2 img{
    max-width: 1000px;
}
#shiga .feature2-img {
    padding: 0 0 var(--s80);
}
#shiga .salon .salon-btn{
	font-size: clamp(11px, calc(16 / 390 * 100vw), 16px);
	display: block;
  min-width: 100%;
}
#shiga .flex-col3{
	padding: 0;
}

#shiga .select-btn-bottom{
  margin-top: .5em;
}
#shiga .select-btn a{
	font-size: 1em;
  min-width: inherit;
  width: 100%;
  max-width: 300px;
}
#shiga .product-code{
	margin-top: .5em;
  min-height: 51px;
  padding-left: 0;
}
#shiga .slider3d{
 width: 100vw;
 left: 50%;
 transform: translateX(-50%);
 padding-bottom: 1em;
}
#shiga .swiper-button-prev, #shiga .swiper-button-next {
    width: 3em;
    height: 3em;
	margin-top: -2em;
}
#shiga .swiper-button-prev {
	left: 8%;
}
#shiga .swiper-button-next {
	right: 8%;
}
#shiga .slider-text{
	max-width:21em;
	min-height: 13.5em;
}
#shiga .flex-col3{
	position: relative;
}
#shiga .flex-col3 .swiper-slide{
	max-width:200px;
  width: 75%;
}
#shiga .flex-col3 .swiper-button-prev{
  top: .5em;
  right: 3.5em;
  left: auto;
}
#shiga .flex-col3 .swiper-button-next{
 top: .5em;
 right: 0;
}
#shiga .bg2{
	position: relative;
	z-index: 1;
	padding: var(--s20sp) 0;
}
#shiga .bg2::after{
	content: "";
	display: block;
	position: absolute;
	width: 100vw;
	height: 100%;
	background: #F1F1F1;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	z-index: -1;
}
.tab-buttons {
    overflow: scroll;
}
.tab-buttons button{
	min-width: 140px;
}
.tab-content .tab-img-wrap,
.tab-content .tab-img-wrap2{
	padding: 1em;
}
.tab-content .tab-img-wrap img,
.tab-content .tab-img-wrap2 img{
	max-width: 100%;
}
.tab-content .tab-txt {
	flex-wrap: wrap;
}
.tab-content .tab-txt>* {
    flex: none;
    width: calc(50% - 2.5px);
	min-height: 60px;
}
#shiga .mt20sp{margin-top: var(--s20sp)}
#shiga .mt30sp{margin-top: var(--s30sp)}
}
@media screen and (min-width:767px) {
.pc-none{display: none!important;}
}

.fixed-button {
  position: fixed;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: 999;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.5s ease;
  width: 100%;
  background: #ffffffa3;
}
.fixed-button a{
  max-width: 300px;
	display: block;
	margin: 1.5em auto;
}
.fixed-button.show {
  opacity: 1;
  pointer-events: auto;
}
@media screen and (min-width:767px) {
.fixed-button a{
  max-width: 300px;
	margin: 1em auto;
}
.no_info_{
	margin-top: 53px;
}
}
.fixed-button {
  display: none;
}
.fixed-button.show {
  display: block;
}