/**************************************
featureListSection
**************************************/
#featureListSection{
  display: block;
  padding: 0 1rem 0;
}

#featureListSection .sectionTTL{
  display: block;
  margin-bottom: 4rem;
  font-family: var(--font-title);
  font-size: 2.5rem;
  letter-spacing: 0.05em;
  font-weight: 500;
  line-height: 1.44;
  color: #2B100F;
  text-align: center;
}

#featureListSection .sectionTTL > span{
  display: block;
  text-align: center;
  margin: 0 auto;
  opacity: 1;
  transition: opacity .4s ease 0.4s;
}

#featureListSection .sectionTTL.view > span{
}

#featureListSection .sectionTTL::before{
  content: '';
  display: block;
  width: 10rem;
  height: 2.532rem;
  margin: 0 auto 1rem;
  background: url("../img/common/icon_secttl.svg") center top no-repeat;
  background-size: 100% auto;
  /*
  -webkit-clip-path: inset(0 0 100% 0);
  clip-path: inset(0 0 100% 0);
  transition: clip-path .6s ease,opacity .4s ease;
  */
}

#featureListSection > .featureList > ul{
  display: block;
}

#featureListSection > .featureList > ul > li{
  display: block;
  width: 100%;
}
#featureListSection > .featureList > ul > li + li{
 margin-top: 5rem; 
}

#featureListSection > .featureList > ul > li > a{
  display: block;
  width: 100%;
  text-decoration: none;
}

#featureListSection > .featureList > ul > li > a > figure{
  display: block;
  width: 100%;
  margin-bottom: 1rem;
  aspect-ratio: 420 / 280;
  border-radius: 10px;
  overflow: hidden;
}

#featureListSection > .featureList > ul > li > a > figure > img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#featureListSection > .featureList > ul > li > a > time{
  display: block;
  margin-bottom: 0.5rem;
  font-size: 1.5rem;
  letter-spacing: 0.025em;
  line-height: 1;
  color: #43AC33;
  font-weight: 400;
}

#featureListSection > .featureList > ul > li > a > .ttl{
  display: block;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  width: 100%;
  font-size: 1.6rem;
  text-align: left;
  line-height: 2;
  font-weight: 400;
  letter-spacing: 0;
  overflow: hidden;
}


#featureListSection > .featureList .pagerBox{margin-top: 5rem;}




/**************************************
featureDetailSection
**************************************/
#featureDetailSection{
  display: block;
  margin: 0 auto;
  padding: 0 1rem 0;
  line-height: 2;
}


p{
  text-align: left;
  letter-spacing: 0.025em;
}

:where(p,div,dl,dt,dd,ul,ol,li,a) {
  font-size: 1.6rem;
}




#featureDetailSection a{
  transition: opacity .3s ease;
  text-decoration: underline;
  color: #7C7C7C;
}


/*
#featureDetailSection a[target="_blank"]{
  display: inline-flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  gap: 0.9rem 0.9rem;
}
*/

#featureDetailSection a[target="_blank"]::after{
  content: '';
  display: inline-block;
  width: 1.5rem;
  height: 1.5rem;
  background: url("../img/common/icon_blank.svg") center center no-repeat;
  background-size: 100% auto;
  vertical-align: text-top;
  margin-top: 0.2rem;
  margin-left: 0.9rem;
}

#featureDetailSection a.no-external-icon[target="_blank"]::after {
    display: none !important; 
    content: none !important; 
}


#featureDetailSection p:not(:first-child){
  margin-top: 2rem;
}

#featureDetailSection .h5TTL + p:not(:first-child){margin-top: 1.6rem;}


#featureDetailSection strong{
  font-weight: 700;
  color: #FA9900;
}

#featureDetailSection .marker{
  background: #F7EDD2;
  color: #000000;
  font-weight: 700;
}

#featureDetailSection .fcRed{ color: #B92E2E;}
#featureDetailSection .fcGray{ color: #707070;}

#featureDetailSection .caution{
  font-size: 1.3rem;
  line-height: 2;
  letter-spacing: 0.025em;
}

/* btn  *******************/
#featureDetailSection .ledeBox{
  display: block;
}
#featureDetailSection .ledeBox:not(:first-child){margin-top: 2rem;}



/* btn  *******************/
#featureDetailSection .btnBorder{
  width: 80%;
  max-width: 30rem;
  min-width: min(17.25rem,100%);
  margin: 0 auto;
}

#featureDetailSection .btnBorder:not(:first-child){margin-top: 2rem;}

#featureDetailSection .btnBorder > a,
#featureDetailSection .btnBorder > span{
  height: 3.9rem;
  font-size: 1.5rem;
  text-decoration: none;
  color: #000000;
  padding: 0 1rem;
}

#featureDetailSection .btnBorder > a::after,
#featureDetailSection .btnBorder > span::after{display: none;}


#featureDetailSection .btnNext{
  width: 80%;
  max-width: 30rem;
  min-width: min(17.25rem,100%);
  margin: 0 auto;
}
#featureDetailSection .btnNext:not(:first-child){margin-top: 3rem;}

#featureDetailSection .btnNext > a{text-decoration: none; color: #FFFFFF;}


/* sectionBox ******************/
#featureDetailSection .sectionBox{
  display: block;
  width: 100%;
}
#featureDetailSection .sectionBox:not(:first-child){
  margin-top: 6rem;
}


/* borderBox ******************/
#featureDetailSection .borderBox{
  display: block;
  width: 100%;
  padding: 2rem;
  border: 5px solid #EBEBEB;
  border-radius: 20px;
}

#featureDetailSection .borderBox:not(:first-child){
  margin-top: 5rem;
}

#featureDetailSection .borderBox:not(:last-child){
  margin-bottom: 4rem;
}

/* bgBox ******************/
#featureDetailSection .bgBox{
  display: block;
  width: 100%;
  padding: 2.5rem 1.5rem;
  border-radius: 20px;
  background: #F8F8F8;
}

#featureDetailSection .bgBox:not(:first-child){
  margin-top: 5rem;
}

#featureDetailSection .bgBox:not(:last-child){
  margin-bottom: 4rem;
}


/* mainTTL ******************/
#featureDetailSection .mainTTL{
  display: block;
  padding-top: 1rem;
  padding-bottom: 2rem;
  margin-bottom: 3rem;
  font-family: var(--font-title);
  font-size: 2.2rem;
  letter-spacing: 0.025em;
  font-weight: 700;
  line-height: 1.5;
  color: #2B100F;
  text-align: left;
  
  background-size: 5px 2px;
  background-image: linear-gradient(to left, #2B100F 2px, transparent 3px);
  background-repeat: repeat-x;
  background-position: left bottom;
}


/* mainVisual ******************/
#featureDetailSection .mainVisual{
  display: block;
  width: 100%;
  margin-bottom: 4rem;
}

#featureDetailSection .mainVisual picture,
#featureDetailSection .mainVisual img{display: block; width: 100%; height: auto;}


/* indexList ******************/
#featureDetailSection .indexList{
  display: block;
  width: 100%;
  margin: 0 auto;
}
#featureDetailSection .indexList.border{
  max-width: 800px;
  padding: 2rem;
  border: 5px solid #EBEBEB;
  border-radius: 20px;
}

#featureDetailSection .indexList:not(:first-child){
  margin-top: 4rem;
}

#featureDetailSection .indexTTL{
  display: block;
  margin-bottom: 1.5rem;
  font-family: var(--font-title);
  font-size: 2rem;
  letter-spacing: 0.025em;
  font-weight: 500;
  line-height: 1.8;
  text-align: center;
}


/* indexCircleList **/
#featureDetailSection ul.indexCircleList{
  display: block;
}

#featureDetailSection ul.indexCircleList > li{
  display: block;
  padding: 1.5rem 0 0 2.5rem;
  
  background-size: 4px 1px;
  background-image: linear-gradient(to left, #D6D6D6 2px, transparent 2px);
  background-repeat: repeat-x;
  background-position: left top;
  
  font-family: var(--font-title);
  font-size: 1.6rem;
  letter-spacing: 0.025em;
  font-weight: 500;
  line-height: 2;
  
  position: relative;
}

#featureDetailSection ul.indexCircleList > li::before{
  content: '';
  display: block;
  width: 1rem;
  height: 1rem;
  border-radius: 50%;
  background: #43AC33;
  position: absolute;
  left: 0;
  top: calc(2rem + 0.6rem);
}

#featureDetailSection ul.indexCircleList > li + li{margin-top: 1.5rem;}

#featureDetailSection ul.indexCircleList > li > a{
  text-decoration: none;
  font-size: 1.6rem;
  transition: opacity .3s ease;
  color: #000000;
}


#featureDetailSection ul.indexCircleList > li > ul{
  display: block;
}
#featureDetailSection ul.indexCircleList > li > ul:not(:first-child){margin-top: 1.5rem;}

#featureDetailSection ul.indexCircleList > li > ul > li{
  display: block;
  padding-left: 2rem;
  font-family: var(--font-main);
  font-size: 1.4rem;
  font-weight: 400;
  line-height: 1.5;
  position: relative;
}
#featureDetailSection ul.indexCircleList > li > ul > li::before{
  content: '';
  display: block;
  width: 1rem;
  height: 1rem;
  border-radius: 50%;
  background: #EBEBEB;
  position: absolute;
  left: 0;
  top: 0.5rem;
}

#featureDetailSection ul.indexCircleList > li > ul > li + li{
  margin-top: 1.4rem;
}

#featureDetailSection ul.indexCircleList > li > ul > li > a{
  font-family: var(--font-main);
  font-size: 1.4rem;
  font-weight: 400;
  text-decoration: none;
  color: #000000;
}


/* indexCircleList **/
#featureDetailSection ul.indexPanelList{
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: flex-start;
  gap: 1rem 1rem;
  width: 100%;
}

#featureDetailSection ul.indexPanelList > li{display: block;}


#featureDetailSection ul.indexPanelList > li > span,
#featureDetailSection ul.indexPanelList > li > a{
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 4.1rem;
  padding: 0.8rem 2rem;
  border: 1px solid #EBEBEB;
  border-radius: 99rem;
  background: #F8F8F8;
  font-family: var(--font-main);
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.025em;
  text-align: left;
  word-break: break-all;
  text-decoration: none;
  color: #000000;
}


/* TTL ******************/
/*h2*/
#featureDetailSection .h2TTL{
  display: block;
  width: 100%;
  margin-bottom: 2.5rem;
  padding: 1rem 1rem;
  background: #E9F5DC;
  border-radius: 5px;
  font-family: var(--font-title);
  font-size: 2.2rem;
  letter-spacing: 0.025em;
  font-weight: 500;
  line-height: 1.5;
}

#featureDetailSection .h2TTL:not(:first-child){margin-top: 6rem;}


/*h3*/
#featureDetailSection .h3TTL{
  display: block;
  width: 100%;
  margin-bottom: 2.5rem;
  padding: 0 0 1.2rem;
  border-bottom: 3px solid rgba(0,0,0,.1);
  font-family: var(--font-title);
  font-size: 2.2rem;
  letter-spacing: 0.025em;
  font-weight: 500;
  line-height: 1.5;
  position: relative;
}
#featureDetailSection .h3TTL::after{
  content: '';
  display: block;
  width: 100%;
  height: 3px;
  max-width: 100px;
  background: #43AC33;
  position: absolute;
  left: 0;
  bottom: -3px;
}

#featureDetailSection .h3TTL:not(:first-child){margin-top: 2.5rem;}
    


/*h4*/
#featureDetailSection .h4TTL{
  display: block;
  width: 100%;
  margin-bottom: 2rem;
  padding-left: 4rem;
  font-family: var(--font-title);
  font-size: 2.0rem;
  letter-spacing: 0.025em;
  font-weight: 500;
  line-height: 1.35;
  position: relative;
}
#featureDetailSection .h4TTL::after{
  content: '';
  display: block;
  width: 100%;
  height: 2px;
  max-width: 3rem;
  background: #2B0F0F;
  position: absolute;
  left: 0;
  top: 1.2rem;
}

#featureDetailSection .h4TTL:not(:first-child){margin-top: 2.5rem;}
    

/*h5*/
#featureDetailSection .h5TTL{
  display: block;
  width: 100%;
  margin-bottom: 1.6rem;
  font-family: var(--font-title);
  font-size: 1.8rem;
  letter-spacing: 0.025em;
  font-weight: 500;
  line-height: 1.5;
  position: relative;
}

#featureDetailSection .h5TTL:not(:first-child){margin-top: 2rem;}



/* circleList ******************/
#featureDetailSection ul.circleList{
  display: block;
  width: 100%;
}

#featureDetailSection ul.circleList:not(:first-child){margin-top: 4rem;}


#featureDetailSection ul.circleList > li{
  display: block;
  padding: 0 0 0 2rem;
  font-size: 1.6rem;
  letter-spacing: 0.025em;
  font-weight: 400;
  line-height: 2;
  position: relative;
}

#featureDetailSection ul.circleList > li::before{
  content: '';
  display: block;
  width: 1rem;
  height: 1rem;
  border-radius: 50%;
  background: #43AC33;
  position: absolute;
  left: 0;
  top: 1rem;
}

#featureDetailSection ul.circleList > li + li{margin-top: 1.2rem;}



/* circleList ******************/
#featureDetailSection ol.numList{
  width: 100%;
  list-style-type: none;
  counter-reset: numlist 0; 
}

#featureDetailSection ol.numList:not(:first-child){margin-top: 4rem;}


#featureDetailSection ol.numList > li{
  display: block;
  padding-left: 2.3rem;
  font-size: 1.6rem;
  letter-spacing: 0.05em;
  font-weight: 400;
  line-height: 2;
  position: relative;
}

#featureDetailSection ol.numList > li::before{
  counter-increment: numlist 1;
  content: counter(numlist) ".";
  width: 1.4rem;
  line-height: 2;
  font-size: 1.6rem;
  position: absolute;
  left: 0;
  top: 0;
}

#featureDetailSection ol.numList > li + li{margin-top: 1.2rem;}


/* ttlBorderBox ******************/
#featureDetailSection dl.ttlBorderBox{
  display: block;
  width: 100%;
  border: 2px solid #EBEBEB;
  border-radius: 20px;
  overflow: hidden;
}

#featureDetailSection dl.ttlBorderBox:not(:first-child){margin-top: 4rem;}

#featureDetailSection dl.ttlBorderBox > dt{
  display: block;
  padding: 1.5rem 1.5rem;
  background: #E9F5DC;
  font-family: var(--font-title);
  font-size: 2rem;
  letter-spacing: 0.05em;
  font-weight: 500;
  line-height: 1.35;
}

#featureDetailSection dl.ttlBorderBox > dd{
  display: block;
  padding: 1.5rem;
}


/* ttlBorderBox ******************/
#featureDetailSection .tableBox{
  display: block;
  width: 100%;
  border: 2px solid #EBEBEB;
  border-radius: 20px;
  overflow: hidden;
}

#featureDetailSection .tableBox:not(:first-child){margin-top: 4rem;}

#featureDetailSection .tableBox > dl{
  display: block;
  width: 100%;
}
#featureDetailSection .tableBox > dl:not(:nth-last-of-type(1)){
  border-bottom: 1px solid #EBEBEB;
}


#featureDetailSection .tableBox > dl > dt{
  display: block;
  width: 100%;
  padding: 1.5rem;
  border-bottom: 1px solid #EBEBEB;
  background: #F8F8F8;
  font-family: var(--font-title);
  font-size: 1.7rem;
  letter-spacing: 0.025em;
  font-weight: 500;
  line-height: 1.411764705882353;
}

#featureDetailSection .tableBox > dl > dd{
  display: block;
  width: 100%;
  padding: 2rem 1.5rem;
}



/* figTextBoxList ******************/
#featureDetailSection .figTextBoxList{
  display: flex;
  justify-content: center;
  align-items: stretch;
  gap: 1rem 1rem;
}
#featureDetailSection .figTextBoxList:not(:first-child){
  margin-top: 2.5rem;
}

#featureDetailSection .figTextBoxList + .figTextBoxList{margin-top: 3rem;}


#featureDetailSection .figTextBoxList > *{
  flex-shrink: 1;
  width: 100%;
}

/* figTextBox ******************/
#featureDetailSection .figTextBox{
  display: block;
  width: 100%;
}
#featureDetailSection .figTextBox:not(:first-child){
  margin-top: 2.5rem;
}
#featureDetailSection .figTextBoxList .figTextBox:not(:first-child){margin-top: 0;}


#featureDetailSection .figTextBox > .fig{
  display: block;
}

#featureDetailSection .figTextBox > .fig picture{
  display: block;
  width: 100%;
  height: auto;
  overflow: hidden;
  border-radius: 10px;
}
#featureDetailSection .figTextBox > .fig picture img{display: block; width: 100%; height: auto;}

#featureDetailSection .figTextBox > .fig > p{
  display: block;
  margin-top: 1.5rem;
  font-size: 1.4rem;
  line-height: 1.75;
}

#featureDetailSection .figTextBox > .text{
  display: block;
  width: 100%;
  margin-top: 2rem;
}


/* checkList ******************/
#featureDetailSection  ul.checkList{
  display: block;
}
#featureDetailSection  ul.checkList:not(:first-child){
  margin-top: 2rem;
}

#featureDetailSection  ul.checkList > li{
  display: block;
  padding-left: 4rem;
  position: relative;
}
#featureDetailSection  ul.checkList > li::before{
  content: '';
  display: block;
  width: 2.5rem;
  height: 2.17rem;
  background: url("../img/feature/icon_check_point.svg") center center no-repeat;
  background-size: 100% auto;
  position: absolute;
  left: 0;
  top: 0.5rem;
}

#featureDetailSection  ul.checkList > li + li{margin-top: 2.5rem;}


/* pointList ******************/
#featureDetailSection  ol.pointList{
  display: block;
  counter-reset: pointlist 0;
}

#featureDetailSection  ol.pointList:not(:first-child){
  margin-top: 2rem;
}

#featureDetailSection  ol.pointList > li{
  display: block;
  position: relative;
}
#featureDetailSection  ol.pointList > li::before{
  counter-increment: pointlist 1;
  content: "POINT." counter(pointlist);
  display: flex;
  justify-content: center;
  align-items: center;
  width: 8rem;
  height: 3rem;
  padding-top: 0.3rem;
  margin-bottom: 0.7rem;
  background: #43AC33;
  border-radius: 5px;
  line-height: 1;
  font-size: 1.3rem;
  font-weight: 600;
  color: #FFFFFF;
}

#featureDetailSection  ol.pointList.orange > li::before{
  background-color: inherit;
  color: #FA9900;
  border: 1px solid #FA9900;
}

#featureDetailSection  ol.pointList > li + li{
  margin-top: 2.4rem;
}




/* column2LineBox ******************/
#featureDetailSection .column2LineBox{
  display: block;
}

#featureDetailSection .column2LineBox:not(:first-child){margin-top: 2.5rem;}

#featureDetailSection .column2LineBox > * + *{margin-top: 4rem;}


/* column2LineBox ******************/
#featureDetailSection .recipeImgBox{
  display: block;
  width: 100%;
}

#featureDetailSection .recipeImgBox:not(:first-child){margin-top: 2.5rem;}

#featureDetailSection .recipeImgBox .fig{
  display: block;
  width: 100%;
  height: auto;
  border-radius: 10px;
  overflow: hidden;
}
#featureDetailSection .recipeImgBox .fig picture,
#featureDetailSection .recipeImgBox .fig img{display: block; width: 100%; height: auto;}

#featureDetailSection .recipeImgBox .text:not(:first-child){margin-top: 1.5rem;}


/* cookingTime ******************/
#featureDetailSection .cookingTime{
  display: block;
  width: 100%;
  padding-top: 0.3rem;
  padding-left: 4rem;
  font-family: var(--font-title);
  font-size: 1.8rem;
  letter-spacing: 0.025em;
  font-weight: 500;
  line-height: 1.5;
  position: relative;
}

#featureDetailSection .cookingTime:not(:first-child){margin-top: 1.5rem;}

#featureDetailSection .cookingTime::before{
  content: '';
  display: block;
  width: 3rem;
  height: 3rem;
  background: url("../img/feature/icon_time.svg") center center no-repeat;
  background-size: 100% auto;
  position: absolute;
  left: 0;
  top: 0;
}

/* materialTTL ******************/
#featureDetailSection .materialTTL{
  display: block;
  width: 100%;
  padding-top: 0.3rem;
  padding-left: 4rem;
  font-family: var(--font-title);
  font-size: 1.8rem;
  letter-spacing: 0.025em;
  font-weight: 500;
  line-height: 1.5;
  position: relative;
}

#featureDetailSection .materialTTL:not(:first-child){margin-top: 4rem;}

#featureDetailSection .materialTTL::before{
  content: '';
  display: block;
  width: 3rem;
  height: 3rem;
  background: url("../img/feature/icon_cooking.svg") center center no-repeat;
  background-size: 100% auto;
  position: absolute;
  left: 0;
  top: 0;
}


/* recipeMaterialBox ******************/
#featureDetailSection .recipeMaterialBox{
  display: block;
  width: 100%;
  padding: 2.5rem 1.5rem;
  background: #FFFCF0;
  border-radius: 20px;
}


/* materialList ******************/
#featureDetailSection dl.materialList{
  display: block;
  
  background-size: 4px 1px;
  background-image: linear-gradient(to left, #D6D6D6 2px, transparent 2px);
  background-repeat: repeat-x;
  background-position: left bottom;
}

#featureDetailSection dl.materialList:not(:first-child){margin-top: 1.5rem;}

#featureDetailSection dl.materialList > dt{
  display: block;
  margin-bottom: 1.2rem;
  font-family: var(--font-title);
  font-size: 1.7rem;
  font-weight: 700;
  letter-spacing: 0.025em;
  text-align: left;
  line-height: 1.411764705882353;
}



#featureDetailSection dl.materialList > dd > dl{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  padding: 1.4rem 0 1.2rem;
  font-size: 1.6rem;
  font-weight: 400;
  text-align: left;
  line-height: 1.5;
  letter-spacing: 0.025em;
  
  background-size: 4px 1px;
  background-image: linear-gradient(to left, #D6D6D6 2px, transparent 2px);
  background-repeat: repeat-x;
  background-position: left top;
}


#featureDetailSection dl.materialList > dd.amendment,
#featureDetailSection dl.materialList > dd > dl > dd.amendment{
  width: 100%;
  padding-top: 1.4rem;
  font-size: 1.4rem;
  line-height: 1.75;
}

#featureDetailSection dl.materialList > dd.amendment{
  padding-top: 0.3rem;
  padding-bottom: 1.4rem;
  font-size: 1.4rem;
  line-height: 1.75;
}



/* howtoStepList ******************/
#featureDetailSection ol.howtoStepList{
  display: block;
  width: 100%;
  counter-reset: howtoStep 0;
}

#featureDetailSection ol.howtoStepList:not(:first-child){margin-top: 3rem;}


#featureDetailSection ol.howtoStepList > li{
  display: block;
  padding-top: 0.2rem;
  padding-left: 5.4rem;
  padding-bottom: 1.5rem;
  
  background-size: 4px 1px;
  background-image: linear-gradient(to left, #D6D6D6 2px, transparent 2px);
  background-repeat: repeat-x;
  background-position: left bottom;
  
  position: relative;
}

#featureDetailSection ol.howtoStepList > li::before{
  counter-increment: howtoStep 1;
  content: "" counter(howtoStep);
  display: flex;
  justify-content: center;
  align-items: center;
  width: 3.6rem;
  height: 3.6rem;
  background: #EAC564;
  border-radius: 5px;
  line-height: 1;
  font-size: 2rem;
  font-weight: 600;
  color: #FFFFFF;
  position: absolute;
  left: 0;
  top: 0;
}

#featureDetailSection ol.howtoStepList > li + li{
  margin-top: 1.5rem;
}


#featureDetailSection ol.howtoStepList > li > .h5TTL:first-child{padding-top: 0.4rem;}


/* movieWrap ******************/
#featureDetailSection .movieWrap{
  width: 100%;
  aspect-ratio: 16 / 9;
}

#featureDetailSection .movieWrap:not(:first-child){margin-top: 2.5rem;}

#featureDetailSection .movieWrap iframe {
  width: 100%;
  height: 100%;
}


/* featureShareBtns ******************/
#featureDetailSection .featureShareBtns{
  display: block;
  margin-top: 8rem;
  padding: 2rem;
  background: #F8F8F8;
  border-radius: 10px;
}

#featureDetailSection .featureShareBtns > dl{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0 2rem;
}

#featureDetailSection .featureShareBtns > dl > dt{
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.05em;
}

#featureDetailSection .featureShareBtns > dl > dd{}


#featureDetailSection ul.shareBtn{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0 2rem;
}

#featureDetailSection ul.shareBtn > li{
  width: 3rem;
}

#featureDetailSection ul.shareBtn > li > a,
#featureDetailSection ul.shareBtn > li img{
  display: block;
  width: 100%;
  height: auto;
}

/* imgLpBox ******************/
#featureDetailSection .imgLpBox{
  display: block;
  margin: 0 auto;
}

#featureDetailSection .imgLpBox:not(:first-child){margin-top: 5rem;}

#featureDetailSection .imgLpBox img,
#featureDetailSection .imgLpBox picture,
#featureDetailSection .imgLpBox figure{
  display: block;
  width: auto;
  max-width: 100%;
  margin: 0 auto;
}



/* itemList ******************/
#featureDetailSection .itemList > ul{
  justify-content: flex-start;
}

#featureDetailSection .itemList > ul > li{
  width: calc(50% - 0.5rem);
  margin-right: 1rem;
  position: relative;
}

#featureDetailSection .itemList > ul > li:nth-of-type(2n),
#featureDetailSection .itemList > ul > li:nth-last-of-type(1){margin-right: 0;}
#featureDetailSection .itemList > ul > li:nth-of-type(n + 3){margin-top: 3rem;}


#featureDetailSection .itemList > ul > li a{
  text-decoration: none;
  transition: opacity .3s ease;
  color: #000000;
}


#featureDetailSection .itemList > ul > li p.name{
  margin-top: 1.25rem;
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 1.5;
}

#featureDetailSection .itemList > ul > li .price{
  padding-top: 0.5rem;
}

#featureDetailSection .itemList > ul > li .priceInner p{
  margin-top: 0.6rem;
}

#featureDetailSection .itemList > ul > li .btnfavorit{
  display: block;
  width: 100%;
  padding-top: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 4;
  pointer-events: none;
}
#featureDetailSection .itemList > ul > li .btnfavorit > a{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 3.6rem;
  height: 3.6rem;
  border: 1px solid #6E6E6E;
  border-radius: 50%;
  background: url("../img/common/icon_list_favorit.svg") center center no-repeat #FFFFFF;
  background-size: 2rem auto;
  cursor: pointer;
  pointer-events: all;
  position: absolute;
  right: 0.6rem;
  bottom: 0.5rem;
}
#featureDetailSection .itemList > ul > li .btnfavorit.active > a{
  background: url("../img/common/icon_list_favorit_active.svg") center center no-repeat #FFFFFF;
  background-size: 2rem auto;
}

#featureDetailSection .itemList > ul > li .outline{display: none;}


/*単品の場合*****/

#featureDetailSection .itemList > ul > li:nth-of-type(1):nth-last-of-type(1){
  display: block;
  width: 100%;
  border: 3px solid #EBEBEB;
  border-radius: 30px;
  padding: 2.5rem 1.5rem;
  position: relative;
}

#featureDetailSection .itemList > ul > li:nth-of-type(1):nth-last-of-type(1) .outer{
  display: block;
  width: 100%;
  position: static;
}

#featureDetailSection .itemList > ul > li:nth-of-type(1):nth-last-of-type(1) .fig{
  width: 100%;
}

#featureDetailSection .itemList > ul > li:nth-of-type(1):nth-last-of-type(1) .outline{
  display: block;
  margin-top: 2rem;
  font-size: 1.6rem;
  line-height: 2;
}


#featureDetailSection .itemList > ul > li:nth-of-type(1):nth-last-of-type(1) .btnfavorit{
  width: calc(100% - 3rem);
  padding-top: calc(100% - 3rem);
  left: 1.5rem;
  top: 2.5rem;
}

#featureDetailSection .itemList > ul > li:nth-of-type(1):nth-last-of-type(1) .btnfavorit > a{
  right: 2rem;
  bottom: 1rem;
}



/**************************************
toolTip
**************************************/

#productDetailSection .invisible {display: block;}
#addFavoriteTip {
  display: none;
  margin: 0;
  padding: 2rem;
  width: 40rem;
  border-radius: 10px;
  background-color: rgba(0,0,0,.6);
  overflow: hidden;
  font-size: 1.8rem;
  text-align: center;
  z-index: 2000;
  color:#FFFFFF;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
}
#addFavoriteTip a{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  width: 24rem;
  height: 3rem;
  padding: 0 1rem 0 1rem;
  margin: 2rem auto 0;
  background: #FFFFFF;
  border-radius: 1.5rem;
  border: 1px solid #000000;
  font-weight: 500;
  font-size: 1.2rem;
  text-align: center;
  line-height: 1;
  text-decoration: none;
  color: #000000;
  position: relative;
}

.line-buttons-wrapper {
    display: flex;
    flex-direction: column; /* 縦並び */
    align-items: center;    /* 中央揃え */
    gap: 15px;              /* 画像間の隙間 */
    padding: 20px 0;        /* 上下の余白 */
}

.line-buttons-wrapper picture img {
    display: block;
    max-width: 100%;
    height: auto;
}