@charset "UTF-8";
@import url("global.css");
.navi_box {
  border-top: #262626 solid 1px;
  border-bottom: #262626 solid 1px;
  width: 100%;
  padding-block: 16px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: flex;
  justify-content: space-between;
  margin-bottom: 70px;
}
.navi_box .navi_categories {
  width: 100%;
}
.navi_box .navi_categories .navi_main {
  padding: 20px 30px 20px 10px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.navi_box .navi_categories .navi_main .text {
  display: flex;
  align-items: center;
  margin-bottom: 5px;
  font-size: 1.06em;
  font-weight: 700;
}
.navi_box .navi_categories .navi_main .text::before {
  content: "\f130";
  font-family: 'Font Awesome 6 free','Font Awesome 6 Brands';
  font-weight: 900;
  display: block;
  margin-right: 5px;
}
.navi_box .navi_categories .navi_main .text:first-of-type::before {
  content: "\f02c";
}
.navi_box .navi_categories .navi_main ul.list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.navi_box .navi_categories .navi_main ul.list > li a {
  display: block;
  text-align: center;
  padding: 4px 15px;
  -webkit-border-radius: var(--radius-small);
  border-radius: var(--radius-small);
  background-color: #EFEFEF;
  font-size: .875em;
}
.navi_box .navi_categories .navi_main ul.list > li a::before {
  content: "#";
  display: inline;
  margin-right: 1px;
}
@media (any-hover: hover) {
  .navi_box .navi_categories .navi_main ul.list > li a:hover {
    background-color: #777777;
    color: #FFF;
  }
}
.navi_box .navi_categories .navi_main ul.list > li.current a, .tax-interview .navi_box .navi_categories .navi_main ul.list > li.navi_interview a {
  background-color: #777777;
  color: #FFF;
}
.navi_box .navi_categories .navi_main ul.list + .text {
  margin-top: 20px;
}
.navi_box .reset {
  flex-shrink: 0;
  white-space: nowrap;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-inline: 30px 25px;
  border-left: #A9A9A9 solid 1px;
}
.navi_box .reset a {
  display: flex;
  align-items: center;
  background-color: #777777;
  padding: 4px 12px;
  -webkit-border-radius: var(--radius-small);
  border-radius: var(--radius-small);
  color: #FFF;
  font-size: .875em;
}
.navi_box .reset a::before {
  content: "×";
  display: block;
  margin-right: 5px;
}

/* ------------------------------------------------------------
 Index
------------------------------------------------------------ */
.archive ul.workslist {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  column-gap: 60px;
}
.archive ul.workslist li {
  display: contents;
}
.archive ul.workslist li a {
  display: grid;
  grid-template-rows: subgrid;
  grid-row: span 3;
  margin-bottom: 70px;
}
.archive ul.workslist li a .img {
  width: 100%;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  -webkit-border-radius: var(--radius-large);
  border-radius: var(--radius-large);
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
}
.archive ul.workslist li a .img figure {
  position: relative;
  width: 100%;
  height: 100%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.archive ul.workslist li a .img figure img {
  transition: all 0.5s cubic-bezier(0.04, 0.435, 0.315, 0.9) 0s;
  backface-visibility: hidden;
}
.archive ul.workslist li a .img figure::before {
  content: "";
  position: absolute;
  inset: 0;
  background-color: #262626;
  mix-blend-mode: multiply;
  opacity: 0;
  z-index: 1;
  transition: all 0.5s cubic-bezier(0.04, 0.435, 0.315, 0.9) 0s;
  backface-visibility: hidden;
}
.archive ul.workslist li a .img figure::after {
  content: "詳しく見る";
  color: #fff;
  font-weight: 700;
  position: absolute;
  top: 15px;
  right: 40px;
  z-index: 2;
  opacity: 0;
  transition: all 0.5s cubic-bezier(0.04, 0.435, 0.315, 0.9) 0.2s;
  backface-visibility: hidden;
}
.archive ul.workslist li a .img .cat-iv {
  position: absolute;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  padding: 2px 10px;
  background-color: #FFF;
  -webkit-border-radius: 6px 0 0 0;
  border-radius: 6px 0 0 0;
  font-family: "Barlow Semi Condensed", "LINE Seed JP", sans-serif;
  font-weight: 600;
  font-size: 14px;
}
.archive ul.workslist li a .img .cat-iv::before {
  content: "\f130";
  font-family: 'Font Awesome 6 free','Font Awesome 6 Brands';
  font-weight: 900;
  display: block;
  margin-right: 5px;
}
.archive ul.workslist li a .postinfo {
  display: contents;
}
.archive ul.workslist li a .postinfo .posttitle {
  margin-top: 15px;
  font-weight: 700;
  font-size: clamp(17px, 2vw, 22px);
  line-height: 1.6;
}
.archive ul.workslist li a .postinfo .catloop {
  margin-top: 10px;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 4px;
}
.archive ul.workslist li a .postinfo .catloop > span {
  display: block;
  padding: 4px 15px 3px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 11px;
  -webkit-border-radius: var(--radius-small);
  border-radius: var(--radius-small);
  color: #FFF;
  background-color: #262626;
}
.archive ul.workslist li a .postinfo .catloop > span::before {
  content: "#";
  display: inline;
  margin-right: 1px;
}
@media (any-hover: hover) {
  .archive ul.workslist li a:hover .img figure img {
    filter: blur(2px);
  }
  .archive ul.workslist li a:hover .img figure::before {
    opacity: .6;
  }
  .archive ul.workslist li a:hover .img figure::after {
    opacity: 1;
    translate: 20px 0;
  }
}

/* ------------------------------------------------------------
 Entry
------------------------------------------------------------ */
.entry #contents {
  padding-top: 0;
}
.entry #headline {
  margin: 15px;
  display: flex;
  column-gap: 15px;
}
.entry #headline .head-ph {
  width: 50%;
  height: 85svh;
  -webkit-border-radius: 12px;
  border-radius: 12px;
  overflow: hidden;
}
.entry #headline .head-ph figure {
  width: 100%;
  height: 100%;
}
.entry #headline .head-main {
  width: 50%;
  padding: 80px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-border-radius: 12px;
  border-radius: 12px;
  overflow: hidden;
  background-color: #F5F5F5;
  display: flex;
  align-items: center;
}
.entry #headline .head-main .main .cnt_title {
  margin-bottom: 20px;
}
.entry #headline .head-main .main .cnt_title a {
  display: flex;
  align-items: center;
  width: fit-content;
  font-weight: 700;
  line-height: 1.2;
}
.entry #headline .head-main .main .cnt_title a::before {
  content: "";
  display: block;
  margin-right: 10px;
  width: 23px;
  height: 23px;
  background: url(../img/arrow_back.svg) no-repeat center center;
  background-size: contain;
  filter: brightness(1) invert(1);
}
.entry #headline .head-main .main .post_title {
  line-height: 1.5;
  font-weight: 700;
  font-size: clamp(23px, 3.2vw, 44px);
}
.entry #headline .head-main .main .catloop {
  margin-top: 25px;
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
.entry #headline .head-main .main .catloop > span {
  display: block;
}
.entry #headline .head-main .main .catloop > span a {
  display: block;
  padding: 3px 15px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: .875em;
  -webkit-border-radius: var(--radius-small);
  border-radius: var(--radius-small);
  color: #FFF;
  background-color: #262626;
}
.entry #headline .head-main .main .catloop > span a::before {
  content: "#";
  display: inline;
  margin-right: 1px;
}
@media (any-hover: hover) {
  .entry #headline .head-main .main .catloop > span a:hover {
    background-color: #777777;
    color: #FFF;
  }
}
.entry #headline .head-main .main .text {
  margin-top: 50px;
  text-align: justify;
}
.entry #headline .head-main .main .text > p + p {
  margin-top: 1em;
}
.entry #headline .head-main .main .moreview {
  margin-top: 35px;
}
.entry #postbody {
  margin-top: 100px;
}
.entry .sec {
  margin-top: 100px;
}
.entry .sec .sec_title {
  margin-bottom: 40px;
  width: fit-content;
  font-weight: 700;
  font-size: clamp(20px, 2.8vw, 32px);
}
.entry .sec .sec_title::before {
  content: "";
  width: 12px;
  height: 12px;
  display: inline-block;
  margin-right: 15px;
  border-radius: 50%;
  background-color: #D5501E;
  vertical-align: 6px;
}
.entry #sec_data.sec .main > ul {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 50px;
}
.entry #sec_data.sec .main > ul li {
  display: flex;
  align-items: center;
  column-gap: 7px;
}
.entry #sec_data.sec .main > ul li > span {
  display: flex;
  align-items: center;
  font-weight: 700;
  font-size: 1.125em;
  column-gap: 6px;
}
.entry #sec_data.sec .main > ul li > span::before {
  content: "";
  width: 7px;
  height: 7px;
  flex-shrink: 0;
  display: block;
  border-radius: 50%;
  background-color: #A9A9A9;
  vertical-align: 2px;
}
.entry #sec_data.sec .main > ul li > span::after {
  content: ":";
  display: block;
  margin-bottom: 4px;
}
.entry #sec_point.sec .point_list > ul {
  counter-reset: listnum 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 80px 70px;
}
.entry #sec_point.sec .point_list > ul > li {
  counter-increment: listnum 1;
}
.entry #sec_point.sec .point_list > ul > li > figure {
  width: 100%;
  aspect-ratio: 1 / 1.33;
  background-color: #F5F5F5;
  position: relative;
  -webkit-border-radius: var(--radius-large);
  border-radius: var(--radius-large);
  overflow: hidden;
}
.entry #sec_point.sec .point_list > ul > li > figure::before {
  content: "0" counter(listnum);
  position: absolute;
  left: 0;
  top: 0;
  width: 46px;
  height: 46px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: #FFF;
  background-color: #262626;
  -webkit-border-radius: 0 0 8px 0;
  border-radius: 0 0 8px 0;
  overflow: hidden;
  font-family: "Barlow Semi Condensed", "LINE Seed JP", sans-serif;
  font-weight: 600;
  font-size: clamp(16px, 2vw, 22px);
}
.entry #sec_point.sec .point_list > ul > li .text {
  margin-top: 10px;
}
.entry #sec_gal.sec .pharea {
  position: relative;
}
.entry #sec_gal.sec .pharea ul.photo li {
  box-sizing: border-box;
  padding: 0 4px;
  opacity: .3;
  transition: all 0.5s cubic-bezier(0.04, 0.435, 0.315, 0.9) 0s;
  backface-visibility: hidden;
}
.entry #sec_gal.sec .pharea ul.photo li.slick-current {
  opacity: 1;
}
.entry #sec_gal.sec .pharea ul.photo li .figure {
  position: relative;
  aspect-ratio: 3 / 2;
  height: auto;
  background-color: #F5F5F5;
  -webkit-border-radius: 12px;
  border-radius: 12px;
  overflow: hidden;
}
.entry #sec_gal.sec .pharea ul.photo li .figure img.objectfit {
  position: absolute;
  top: 0;
  left: 0;
  object-fit: contain;
}
.entry #sec_gal.sec .pharea ul.thumbnail {
  margin-top: 15px;
  text-align: center;
}
.entry #sec_gal.sec .pharea ul.thumbnail li {
  box-sizing: border-box;
  padding: 2px;
  transition: all 0.5s cubic-bezier(0.04, 0.435, 0.315, 0.9) 0s;
  backface-visibility: hidden;
  cursor: pointer;
  opacity: .5;
  filter: grayscale(1);
  position: relative;
  -webkit-border-radius: 2px;
  border-radius: 2px;
  overflow: hidden;
  float: none !important;
  display: inline-block !important;
  vertical-align: bottom;
}
.entry #sec_gal.sec .pharea ul.thumbnail li::before {
  content: "";
  position: absolute;
  inset: 0;
  border: rgba(213, 80, 30, 0.5) 5px solid;
  display: block;
  z-index: 2;
  transition: all 0.4s cubic-bezier(0.04, 0.435, 0.315, 0.9) 0s;
  backface-visibility: hidden;
  opacity: 0;
}
.entry #sec_gal.sec .pharea ul.thumbnail li div {
  height: 0;
  padding-top: 100%;
  position: relative;
}
.entry #sec_gal.sec .pharea ul.thumbnail li img {
  position: absolute;
  top: 0;
  left: 0;
}
.entry #sec_gal.sec .pharea ul.thumbnail li.slick-current {
  opacity: 1;
  filter: none;
}
.entry #sec_gal.sec .pharea ul.thumbnail li.slick-current::before {
  opacity: 1;
}
.entry #sec_gal.sec .pharea ul.thumbnail .slick-track {
  transform: unset !important;
}
.entry #sec_gal.sec .append-arrow .slick-arrow {
  top: 45%;
}
.entry #sec_gal.sec .append-arrow .slick-arrow.slick-prev {
  left: 3vw;
}
.entry #sec_gal.sec .append-arrow .slick-arrow.slick-next {
  right: 3vw;
}
.entry #sec_interview.sec .iv_inner:has(.imgbox) {
  display: flex;
}
.entry #sec_interview.sec .iv_inner:has(.imgbox) .imgbox {
  width: 43vw;
  flex-shrink: 0;
}
.entry #sec_interview.sec .iv_inner:has(.imgbox) .imgbox .img {
  position: sticky;
  top: 160px;
}
.entry #sec_interview.sec .iv_inner:has(.imgbox) .imgbox .img figure {
  width: 100%;
  aspect-ratio: 1 / 1;
  -webkit-border-top-right-radius: 20px;
  border-top-right-radius: 20px;
  -webkit-border-bottom-right-radius: 20px;
  border-bottom-right-radius: 20px;
  overflow: hidden;
}
.entry #sec_interview.sec .iv_inner:has(.imgbox) .main {
  padding-inline: 90px calc( (100vw - 1420px) / 2 );
  padding-block: 20px 30px;
}
.entry #sec_interview.sec .iv_inner .main {
  padding-inline: calc( (100vw - 1420px) / 2 );
  width: 100%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.entry #sec_interview.sec .iv_inner .main .iv_body .qa_title {
  padding-inline: 35px;
  margin-bottom: 25px;
  line-height: 1.6;
  width: fit-content;
  font-weight: 700;
  font-size: clamp(20px, 2.8vw, 34px);
  position: relative;
}
.entry #sec_interview.sec .iv_inner .main .iv_body .qa_title::before, .entry #sec_interview.sec .iv_inner .main .iv_body .qa_title::after {
  position: absolute;
  width: 20px;
  height: 22px;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
}
.entry #sec_interview.sec .iv_inner .main .iv_body .qa_title::before {
  content: "";
  left: 0;
  top: 0;
  background-image: url("../img/works/iv_title_left.svg");
}
.entry #sec_interview.sec .iv_inner .main .iv_body .qa_title::after {
  content: "";
  right: 0;
  bottom: 0;
  background-image: url("../img/works/iv_title_right.svg");
}
.entry #sec_interview.sec .iv_inner .main .iv_body dl.qa + dl.qa {
  margin-top: 45px;
}
.entry #sec_interview.sec .iv_inner .main .iv_body dl.qa dt, .entry #sec_interview.sec .iv_inner .main .iv_body dl.qa dd {
  display: flex;
  padding-inline: 15px;
  font-size: 1.125em;
}
.entry #sec_interview.sec .iv_inner .main .iv_body dl.qa dt::before, .entry #sec_interview.sec .iv_inner .main .iv_body dl.qa dd::before {
  flex-shrink: 0;
  white-space: nowrap;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 10px;
  width: 30px;
  height: 30px;
  padding-bottom: 2px;
  -webkit-border-radius: 100%;
  border-radius: 100%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: #FFF;
  font-family: "Barlow Semi Condensed", "LINE Seed JP", sans-serif;
  font-weight: 600;
}
.entry #sec_interview.sec .iv_inner .main .iv_body dl.qa dt {
  align-items: baseline;
  background-color: #F8F5EE;
  font-weight: 700;
  padding-block: 15px;
  margin-bottom: 20px;
}
.entry #sec_interview.sec .iv_inner .main .iv_body dl.qa dt::before {
  content: "Q";
  background-color: #262626;
}
.entry #sec_interview.sec .iv_inner .main .iv_body dl.qa dd {
  text-align: justify;
}
.entry #sec_interview.sec .iv_inner .main .iv_body dl.qa dd::before {
  content: "A";
  background-color: #D5501E;
}

.pagenavi {
  margin-top: 200px;
  border-top: #A9A9A9 solid 1px;
}
.pagenavi .prev a {
  display: flex;
  align-items: center;
  padding: 35px 90px 35px 30px;
  width: 100%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
}
.pagenavi .prev a .image {
  flex-shrink: 0;
  width: 220px;
  aspect-ratio: 1 / 1;
  -webkit-border-radius: var(--radius-normal);
  border-radius: var(--radius-normal);
  overflow: hidden;
}
.pagenavi .prev a .image figure img {
  transition: all 0.5s cubic-bezier(0.04, 0.435, 0.315, 0.9) 0s;
  backface-visibility: hidden;
}
.pagenavi .prev a .text {
  width: 100%;
  padding-left: 40px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.pagenavi .prev a .text p:not([class]) {
  margin-bottom: 5px;
  font-weight: 700;
  display: flex;
  align-items: center;
  transition: all 0.5s cubic-bezier(0.04, 0.435, 0.315, 0.9) 0s;
  backface-visibility: hidden;
}
.pagenavi .prev a .text p:not([class])::before {
  content: "";
  width: 9px;
  height: 9px;
  display: block;
  margin-right: 8px;
  border-radius: 50%;
  background-color: #00A8AF;
  transition: all 0.5s cubic-bezier(0.04, 0.435, 0.315, 0.9) 0s;
  backface-visibility: hidden;
}
.pagenavi .prev a .text .title {
  line-height: 1.5;
  font-weight: 700;
  font-size: clamp(18px, 2.8vw, 32px);
}
.pagenavi .prev a .text .catloop {
  margin-top: 20px;
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
.pagenavi .prev a .text .catloop > span {
  display: block;
  padding: 4px 15px 3px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 11px;
  -webkit-border-radius: var(--radius-small);
  border-radius: var(--radius-small);
  color: #FFF;
  background-color: #262626;
}
.pagenavi .prev a .text .catloop > span::before {
  content: "#";
  display: inline;
  margin-right: 1px;
}
.pagenavi .prev a .mark {
  position: absolute;
  right: 30px;
  top: 50%;
  margin-top: -17px;
  width: 34px;
  height: 34px;
  background: url(../img/arrow_back.svg) no-repeat center center;
  background-size: contain;
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
  filter: brightness(1) invert(1);
  -webkit-border-radius: var(--radius-small);
  border-radius: var(--radius-small);
  transition: all 0.5s cubic-bezier(0.04, 0.435, 0.315, 0.9) 0s;
  backface-visibility: hidden;
}
@media (any-hover: hover) {
  .pagenavi .prev a:hover .image figure img {
    filter: blur(2px);
  }
  .pagenavi .prev a:hover .text p:not([class]) {
    color: #D5501E;
  }
  .pagenavi .prev a:hover .text p:not([class])::before {
    background-color: #D5501E;
  }
  .pagenavi .prev a:hover .mark {
    right: 20px;
  }
}

/* ------------------------------------------------------------------------------------------------------------------------

 Responsive-Breakpoint-1 ( 1600px )

------------------------------------------------------------------------------------------------------------------------ */
@media only screen and (max-width: 1600px) {
  /* ------------------------------------------------------------
   Index
  ------------------------------------------------------------ */
  .archive ul.workslist {
    column-gap: 3vw;
  }
  .archive ul.workslist li a {
    margin-bottom: 60px;
  }

  /* ------------------------------------------------------------
   Entry
  ------------------------------------------------------------ */
  .entry #headline .head-ph {
    height: 94svh;
  }
  .entry #headline .head-main {
    padding-inline: 50px;
  }
  .entry #headline .head-main .main .text {
    margin-top: 35px;
  }
  .entry #sec_data.sec .main > ul {
    gap: 10px 40px;
  }
  .entry #sec_point.sec .point_list > ul {
    gap: 60px 50px;
  }
  .entry #sec_interview.sec .iv_inner:has(.imgbox) .main {
    padding-inline: 50px;
  }
  .entry #sec_interview.sec .iv_inner .main {
    padding-inline: 50px;
  }
}
/* ------------------------------------------------------------------------------------------------------------------------

 Responsive-Breakpoint-2 ( 1300px )

------------------------------------------------------------------------------------------------------------------------ */
@media only screen and (max-width: 1300px) {
  .navi_box {
    margin-bottom: 60px;
  }
  .navi_box .navi_categories .navi_main {
    padding: 20px 20px 20px 10px;
  }
  .navi_box .navi_categories .navi_main ul.list {
    gap: 5px;
  }
  .navi_box .navi_categories .navi_main ul.list > li a {
    padding: 3px 12px 2px;
  }
  .navi_box .reset {
    padding-inline: 20px 10px;
  }
  .navi_box .reset a {
    padding: 4px 10px;
  }

  /* ------------------------------------------------------------
   Index
  ------------------------------------------------------------ */
}
@media only screen and (max-width: 1300px) and (max-width: 959px) {
  .archive ul.workslist {
    grid-template-columns: repeat(2, 1fr);
    column-gap: 4vw;
  }
}
@media only screen and (max-width: 1300px) {
  .archive ul.workslist li a {
    margin-bottom: 50px;
  }
  .archive ul.workslist li a .img .cat-iv {
    font-size: 13px;
  }
  .archive ul.workslist li a .img .cat-iv::before {
    margin-right: 4px;
  }
  .archive ul.workslist li a .postinfo .posttitle {
    margin-top: 10px;
  }
  .archive ul.workslist li a .postinfo .catloop {
    gap: 3px;
  }
  .archive ul.workslist li a .postinfo .catloop > span {
    padding: 3px 12px 2px;
    font-size: 10px;
  }

  /* ------------------------------------------------------------
   Entry
  ------------------------------------------------------------ */
  .entry #headline {
    margin: 10px;
    column-gap: 10px;
  }
  .entry #headline .head-ph {
    height: auto;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    aspect-ratio: 1 / 1;
  }
  .entry #headline .head-main {
    padding-inline: 4vw 5vw;
    -webkit-border-radius: 10px;
    border-radius: 10px;
  }
  .entry #headline .head-main .main .cnt_title {
    margin-bottom: 15px;
  }
  .entry #headline .head-main .main .cnt_title a::before {
    width: 20px;
    height: 20px;
  }
  .entry #headline .head-main .main .catloop {
    margin-top: 20px;
  }
  .entry #headline .head-main .main .catloop > span a {
    padding: 2px 12px;
  }
  .entry #headline .head-main .main .text {
    margin-top: 25px;
  }
  .entry #headline .head-main .main .moreview {
    margin-top: 20px;
  }
  .entry #postbody {
    margin-top: 65px;
  }
  .entry .sec {
    margin-top: 65px;
  }
  .entry .sec .sec_title {
    margin-bottom: 20px;
  }
}
@media only screen and (max-width: 1300px) and (max-width: 959px) {
  .entry .sec .sec_title::before {
    margin-right: 12px;
    vertical-align: 3px;
  }
}
@media only screen and (max-width: 1300px) and (max-width: 959px) {
  .entry #sec_data.sec .main > ul {
    gap: 0;
  }
  .entry #sec_data.sec .main > ul li {
    width: 50%;
  }
  .entry #sec_data.sec .main > ul li > span {
    font-size: 1.1em;
    column-gap: 5px;
  }
}
@media only screen and (max-width: 1300px) and (max-width: 959px) {
  .entry #sec_point.sec .point_list > ul {
    gap: 50px 3vw;
  }
  .entry #sec_point.sec .point_list > ul > li > figure::before {
    width: 36px;
    height: 36px;
    -webkit-border-radius: 0 0 6px 0;
    border-radius: 0 0 6px 0;
  }
}
@media only screen and (max-width: 1300px) {
  .entry #sec_gal.sec .pharea ul.photo li .figure {
    -webkit-border-radius: 10px;
    border-radius: 10px;
  }
  .entry #sec_interview.sec .iv_inner:has(.imgbox) {
    display: flex;
  }
  .entry #sec_interview.sec .iv_inner:has(.imgbox) .imgbox {
    width: 36vw;
  }
  .entry #sec_interview.sec .iv_inner:has(.imgbox) .imgbox .img {
    top: 100px;
  }
  .entry #sec_interview.sec .iv_inner:has(.imgbox) .imgbox .img figure {
    -webkit-border-top-right-radius: 10px;
    border-top-right-radius: 10px;
    -webkit-border-bottom-right-radius: 10px;
    border-bottom-right-radius: 10px;
  }
  .entry #sec_interview.sec .iv_inner:has(.imgbox) .main {
    padding-inline: 30px 5vw;
    padding-block: 15px 25px;
  }
  .entry #sec_interview.sec .iv_inner .main {
    padding-inline: 5vw;
  }
  .entry #sec_interview.sec .iv_inner .main .iv_body .qa_title {
    padding-inline: 25px;
  }
  .entry #sec_interview.sec .iv_inner .main .iv_body .qa_title br {
    display: none;
  }
  .entry #sec_interview.sec .iv_inner .main .iv_body .qa_title::before, .entry #sec_interview.sec .iv_inner .main .iv_body .qa_title::after {
    width: 16px;
    height: 18px;
  }
  .entry #sec_interview.sec .iv_inner .main .iv_body dl.qa + dl.qa {
    margin-top: 35px;
  }
  .entry #sec_interview.sec .iv_inner .main .iv_body dl.qa dt, .entry #sec_interview.sec .iv_inner .main .iv_body dl.qa dd {
    font-size: 1.1em;
  }
  .entry #sec_interview.sec .iv_inner .main .iv_body dl.qa dt::before, .entry #sec_interview.sec .iv_inner .main .iv_body dl.qa dd::before {
    width: 26px;
    height: 26px;
  }
  .entry #sec_interview.sec .iv_inner .main .iv_body dl.qa dt {
    padding-block: 12px;
    margin-bottom: 15px;
  }

  .pagenavi {
    margin-top: 140px;
  }
  .pagenavi .prev a {
    padding: 30px 50px 30px 10px;
  }
  .pagenavi .prev a .image {
    width: 180px;
  }
  .pagenavi .prev a .text {
    padding-left: 30px;
  }
  .pagenavi .prev a .text p:not([class])::before {
    width: 8px;
    height: 8px;
    margin-right: 7px;
  }
  .pagenavi .prev a .text .catloop {
    margin-top: 15px;
    gap: 3px;
  }
  .pagenavi .prev a .text .catloop > span {
    padding: 3px 10px 2px;
    font-size: 10px;
  }
  .pagenavi .prev a .mark {
    right: 10px;
    margin-top: -14px;
    width: 28px;
    height: 28px;
  }
}
/* ------------------------------------------------------------------------------------------------------------------------

 Responsive-Breakpoint-3 ( 644px )

------------------------------------------------------------------------------------------------------------------------ */
@media only screen and (max-width: 644px) {
  .navi_box {
    display: block;
    margin-bottom: 50px;
  }
  .navi_box .navi_categories .navi_main {
    padding: 5px 10px 20px;
  }
  .navi_box .navi_categories .navi_main .text {
    font-size: 1em;
  }
  .navi_box .navi_categories .navi_main ul.list > li a {
    padding: 2px 10px 1px;
  }
  .navi_box .reset {
    padding-inline: 10px;
    border-left: none;
  }

  /* ------------------------------------------------------------
   Index
  ------------------------------------------------------------ */
  .archive ul.workslist {
    display: block;
  }
  .archive ul.workslist li {
    display: block;
    margin-bottom: 40px;
  }
  .archive ul.workslist li a {
    display: block;
    margin-bottom: 0;
  }
  .archive ul.workslist li a .img figure::after {
    top: 10px;
    right: 30px;
  }
  .archive ul.workslist li a .img .cat-iv {
    padding: 1px 8px;
    -webkit-border-radius: 4px 0 0 0;
    border-radius: 4px 0 0 0;
    font-size: 10px;
  }
  .archive ul.workslist li a .img .cat-iv::before {
    margin-right: 3px;
  }
  .archive ul.workslist li a .postinfo {
    display: block;
  }
  .archive ul.workslist li a .postinfo .posttitle {
    margin-top: 8px;
    line-height: 1.5;
  }
  .archive ul.workslist li a .postinfo .catloop {
    margin-top: 8px;
    gap: 2px;
  }
  .archive ul.workslist li a .postinfo .catloop > span {
    padding: 2px 10px 1px;
    font-size: 9px;
  }

  /* ------------------------------------------------------------
   Entry
  ------------------------------------------------------------ */
  .entry #headline {
    margin: 0;
    display: block;
    column-gap: 0;
  }
  .entry #headline .head-ph {
    width: 100%;
    -webkit-border-radius: 0;
    border-radius: 0;
  }
  .entry #headline .head-main {
    width: 100%;
    padding: 25px 5vw 35px;
    -webkit-border-radius: 0;
    border-radius: 0;
    display: block;
  }
  .entry #headline .head-main .main .cnt_title a::before {
    margin-right: 7px;
    width: 18px;
    height: 18px;
  }
  .entry #headline .head-main .main .post_title {
    line-height: 1.4;
  }
  .entry #headline .head-main .main .catloop {
    margin-top: 15px;
    gap: 2px;
  }
  .entry #headline .head-main .main .catloop > span a {
    padding: 2px 9px 1px;
  }
  .entry #headline .head-main .main .text {
    margin-top: 20px;
  }
  .entry #headline .head-main .main .moreview {
    margin-top: 15px;
  }
  .entry #postbody {
    margin-top: 50px;
  }
  .entry .sec {
    margin-top: 50px;
  }
  .entry .sec .sec_title {
    margin-bottom: 15px;
  }
  .entry .sec .sec_title::before {
    width: 8px;
    height: 8px;
    margin-right: 7px;
  }
  .entry #sec_data.sec .main > ul {
    display: block;
  }
  .entry #sec_data.sec .main > ul li {
    width: 100%;
  }
  .entry #sec_point.sec .point_list > ul {
    grid-template-columns: repeat(2, 1fr);
    gap: 30px 20px;
  }
  .entry #sec_point.sec .point_list > ul > li > figure::before {
    width: 30px;
    height: 30px;
    -webkit-border-radius: 0 0 3px 0;
    border-radius: 0 0 3px 0;
  }
  .entry #sec_point.sec .point_list > ul > li .text {
    line-height: 1.5;
  }
  .entry #sec_gal.sec .pharea ul.photo li {
    padding: 0 5px;
  }
  .entry #sec_gal.sec .pharea ul.photo li .figure {
    -webkit-border-radius: 7px;
    border-radius: 7px;
  }
  .entry #sec_gal.sec .pharea ul.thumbnail {
    margin-top: 10px;
  }
  .entry #sec_gal.sec .pharea ul.thumbnail li {
    padding: 1px;
  }
  .entry #sec_gal.sec .pharea ul.thumbnail li::before {
    border-width: 3px;
  }
  .entry #sec_interview.sec .iv_inner:has(.imgbox) {
    display: block;
  }
  .entry #sec_interview.sec .iv_inner:has(.imgbox) .imgbox {
    width: 100%;
  }
  .entry #sec_interview.sec .iv_inner:has(.imgbox) .imgbox .img {
    position: static;
    top: auto;
  }
  .entry #sec_interview.sec .iv_inner:has(.imgbox) .imgbox .img figure {
    -webkit-border-radius: 0;
    border-radius: 0;
  }
  .entry #sec_interview.sec .iv_inner:has(.imgbox) .main {
    padding-inline: 5vw;
    padding-block: 30px 0;
  }
  .entry #sec_interview.sec .iv_inner .main {
    padding-inline: 5vw;
  }
  .entry #sec_interview.sec .iv_inner .main .iv_body .qa_title {
    padding-inline: 28px;
    margin-bottom: 20px;
  }
  .entry #sec_interview.sec .iv_inner .main .iv_body .qa_title::before, .entry #sec_interview.sec .iv_inner .main .iv_body .qa_title::after {
    width: 16px;
    height: 18px;
  }
  .entry #sec_interview.sec .iv_inner .main .iv_body dl.qa + dl.qa {
    margin-top: 30px;
  }
  .entry #sec_interview.sec .iv_inner .main .iv_body dl.qa dt, .entry #sec_interview.sec .iv_inner .main .iv_body dl.qa dd {
    padding-inline: 15px;
    font-size: 1em;
  }
  .entry #sec_interview.sec .iv_inner .main .iv_body dl.qa dt::before, .entry #sec_interview.sec .iv_inner .main .iv_body dl.qa dd::before {
    width: 24px;
    height: 24px;
    padding-bottom: 1px;
  }

  .pagenavi {
    margin-top: 80px;
  }
  .pagenavi .prev a {
    padding: 20px 20px 20px 0;
  }
  .pagenavi .prev a .image {
    width: 36%;
  }
  .pagenavi .prev a .text {
    padding-left: 15px;
  }
  .pagenavi .prev a .text p:not([class]) {
    font-size: 11px;
    margin-bottom: 0;
  }
  .pagenavi .prev a .text p:not([class])::before {
    width: 6px;
    height: 6px;
    margin-right: 4px;
  }
  .pagenavi .prev a .text .title {
    line-height: 1.4;
  }
  .pagenavi .prev a .text .catloop {
    margin-top: 10px;
    gap: 2px;
  }
  .pagenavi .prev a .text .catloop > span {
    padding: 2px 8px 1px;
    font-size: 9px;
  }
  .pagenavi .prev a .mark {
    right: 0;
    margin-top: -8px;
    width: 16px;
    height: 16px;
  }
}