/*== 共通パーツ ==*/
.section-lead {
  background: var(--gray-bg);
  padding: 2rem;
  margin-bottom: 1rem;
}
.page-header {
  overflow: hidden;
  background: 
    linear-gradient(80deg, rgba(18, 239, 177, 0) 10%, rgba(253, 226, 27, 0.5) 100%),
    linear-gradient(to Right, rgb(18, 239, 177,.1) 30%,rgb(18, 239, 177,.75) 80%),
    var(--base-color);
  color: var(--white);
  padding: 3rem 1rem;
  position: relative;
  .page-title {
    font-size: 2.5rem;
    font-weight: 800;
    @media screen and (min-width:720px){
      font-size: calc(3rem + .5vw);
    }
  }
  .bg-text {
    font-family: "Cormorant Garamond",serif;
    font-weight: 500;
    font-style: italic;
    font-size: 8rem;
    color: var(--white);
    opacity: .25;
    position: absolute;
    bottom: -1.25rem;
    right: 0;
    line-height: 1;
    text-align: right;
    white-space: nowrap;
  }
}
.breadcrumbs {
  background: var(--white);
  padding: .5rem 1em;
  .breadcrumbs-list {
  }
  .breadcrumbs-item {
    display: inline-block;
    font-size: 0.75rem;
  }
  .page-crumbs {
    padding-left: 1rem;
    position: relative;
    vertical-align: text-top;
  }
  .page-crumbs a{
    vertical-align: text-bottom;
  }
  .page-crumbs:before {
    content: "";
    transform: rotate(45deg);
    border-top: 1px solid var(--base-color);
    border-right: 1px solid var(--base-color);
    width: 0.4rem;
    height: 0.4rem;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    margin: auto;
  }
  .home-crumbs {
    line-height: 1;
  }
  .home-icon {
    fill:var(--main-color);
    width: 1.2rem;
    height: 1.2rem;
    vertical-align: bottom;
  }
}
.main {
  .txt a, .child_page_link a {
    text-decoration: underline;
    color: var(--main-color);
    transition: opacity .25s ease;
    opacity: 1;
  }
  .txt a:hover,
  .child_page_link a:hover {
    opacity: .75;
  }
  .sub-title {
    color: var(--feature-color);
    font-size: 2rem;
    margin-bottom: 1rem;
    border-bottom: 1px solid var(--feature-color);
  }
  .grid-wrap {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem 3rem;
    dt {
      font-size: 1.5rem;
    }
  }
  .section-title {
    max-width: var(--section-width);
    margin: 0 auto 2rem;
    background: var(--base-color);
    color: var(--white);
    text-align: center;
  }
  .style-float {
    max-width: 1024px;
    .sub-title {
      background: var(--base-color);
      color: var(--white);
      padding: 1rem 1.5rem;
      margin: 0;
      position: relative;
      top: 2rem;
      left: -1rem;
      z-index: 3;
    }
    .txt {
      font-size: 1.25rem;
    }
  }
  .float-inner {
    position: relative;
    left: calc(1rem - 2px);
  }
  .float-body {
    position: relative;
    z-index: 2;
    background: var(--white);
    padding: 3rem 2rem 2rem;
    border: .25rem solid var(--base-color);
  }
  .float-inner::before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: .5rem;
    left: .5rem;
    background:var(--feature-grdient);
    z-index: 1;
  }
  .style-float:nth-of-type(even){
    margin-left: auto;
  }
  .post-links {
    @media screen and (min-width: 1024px){
      display: grid;
      gap:1rem;
      grid-template-columns:repeat(2,minmax(0,1fr));
    }
  }
  .page-feature {
    position: relative;
    background: linear-gradient(180deg, #00025E 0%, #0792DF 50%, #00C4DA 100%);
    .bg-img img {
      position: absolute;
      left: 0;
      top: 0;
      z-index: 0;
      width: 100%;
      height: 100%;
      object-size:contain;
      opacity: .05;
    }
    .section-title {
      background: none;
      color: var(--diff-color);
    }
  }
  .btn-prev {
    padding-left: 4rem;
    padding-right: 1rem;
  }
  .btn-prev:before {
    border-right: none;
    border-left: var(--white) 2px solid;
    transform: skew(-45deg);
    left: 1.25rem;
    right: auto;
    transition: left .25s ease;
  }
  .btn-prev:hover:before {
    left: 1rem;
    right: auto;
  }
  .btn-next {
    text-align: right;
  }
  .btn-entry {
    width: 100%;
    display: inline-block;
    padding: 1rem;
    border:4px solid var(--main-color) ;
    color: var(--white);
    background: var(--main-color);
    border-radius: 9999px;
    font-size: 1.25rem;
    @media screen and (min-width: 1024px){
      padding: .5rem;
      font-size: 1.125rem;
    }
    .icon {
      fill:var(--white);
      vertical-align: top;
      padding-top: 4px;
      margin-right: .5rem;
      width: 28px;
      height: auto;
    }
  }
  .btn-entry:hover  {
    color: var(--main-color);
    background: var(--white);
    .icon {
      fill:var(--main-color);
    }
  }
}

/*== 会社について ==*/
.about .main{
  /*= アイキャッチ =*/
  .page-feature {
    .sub-title {
      display: inline-block;
      line-height: 1.4;
    }
    .list-challenge {
      background: var(--white);
      .list-item {
        margin-bottom: 1rem;
      }
      .item-label {
        display: inline-block;
        padding: .5rem;
        background: var(--feature-color);
        color: var(--white);
      }
      .txt {
        @media screen and (min-width:768px){
          text-align: right;
        }
      }
      .challenge-1 {
        .item-label {
          background-color:#c70237;
        }
        .txt {
          border-top: 1px solid #c70237;
        }
      }
      .challenge-2 {
        .item-label {
          background-color:#e10e8b;
        }
        .txt {
          border-top: 1px solid #e10e8b;
        }
      }
      .challenge-3 {
        .item-label {
          background-color:#125cbb;
        }
        .txt {
          border-top: 1px solid #125cbb;
        }
      }
      .challenge-4 {
        .item-label {
          background-color:#048f70;
        }
        .txt {
          border-top: 1px solid #048f70;
        }
      }
      .challenge-5 {
        .item-label {
          background-color:#db7100;
        }
        .txt {
          border-top: 1px solid #db7100;
        }
      }
    }
    .section-kih .btn-wrapper {
      text-align: right;
    }
    .btn-history {
      text-align: center;
      margin-top: 4rem;
      .btn {
        font-size: 1.5rem;
        border: 4px solid var(--white);
        border-radius: 9999px;
        padding: 1rem 2rem;
        background: none;
        color: var(--white);
        transition:color .25s ease,background .25s ease; 
      }
      .btn:before {
        display: none;
      }
      .btn:hover{
        background: var(--white);
        color: var(--base-color);
      }
    }
  }
  /*= 所在地 =*/
  .base-body {
    .base-name {
      font-size: 1.2rem;
    }
    .address-item {
      display:block;
      padding-bottom: 0.5rem;
    }
  }
  .main-base {
    background: var(--gray-bg);
    max-width: var(--section-width);
    margin:0 auto 2rem;
    display: grid;
    gap: 2rem;
    @media screen and (min-width:720px){
      grid-template-columns:minmax(0,40%) minmax(0,60%);
    }
    .g-map {
      width: 100%;
      height: 100%;
      min-height: 420px;
    }
  }
  .base-list {
    display: grid;
    gap: 2rem;
    @media screen and (min-width:720px){
      grid-template-columns: repeat(2,1fr);
    }
    @media screen and (min-width:1024px){
      grid-template-columns: repeat(3,1fr);
    }
    @media screen and (min-width:1280px){
      grid-template-columns: repeat(5,1fr);
    }
  }
  .base-item,.main-base-info {
    padding: 1rem;
    background: var(--gray-bg);
  }
  .base-name {
    color: var(--feature-color);
    text-align: center;
    padding-bottom: .5rem;
    margin-bottom: .5rem;
    border-bottom:solid 1px var(--feature-color);
  }
  .address-label {
    display: inline-block;
    font-size: .875rem;
    padding: 0 .25rem;
    background: var(--feature-color);
    color: #fff;
    margin-right: .5rem;
    min-width: 42px;
    text-align: center;
  }
  /*= 沿革 =*/
  .history-timeline {
    display: grid;
    grid-template-columns: 80px 1fr;
    .history-year,.history-body {
      padding: 0.5rem 0;
      margin: 0.5rem 0;
    }
    .history-year {
      text-align: right;
      padding-right: 1em;
    }
    .history-body {
      border-left: solid 1px #ddd;
      padding-left: 1em;
    }
    img {
      display: block;
      margin-top: 0.5rem;
      @media screen and (min-width:1024px) {
        max-width: 500px;
      }
    }
  }
}

/*== 仕事について ==*/
.works .main{
  .overview-list {
    display: grid;
    gap: 2rem;
    @media screen and (min-width: 768px){
      grid-template-columns: repeat(2,minmax(0,1fr));
    }
    @media screen and (min-width: 1440px){
      grid-template-columns: repeat(4,minmax(0,1fr));
    }
  }
  .overview-item {
    position: relative;
    &::after{
      content: "";
      width: 100%;
      height: 100%;
      background:var(--feature-grdient);
      position: absolute;
      top: .5rem;
      left: .5rem;
    }
  }
  .overview-item-inner {
    padding: 1rem;
    background: var(--gray-bg);
    position: relative;
    z-index: 2;
    height: 100%;
  } 
  .overview-header {
    font-size: 1.25rem;
    color: var(--base-color);
    padding-bottom: .5rem;
    margin-bottom: .5rem;
    border-bottom: 1px solid var(--base-color);
  }
  .overview-body .txt {
    font-size: 1rem;
    padding-bottom: .5rem;
  }
  .overview-body .txt:last-of-type {
    padding-bottom: 0;
  }
  .case-list {
    display: grid;
    gap: 2rem;
    @media screen and (min-width: 1024px){
      grid-template-columns: repeat(3, minmax(0,1fr));
    }
    @media screen and (min-width: 1440px){
      grid-template-columns: repeat(4, minmax(0,1fr));
    }
    @media screen and (min-width: 1600px){
      grid-template-columns: repeat(5, minmax(0,1fr));
    }
  }
  .case-block {
    background: var(--gray-bg);
  }
  .case-title {
    font-size: 1.25rem;
    margin: .5rem 1rem;
    padding-bottom: .5rem;
    color: var(--base-color);
    border-bottom: 1px solid var(--base-color);
  }
  .case-body{
    margin: .5rem 1rem 1rem;
  }
}

/*== データで見るタカノスマイル ==*/
.data .main{
  .data-list {
    display: grid;
    gap: 2rem;
    @media screen and (min-width: 1280px){
      grid-template-columns: repeat(3, minmax(0,1fr));
    }
  }
  .data-item {
    background: var(--gray-bg);
    padding: 1rem;
  }
  .data-head {
    color: var(--base-color);
    border-bottom: 1px solid var(--base-color);
  }
  .data-body {
    line-height: 1.2;
    text-align: right;
    font-size: 5rem;
    color: var(--main-color);
  }
  .unit {
    color: var(--black);
    font-size: 2rem;
    padding: 0 .5rem;
  }
  .data-note {
    text-align: right;
  }
  .grapch-label {
    font-size: 2rem;
    vertical-align: super;
    margin-right: 1rem;
    line-height: 1;
  }
}

/*== 制度・福利厚生 ==*/
.welfare .main{
  .list-training {
    display: grid;
    gap: 1rem;
    margin-bottom: 1rem;
    @media screen and (min-width: 768px){
      grid-template-columns: repeat(3,minmax(0,1fr));
    }
    .list-item{
      padding: 1rem;
      background:var(--gray-bg) ;
      color: var(--base-color);
      display: flex;
      align-items: center;
      text-align: center;
    }
    .item-inner {
      font-size: 1.25rem;
      width: 100%;
    }
  }
  .list-combine {
    display: grid;
    gap: 1rem;
    margin-bottom: 1rem;
    @media screen and (min-width: 768px){
      grid-template-columns: repeat(2,minmax(0,1fr));
    }
    @media screen and (min-width: 1024px){
      grid-template-columns: repeat(3,minmax(0,1fr));
    }
    .list-item{
      padding: 1rem;
      background:var(--gray-bg) ;
    }
    .combine-title {
      font-size: 1.25rem;
      color: var(--base-color);
      padding-bottom: .5rem;
    }
    .combine-body {
      border-top: 1px solid var(--base-color);
      padding-top: .5rem;
    }
  }
  .list-circle {
    display: grid;
    gap: 1rem;
    @media screen and (min-width: 768px){
      grid-template-columns: repeat(2,minmax(0,1fr));
    }
    .list-item {
      background: var(--gray-bg);
      position: relative;
      padding:1rem 1rem 1rem 3rem ;
      font-size: 1.25rem;
      color: var(--base-color);
    }
    .list-item::before {
      content: "";
      width: .5rem;
      height: 1rem;
      transform: rotate(45deg);
      border-color:transparent var(--base-color) var(--base-color) transparent;
      border-style: solid;
      border-width: 2px;
      position: absolute;
      left: 1.25rem;
      top: 1.25rem;
    }
  }
  .section-tour .btn-wrapper {
    text-align: center;
  }
}

/*== 先輩紹介 ==*/
.members .main{
  .section-inner {
    padding: 0;
  }
  .page-feature .section-title {
    margin-bottom: 0;
  }
  .interview-list {
    margin-top: 4rem;
  }
  .interview-member {
    position: relative;
    overflow: hidden;
    padding: 4rem 1rem 1rem;
    margin-bottom: 4rem;
  }
  .label-pos{
    display: inline-block;
    color: var(--white);
    padding:0 .5rem ;
    background: var(--main-color);
  }
  .label-name{
    margin-left: .5rem;
    display: inline-block;
    color: var(--base-color);
  }
  .label-join{
    margin-left: 1rem;
    font-size: .875rem;
    display: inline-block;
  }
  .interview-body {
    position: relative;
    z-index: 2;
    background: rgba(255,255,255,.5);
    box-shadow: 0 0 .5rem var(--base-color-shadow);
  }
  .txt-wrap {
    grid-area:txt;
    padding: 1rem;
  }
  .img-wrap {
    grid-area:img;
  }
  .bg-text {
    font-family: "Cormorant Garamond",serif;
    font-weight: 500;
    font-style: italic;
    font-size: 8rem;
    color: var(--main-color);
    background: var(--bg-text-gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    position: absolute;
    top: -1rem;
    line-height: 1;
  }
  .interview-title {
    font-family: 'Noto Sans JP';
    font-weight: 800;
    font-size: 1.5rem;
  }
  .btn-wrapper {
    text-align: right;
  }
  @media screen and (min-width:1024px){
    .interview-list {
      margin-top: 0;
    }
    .interview-member {
      margin: 0;
      padding: 4rem 0;
    }
    .interview-body {
      width: 60%;
      display: grid;
      grid-template-columns: 2fr 3fr;
      grid-template-areas:"img txt";
    }
    .img-wrap img{
      object-fit: cover;
      object-position: center;
      width: 100%;
      height: 100%;
    }
    .txt-wrap {
      padding: 3rem;
      display: flex;
      flex-direction: column;
    }
    .bg-text  {
      font-size: 18vw;
      top: 50%;
      transform: translateY(-50%);
      white-space: nowrap;
    }
    .interview-member:nth-of-type(odd) .bg-text {
      right: 0;
    }
    .interview-member:nth-of-type(even) .interview-body {
      left: 40%;
      grid-template-columns:3fr 2fr ;
      grid-template-areas:"txt img";
    }
    .btn-wrapper {
      padding-top: .5rem;
      margin-top: auto;
    }
  }
}

/*== 先輩紹介 > 個別ページ ==*/
.parent-members .main {
  .section, .section-inner {
    padding: 0;
    position: relative;
  }
  .img-wrap {
    @media screen and (min-width: 1024px){
      width: 60%;
      height: 60vh;
    }
    img {
      width: 100%;
      @media screen and (min-width: 1024px){
        height: 100%;
        object-fit: cover;
        object-position: top left;
        z-index: 2;
        position: relative;
      }
    }
  }
  .section:nth-of-type(even) .img-wrap{
    @media screen and (min-width: 1024px){
      margin-left: 40%;
    }
  }
  .section-catch{
    @media screen and (min-width: 1024px){
      margin-bottom: 4rem;
    }
    .txt-wrap {
      z-index: 2;
      background: var(--base-color);
      position: relative;
      box-shadow: 0 0 .5rem var(--base-color-shadow);
      @media screen and (min-width: 1024px){
        position: absolute;
        width: 60%;
        left: 40%;
        top: 50%;
        transform: translateY(-50%);
      }
    }
    .catch-copy {
      font-size: 2rem;
      color: var(--white);
      padding:1rem;
      line-height: 1.4;
    }
    .interview-name {
      font-size: 1.25rem;
      text-align: right;
      color: var(--white);
      padding:0 1rem 1rem;
    }
    .label {
      padding-left: 1rem;
      display: inline-block;
    }
  }
  .interview-list {
    position: relative;
    z-index: 3;
    padding: 1rem;
    .list-item:not(:last-child) {
      margin-bottom: 1rem;
      padding-bottom: 1rem;
      border-bottom: 2px solid var(--sep-color);
    }
    @media screen and (min-width: 1024px){
      margin-left: 40%;
      width: 60%;
      padding: 2rem;
      background: var(--white-opacity);
      box-shadow: 0 0 .5rem var(--base-color-shadow);
      transform:translateY(-25%);
    }
  }
  .section:nth-of-type(even) .interview-list {
    @media screen and (min-width: 1024px){
      margin-left: 0;
      margin-right: 40%;
    }
  }
  .question {
    font-size: 1.5rem;
    padding-left: 2.5rem;
    margin-bottom: 1rem;
    position: relative;
    line-height: 1.4;
    color:var(--base-color);
    &:before {
      content: "";
      position: absolute;
      left: 0;
      top: 1.1rem;
      margin: auto;
      width:2rem;
      height: 2px;
      background: var(--base-color);
    }
  }
  .answer {
  }
  .post-links {
    padding: 1rem 1rem 2rem;
    .btn {
      width: 100%;
    }
  }
  .section-dayoff {
    background: var(--main-color);
    margin-bottom: 1rem;
    .section-inner {
      padding: 2rem;
    }
    .dayoff-desc {
      color: var(--white);
      padding-bottom: 1rem;
      @media screen and (min-width: 1024px){
        width: 50%;
      }
    }
    .question {
      color: var(--accent-color);
    }
    .question:before {
      background: var(--accent-color);
    }
    .dayoff-img {
      @media screen and (min-width: 1024px){
        width: 80%;
        margin-left: auto;
        display: grid;
        grid-template-columns: repeat(2,minmax(0,1fr));
        gap: 1rem;
      }
    }
    .img-wrap{
      margin: 0!important;
      width: auto;
      height: auto;
    }
    .img-wrap:first-child {
      padding-bottom: .5rem;
    }
  }
}

/*== 募集条件 ==*/
.new-graduate .main,.career .main{
  .list-flow {
    display: grid;
    gap: 2rem;
    @media screen and (min-width: 1024px){
      grid-template-columns: repeat(4,minmax(0,1fr));
    }
    .list-item {
      position: relative;
      text-align: center;
      margin: 4rem 0;
      padding: 3rem 1rem 1rem;
      background: var(--white);
      border: 2px solid var(--base-color);
    }
    .list-item::before {
      content: "";
      position: absolute;
      width: 4rem;
      height: 4rem;
      border-color:transparent var(--base-color) var(--base-color) transparent;
      border-style: solid;
      border-width:2px;
      margin: auto;
      left: 0;
      right: 0;
      bottom: calc(100% + 5rem);
      transform: rotate(45deg);
      @media screen and (min-width: 1024px){
        width: 1rem;
        height: 1rem;
        left: auto;
        right: calc(100% + .75rem);
        top: 0;
        bottom: 0;
        border-color:var(--base-color) var(--base-color) transparent transparent;
      }
    }
    .list-item:first-child::before{
      display: none;
    }
    .flow-step {
      font-size: 2rem;
      width: 4rem;
      height: 4rem;
      background: var(--base-color);
      color: var(--white);
      position: absolute;
      margin: auto;
      left: 0;
      right: 0;
      top: -2rem;
      line-height: 4rem;
    }
    .flow-name {
      font-weight: 800;
      font-size: 1.5rem;
    }
    .flow-desc {
    }
    .flow-note {
      font-weight: 400;
      margin-top: .5rem;
      padding: 0.5rem;
      background: var(--gray-bg);
    }
    .entry-list {
      margin-top: .5rem;
    }
    .entry-item {
      margin-bottom: .5rem;
    }
  }
  .section-location {
    .txt {
      padding:.5rem ;
      background: var(--gray-bg);
    }
    .btn-wrapper {
      text-align: center;
    }
  }
  .condition-table {
    max-width: 1024px;
    margin: 0 auto;
    padding: 1rem;
    border: 1px solid var(--feature-color);
  }
  .list-condition .list-item {
    display: grid;
    gap: .5rem;
    padding: .5rem 0;
    border-bottom: 1px solid var(--sep-color);
    @media screen and (min-width: 1024px){
      grid-template-columns: 200px 1fr;
    }
  }
  .condition-body .list-item{
    position: relative;
    display: block;
    border:none;
  }
  .condition-body .condition-name {
    font-size: 1.125rem;
  }
  .condition-body .condition-desc {
    margin-top: .25rem;
    padding: .25rem 0 1rem;
    border-top: 1px solid var(--sep-color);
  }
  .career-path .condition-name {
    color: var(--base-color);
  }
  .list-business,.list-base {
    margin-left: .5rem;
  }
  .list-base .list-item,
  .list-business .list-item{
    padding: .25rem .75rem;
    &:before {
      content: "";
      width: 4px;
      height: 4px;
      border-radius: 4px;
      background: var(--base-color);
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      margin: auto;
    }
  }
  .condition-head {
    padding: .5rem;
    background: var(--feature-color);
    color: var(--white);
    font-weight: 600;
  }
  .condition-note {
    background: var(--gray-bg);
    margin-top: 0.5rem;
    padding: 0.5rem;
    p:not(:last-child) {
      margin-bottom: 0.5rem;
    }
  }
  .allow-list {
    .list-item{
      border-bottom: 1px solid var(--sep-color);
    }
    .list-item:last-of-type{
      border-bottom: none;
    }
    .condition-desc {
      padding: .5rem;
      background: var(--gray-bg);
    }
  }
}

/*== 選考申込・お問い合わせ ==*/
.main .form-wrapper {
  .contact-tel {
    display: inline-block;
    .btn-entry {
      padding: .5rem 2rem;
    }
  }
  .form-wrap {
    margin:0 auto 24px;
    max-width: 960px;
  }
  .form-name {
    background: var(--base-color);
    color:var(--white);
    height: 100%;
    display: flex;
    align-items: center;
    padding: .5rem;
  }
  .form-input {
  }
  .form-parts{
    margin-bottom: 14px;
    label {
      padding: 2px 4px;
      border-bottom: none;
      display: inline-block;
    }
    input,
    textarea {
      padding: 4px;
      border:1px solid var(--base-color) ;
      width: 100%;
      vertical-align: bottom;
      box-sizing: inherit;
    }
    .wpcf7-checkbox,
    .wpcf7-radio {
      display: inline-block;
      vertical-align: text-bottom;
    }
    .wpcf7-checkbox .wpcf7-list-item {
      margin:0 16px 8px 0;
    }

    .wpcf7-form-control-wrap label{
      background: none;
      border: none;
    }

    &.postal-code-wrapper .wpcf7-form-control-wrap{
      display: inline-block;
      vertical-align: middle;
      width: calc(100% - 1.5rem);
      margin-left: .5rem;
    }

    input[type="checkbox"] + .wpcf7-list-item-label{
      padding-left: 36px;
      position: relative;
    }

    .wpcf7-radio label {
      padding-left: 28px;
      position: relative;
      top: 4px;
    }

    input[type="checkbox"] + .wpcf7-list-item-label:before,
    .wpcf7-checkbox .wpcf7-list-item-label::before,
    .wpcf7-radio .wpcf7-list-item-label::before{
      width: 24px;
      height: 24px;
      border: 1px solid var(--base-color);
      position: absolute;
      left: 0;
      top: 0;
    }

    .wpcf7-radio .wpcf7-list-item-label::before{
      width: 20px;
      height: 20px;
      border-radius: 12px;
      top: 4px;
    }

    input[type="checkbox"]:checked + .wpcf7-list-item-label:after,
    .wpcf7-checkbox input[type="checkbox"]:checked  + .wpcf7-list-item-label::after {
      width: 8px;
      height: 12px;
      border-right:var(--main-color) 2px solid;
      border-bottom:var(--main-color) 2px solid;
      position: absolute;
      transform: rotate(45deg);
      left: 8px;
      top: 4px;
    }
    .wpcf7-radio input[type="radio"]:checked + .wpcf7-list-item-label::after {
      width: 14px;
      height: 14px;
      border-radius: 7px;
      background:var(--main-color);
      position: absolute;
      left: 4px;
      top: 8px;
    }
    .form-select{
      select {
      }
      position: relative;
      &::before{
        content: "";
        width: 0;
        height: 0;
        border: 8px solid transparent;
        border-top: 8px solid var(--main-color);
        position: absolute;
        right: 8px;
        top: calc(50% + 4px);
        transform: translateY(-50%);
      }
      select{
        padding: 5px 24px 5px 5px;
        width: 100%;
        border: 1px solid var(--base-color);
      }
    }
    .form-radio {
      .wpcf7-list-item{
        margin: 0 8px 0 0;
      }
      label {
        color: var(--base-color);
      }
    }
    .form-date .wpcf7-form-control-wrap{
      display: inline-block;
      width: 100%;
      input::-webkit-calendar-picker-indicator {
        cursor: pointer;
      }
    }
    &.acceptance_btn {
      display:block;
      text-align: center;
    }
  }
  .check-wrapper,.radio-wrapper {
    .form-input {
      padding: .5rem 0;
    }
  }
  .check-wrapper .form-input label {
    padding: 0;
  }
  .radio-wrapper .wpcf7-list-item {
    margin: 0 1rem 0 0;
  }
  .btn-wrapper {
    text-align: center;
    .submit-wrapper{
      display: inline-block;
      position: relative;
      &:before {
        content: "";
        width: 2rem;
        height: .4rem;
        position: absolute;
        top: 0;
        bottom: 0;
        right: 1.25rem;
        margin: auto;
        border: transparent 1px solid ;
        border-right: var(--white) 2px solid ;
        border-bottom: var(--white) 1px solid ;
        transform:skew(45deg);
        transition:right .25s ease;
        z-index: 2;
      }
    }
    input[type="submit"]{
      text-align: left;
      color: var(--white);
      width: 100%;
    }
    .submit-wrapper:hover{
      color: var(--diff-color);
      &:before{
        right: 1rem;
      }
      input[type="submit"]{
        color: var(--diff-color);
      }
    }
    input[type="submit"] + .wpcf7-spinner {
      display: none;
    }
  }
  .spinner_wrapper {
    padding-top: 1rem;
    text-align: center;
  }

  .wpcf7-list-item-label {
    vertical-align: text-bottom;
  }

  .wpcf7-not-valid-tip {
    padding:4px 0;
  }

  .recapcha-text a {
    text-decoration: underline;
    color: var(--main-color);
    &:hover {
      color: var(--base-color);
    }
  }

  @media screen and (min-width: 768px){
    .form-parts {
      display: grid;
      grid-template-columns: minmax(0,1fr) minmax(0,2fr);
      gap: 2rem;
      align-items: center; 
      margin-bottom: 1rem;
      padding-bottom:1rem ;
      border-bottom: 1px solid var(--sep-color);
      label {
        padding-right: 8px;
        height: 100%;
      }
    }
    .item-wide {
      display: block;
    }
    .section-lead{
      text-align: center;
    }
    .recapcha-text {
      text-align: center;
    }
  }
}


/*== プライバシーポリシー ==*/
.privacy-policy .main {
  .page-feature {
    color: var(--white);
  }
  .list-disc {
    padding: 1rem;
    background: var(--gray-bg);
    li {
      padding-left: 1rem;
      position: relative;
    }
    li:before {
      content: "";
      width: .25rem;
      height: .25rem;
      background-color: var(--base-color);
      border-radius: 9999px;
      position: absolute;
      left: 0;
      top: .75rem;
    }
  }
  .txt {
    margin-bottom: .5rem;
  }
}

/*= お知らせ =*/
.news-page .section-inner {
  @media screen and (min-width: 1024px){
    display: grid;
    gap:2rem;
    grid-template-columns:minmax(0,3fr) minmax(0,1fr);
  }
  .body_main {
    margin-bottom: 2rem;
  }
  .post-content {
    padding: 4rem;
    border: 2px solid var(--sep-color);
  }
  .post-date {
    text-align: right;
    font-size: .875rem;
    padding: .5rem;
    background: var(--sep-color);
  }
  .btn {
    width:100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .post-links {
    .btn-wrapper{
      width: 100%;
    }
    .prev-btn-wrapper {
      grid-column: 1;
      justify-self: start;
    }
    .next-btn-wrapper {
      grid-column: 2;
      justify-self: end;
    }
  }
  .widget-archives {
    .widget-title {
      padding: .5rem;
      background: var(--base-color);
      color: var(--white);
      margin-bottom: .5rem;
    }
    .archive-item {
      padding: 8px;
      border: 1px solid var(--base-color);
    }
    .archive-item a {
      color: var(--main-color);
      text-decoration: underline;
      transition: color .25s ease;
    }
    .archive-item a:hover {
      color: var(--diff-color);
    }
  }

  .pagination {
    margin: 2rem 0;
    span, a {
      padding: 0 .5rem;
      margin-right: .1rem;
      display: inline-block;
      border: 1px solid var(--main-color);
      color: var(--main-color);
      text-decoration: none;
      transition: all .25s ease;
    }
    a:hover, .current {
      color: var(--white);
      background: var(--main-color);
    }
  }
}

/*= お知らせ一覧 =*/
.news-page .section-inner .archive-list {
  .btn-wrapper {
    margin-top: 0;
  }
  .btn {
    background:none;
    color: var(--base-color);
    text-decoration: underline;
    padding: 0 4rem 0 0;
  }
  .btn:before {
    border-color: transparent var(--base-color) var(--base-color) transparent;
  }
  .btn:hover {
    color: var(--diff-color);
  }
  .entry{
    padding-bottom: 1rem;
    margin-bottom: 1rem;
    border-bottom: 1px solid var(--sep-color);
  }
  .post-date {
    background: none;
    padding: 0;
  }
}