@charset "utf-8";
/*-----------------------------------------------
 * SPECIAL
-------------------------------------------------*/
/**
* bg
**/
.special__bg {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
  pointer-events: none;
  /* overflow: hidden; */
}
.special__bg-clip {
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}
.special__bg-clip-in {
  width: 100%;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  background: url(../img/common/bg/bg-head.jpg) no-repeat left top/cover;
}
.subSecBg {
  background-color: var(--color-blue49);
}
.special {
  position: relative;
}
.specialWrap {
  display: flex;
}
/*-----------------------------------------------
 * DETAIL
-------------------------------------------------*/
.specialDetail {
  width: 100%;
}
.specialDetailHeadWrap {
  position: relative;      
}
.specialDetailHeadWrapD{
  padding: min(calc(65 / var(--vw-min) * 100vw), 65px) 0;  
}
@media screen and (max-width: 768px) {
  .specialDetailHeadWrapD{
    padding: calc(80 / var(--vw-min) * 100vw) 0;
  }  
}
.specialDetailHead {
  width: min(calc(960 / var(--vw-min) * 100vw), 960px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .specialDetailHead {
    width: 100%;
    padding: 0 calc(40 / var(--vw-min) * 100vw);
  }
}

.specialDetailHead__tit {
  font-size: min(calc(30 / var(--vw-min) * 100vw), 30px);
  color: #fff;
  line-height: 1.5;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .specialDetailHead__tit {
    font-size: calc(30 / var(--vw-min) * 100vw);
  }
}
.specialDetailContWrap {
  background-color: #000;
}
.specialDetailCont {
  font-size: min(calc(16 / var(--vw-min) * 100vw), 16px);
  color: #fff;
  line-height: 2;
  width: min(calc(960 / var(--vw-min) * 100vw), 960px);
  margin: 0 auto;
  padding: min(calc(50 / var(--vw-min) * 100vw), 50px) 0;
}
@media screen and (max-width: 768px) {
  .specialDetailCont {
    font-size: min(calc(20 / var(--vw-min) * 100vw), 20px);
    width: 100%;
    padding: calc(40 / var(--vw-min) * 100vw) calc(40 / var(--vw-min) * 100vw) calc(50 / var(--vw-min) * 100vw);
  }
}

@media screen and (max-width: 768px) {
  .specialDetailCont p:not(:last-child) {
    margin-bottom: calc(60 / var(--vw-min) * 100vw);
  }
}
.specialDetailCont a {
  color: #fff;
}

/*-----------------------------------------------
 * COMMENT
-------------------------------------------------*/

/* commentImgTxt */
.commentImgTxt{
   margin-top: min(calc(40 / var(--vw-min) * 100vw), 40px);
}
.commentImgTxt img{
  width: 100%;
}
.commentImgTxt ul{
   display: flex;
   flex-wrap: wrap;
   justify-content: space-between;
}
.commentImgTxt li:first-child{
  width: 35%;
}
.commentImgTxt li:last-child{
  width: 60%;
}
@media screen and (max-width: 768px) {
  .commentImgTxt{
    margin-top: calc(60 / var(--vw-min) * 100vw);
  }
  .commentImgTxt ul{
    flex-direction: column;
  }
  .commentImgTxt li:first-child{
    width: 60%;
    margin: 0 auto;
    padding-bottom: calc(20 / var(--vw-min) * 100vw);
  }
  .commentImgTxt li:last-child{
    width: 100%;
  }
}

/* commentTxt */
.commentTxt{
   margin-top: min(calc(40 / var(--vw-min) * 100vw), 40px);
   border-top: var(--color-purple63) 1px solid;
   padding-top: min(calc(40 / var(--vw-min) * 100vw), 40px);
}
@media screen and (max-width: 768px) {
  .commentTxt{
    margin-top: calc(60 / var(--vw-min) * 100vw);
    padding-top: calc(60 / var(--vw-min) * 100vw);

  }
}

/* comname */
.comname{
  margin-bottom: min(calc(15 / var(--vw-min) * 100vw), 15px);
}
@media screen and (max-width: 768px) {
  .comname{
    text-align: center;
    margin-bottom: calc(20 / var(--vw-min) * 100vw);
  }
}
.post{
    background: linear-gradient(transparent 70%, var(--color-purple63) 30%);
    display: inline;
}
.name{
  background: linear-gradient(transparent 70%, var(--color-purple63) 30%);
    display: inline;
    font-size: min(calc(27 / var(--vw-min) * 100vw), 27px);
}
@media screen and (max-width: 768px) {
  .name{
    font-size: calc(34 / var(--vw-min) * 100vw);
  }
}


/* parts */
.mb{
  margin-bottom: min(calc(48 / var(--vw-min) * 100vw), 48px);
}
@media screen and (max-width: 768px) {
  .mb{
    margin-bottom: calc(20 / var(--vw-min) * 100vw);
  }
}

.imgy{
  width: 90%;
  margin: 0 auto;
  padding-top: min(calc(20 / var(--vw-min) * 100vw), 20px);
  padding-bottom: min(calc(20 / var(--vw-min) * 100vw), 20px);
}
.imgy img{
  width: 100%;
}
@media screen and (max-width: 768px) {
  .imgy{
    padding-top: calc(6 / var(--vw-min) * 100vw);
    padding-bottom: calc(6 / var(--vw-min) * 100vw);
  }
}