@charset "UTF-8";

/* ==========================================================================
  MODULE
========================================================================== */
/* --------------------------------------------------------------------------
  NEWS
-------------------------------------------------------------------------- */
@media all and (min-width: 768px), print {
  .c-news {
  }
  .c-news-list {
  }
  .c-news-list-item {
  }
  .c-news-list-item + .c-news-list-item {
    padding-top: calc(20 / var(--font-size) * 1rem);
    margin-top: calc(20 / var(--font-size) * 1rem);
    border-top: calc(1 / var(--font-size) * 1rem) solid var(--gray-color-200);
  }
  .c-news.c-news--pickup .c-news-list-item + .c-news-list-item {
    margin-top: calc(0 / var(--font-size) * 1rem);
    border-top: 0;
    padding-top: 0;
  }
  .c-news-list-item__in {
    display: flex;
  }
  .c-news-list__header {
    flex-shrink: 0;
    margin-right: calc(40 / var(--font-size) * 1rem);
  }
  .c-news.c-news--pickup .c-news-list__header {
    position: relative;
    padding: calc(10 / var(--font-size) * 1rem) calc(15 / var(--font-size) * 1rem) calc(10 / var(--font-size) * 1rem) 0;
    margin-right: calc(15 / var(--font-size) * 1rem);
    border-right: calc(1 / var(--font-size) * 1rem) solid var(--primary-color-100);
  }
  .c-news-date {
    font-size: calc(16 / var(--font-size) * 1rem);
    line-height: 1.6;
  }
  .c-news.c-news--pickup .c-news-date {
    line-height: 1.7;
  }
  .c-news-list__body {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    width: 100%;
  }
  .c-news.c-news--pickup .c-news-list__body {
    padding: calc(10 / var(--font-size) * 1rem) 0;
  }
  .c-news-txt {
    font-size: calc(16 / var(--font-size) * 1rem);
    line-height: 1.7;
  }
  .c-news-txt--spacing-small{
    letter-spacing: -0.05em;
  }
  .c-news.c-news--pickup .c-news-txt {
    font-size: calc(16 / var(--font-size) * 1rem);
  }
  .c-news-txt a {
    color: var(--blue-color-100);
  }
  .c-news-cat{
    font-size: calc(14 / var(--font-size) * 1rem);
    display: inline-block;
    background-color: var(--primary-color-100);
    color: var(--white-color);
    padding:calc(4 / var(--font-size) * 1rem) calc(8 / var(--font-size) * 1rem);
    min-width: calc(88 / var(--font-size) * 1rem);
    text-align: center;
    margin-right: calc(12 / var(--font-size) * 1rem);
  }
  .c-news-cat--house{
    background-color: var(--house-color-100);
  }
  .c-news-cat--housingcomplex{
    background-color: var(--housingcomplex-color-100);
  }
  .c-news-cat--registration{
    background-color: var(--registration-color-100);
  }
  .c-news-cat--zehinfo{
    background-color: var(--zehinfo-color-100);
  }
}

@media all and (max-width: 767px) {
  .c-news {
  }
  .c-news-list {
  }
  .c-news-list-item {
  }
  .c-news-list-item + .c-news-list-item {
    margin-top: calc(40 / var(--font-size) * 1rem);
  }
  .c-news.c-news--pickup .c-news-list-item + .c-news-list-item {
    margin-top: calc(25 / var(--font-size) * 1rem);
    border-top: 0;
    padding-top: 0;
  }
  .c-news-list-item__in {
    display: flex;
    flex-direction: column;
    position: relative;
  }
  .c-news-list__header {
    flex-shrink: 0;
  }
  .c-news.c-news--pickup .c-news-list__header {
    margin-bottom: calc(4 / var(--font-size) * 1rem);
    max-width: calc(120 / var(--font-size) * 1rem);
    width: 100%;
  }
  .c-news-date {
    font-size: calc(16 / var(--font-size) * 1rem);
    line-height: 1.6;
  }
  .c-news.c-news--pickup .c-news-date {
    line-height: 1.7;
  }
  .c-news-list__body {
    /* margin-top: calc(8 / var(--font-size) * 1rem); */
  }
  .c-news-txt {
    font-size: calc(14 / var(--font-size) * 1rem);
    line-height: 1.7;
  }
  .c-news.c-news--pickup .c-news-txt {
    font-size: calc(14 / var(--font-size) * 1rem);
  }
  .c-news-txt a {
    color: var(--blue-color-100);
  }
  .c-news-cat{
    font-size: calc(14 / var(--font-size) * 1rem);
    display: inline-block;
    background-color: var(--primary-color-100);
    color: var(--white-color);
    padding:calc(4 / var(--font-size) * 1rem) calc(8 / var(--font-size) * 1rem);
    min-width: calc(88 / var(--font-size) * 1rem);
    text-align: center;
    position: absolute;
    top: 0;
    left: calc(130 / var(--font-size) * 1rem);
  }
  .c-news-cat--house{
    background-color: var(--house-color-100);
  }
  .c-news-cat--housingcomplex{
    background-color: var(--housingcomplex-color-100);
  }
  .c-news-cat--registration{
    background-color: var(--registration-color-100);
  }
  .c-news-cat--zehinfo{
    background-color: var(--zehinfo-color-100);
  }

}

/* --------------------------------------------------------------------------
  CONTACT
-------------------------------------------------------------------------- */

@media all and (min-width: 768px), print {
  .l-page-sec + .c-contact {
    margin-top: calc(90 / var(--font-size) * 1rem);
  }
  .tab.tab--faq + .c-contact {
    margin-top: calc(90 / var(--font-size) * 1rem);
  }
  .notification-page-sec + .c-contact {
    margin-top: calc(60 / var(--font-size) * 1rem);
  }
  .c-contact {
    --contact-bg: var(--primary-color-10);
    --contact-main-color: var(--primary-color-100);
  }
  .c-contact__in {
  }
  .c-contact__body {
    background-color: var(--contact-bg);
    border: var(--contact-main-color) calc(1 / var(--font-size) * 1rem) solid;
    border-radius: calc(20 / var(--font-size) * 1rem);
    padding: calc(40 / var(--font-size) * 1rem) calc(60 / var(--font-size) * 1rem);
  }
  .c-contact__header {
    margin-bottom: calc(36 / var(--font-size) * 1rem);
  }
  .c-contact__content {
  }
  .c-contact-lead {
    text-align: center;
  }
  .c-contact-box {
    margin-top: calc(32 / var(--font-size) * 1rem);
  }
  .c-contact-box__in {
  }
  .c-contact-box__header {
    text-align: center;
    margin-bottom: calc(28 / var(--font-size) * 1rem);
  }
  .c-contact-box__header-title {
    font-size: calc(20 / var(--font-size) * 1rem);
    font-weight: bold;
  }
  .c-contact-box-bar {
    background-color: var(--white-color);
  }
  .c-contact-box-bar__in {
    padding: calc(16 / var(--font-size) * 1rem);
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .c-contact-box-bar__in.c-contact-box-bar__in--column {
    flex-direction: column;
  }
  .c-contact-box-bar__in.c-contact-box-bar__in--column .c-contact-box-bar__header {
    margin-bottom: calc(20 / var(--font-size) * 1rem);
    align-self: flex-start;
  }
  .c-contact-box-bar__in.c-contact-box-bar__in--column .c-contact-box-bar__body {
    display: flex;
    justify-content: center;
  }
  .c-contact-box-bar__tel {
  }
  .c-contact-tel {
  }
  .c-contact-tel__in {
    display: flex;
    align-items: center;
  }
  .c-contact-tel-ico {
    width: calc(16 / var(--font-size) * 1rem);
    height: calc(22 / var(--font-size) * 1rem);
  }
  .c-contact-tel-ico::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: url("/r07/assets/img/common/ico_tel.svg") center center no-repeat;
    background-size: contain;
  }
  .c-contact-tel-num {
    font-size: calc(30 / var(--font-size) * 1rem);
    font-weight: 900;
    line-height: 1.3;
  }
  .c-contact-tel-num span {
    vertical-align: text-top;
  }
  .c-contact-tel-num span.space-3 {
    letter-spacing: calc(-30 / 100 * 1em);
  }
  .c-contact-tel-num span.space-1 {
    letter-spacing: calc(-10 / 100 * 1em);
  }
  .c-contact-box-bar__info {
    margin-left: calc(30 / var(--font-size) * 1rem);
  }
  .c-contact-info {
  }
  .c-contact-info-time .c-txt {
  }
  .c-contact-info-note {
    margin-top: calc(5 / var(--font-size) * 1rem);
  }
}
@media all and (max-width: 767px) {
  .l-page-sec + .c-contact {
    margin-top: calc(90 / var(--font-size) * 1rem);
  }
  .tab.tab--faq + .c-contact {
    margin-top: calc(50 / var(--font-size) * 1rem);
  }
  .notification-page-sec + .c-contact {
    margin-top: calc(50 / var(--font-size) * 1rem);
  }
  .c-contact {
    --contact-bg: var(--primary-color-10);
    --contact-main-color: var(--primary-color-100);
  }
  .c-contact__in {
  }
  .c-contact__body {
    background-color: var(--contact-bg);
    border: var(--contact-main-color) calc(1 / var(--font-size) * 1rem);
    border-radius: calc(15 / var(--font-size) * 1rem);
    padding: calc(30 / var(--font-size) * 1rem) calc(15 / var(--font-size) * 1rem);
  }
  .c-contact__header {
    margin-bottom: calc(30 / var(--font-size) * 1rem);
  }
  .c-contact__content {
  }
  .c-contact-lead {

  }
  .c-contact-lead .c-txt{
    --txt-line-height: 1.8;
  }
  .c-contact-box {
    margin-top: calc(30 / var(--font-size) * 1rem);
  }
  .c-contact-box__in {
  }
  .c-contact-box__header {
    margin-bottom: calc(20 / var(--font-size) * 1rem);
  }
  .c-contact-box__header-title {
    font-size: calc(16 / var(--font-size) * 1rem);
    font-weight: bold;
    line-height: 1.8;
  }
  .c-contact-box-bar {
    background-color: var(--white-color);
  }
  .c-contact-box-bar__in {
    padding: calc(16 / var(--font-size) * 1rem);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
  }
  .c-contact-box-bar__tel {
  }
  .c-contact-tel {
  }
  .c-contact-tel__in {
    display: flex;
    align-items: center;
  }
  .c-contact-tel-ico {
    width: calc(16 / var(--font-size) * 1rem);
    height: calc(22 / var(--font-size) * 1rem);
  }
  .c-contact-tel-ico::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: url("/r07/assets/img/common/ico_tel.svg") center center no-repeat;
    background-size: contain;
  }
  .c-contact-tel-num {
    font-size: calc(26 / var(--font-size) * 1rem);
    font-weight: 900;
    line-height: 1.3;
  }
  .c-contact-tel-num span {
    vertical-align: text-top;
  }
  .c-contact-tel-num span.space-3 {
    letter-spacing: calc(-30 / 100 * 1em);
  }
  .c-contact-tel-num span.space-1 {
    letter-spacing: calc(-10 / 100 * 1em);
  }
  .c-contact-box-bar__info {

  }
  .c-contact-info {
    margin-top: calc(5 / var(--font-size) * 1rem);
  }
  .c-contact-info-time .c-txt {
  }
  .c-contact-info-note {
    margin-top: calc(12 / var(--font-size) * 1rem);
  }
  .c-contact-info-note .c-note-txt{
    line-height: 1.5;
}
}
@media all and (max-width: 374px) {
  .c-contact-tel-num{
    font-size: calc(20 / var(--font-size)* 1rem);
  }
}

/* --------------------------------------------------------------------------
  BREADCRUMB
-------------------------------------------------------------------------- */
@media all and (min-width: 768px), print {
  .breadcrumb-sec {
  }
  .breadcrumb-sec__in {
    padding: 0 calc(16 / var(--font-size)* 1rem);
    max-width: calc(1152 / var(--font-size)* 1rem);
    margin: auto;
  }
  .breadcrumb-sec__body {
    padding: calc(13 / var(--font-size) * 1rem) 0;
  }
  .breadcrumb-list {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: calc(6 / var(--font-size) * 1rem) calc(16 / var(--font-size) * 1rem);
  }
  .breadcrumb-list-item {
    position: relative;
  }
  .breadcrumb-list-item + .breadcrumb-list-item {
    padding-left: calc(16 / var(--font-size) * 1rem);
  }
  .breadcrumb-list-item + .breadcrumb-list-item::before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    -webkit-mask: url("/r07/assets/img/common/breadcrumb_arrow.svg");
    mask: url("/r07/assets/img/common/breadcrumb_arrow.svg");
    -webkit-mask-size: contain;
    mask-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    width: calc(5 / var(--font-size) * 1rem);
    height: calc(8 / var(--font-size) * 1rem);
    background-color: var(--gray-color-500);
  }
  .breadcrumb-list-item__in {
  }
  .breadcrumb-list-txt {
    font-size: calc(12 / var(--font-size) * 1rem);
    color: var(--gray-color-500);
    transition: all 0.3s;
  }
  .breadcrumb-list-txt:hover {
    color: var(--primary-color-100);
  }
}
@media all and (max-width: 767px) {
  .breadcrumb-sec {
  }
  .breadcrumb-sec__in {
    padding: 0 calc(16 / var(--font-size)* 1rem);
    max-width: calc(1152 / var(--font-size)* 1rem);
    margin: auto;
  }
  .breadcrumb-sec__body {
    padding: calc(13 / var(--font-size) * 1rem) 0;
  }
  .breadcrumb-list {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: calc(6 / var(--font-size) * 1rem) calc(8 / var(--font-size) * 1rem);
  }
  .breadcrumb-list-item {
    position: relative;
  }
  .breadcrumb-list-item + .breadcrumb-list-item {
    padding-left: calc(10 / var(--font-size) * 1rem);
  }
  .breadcrumb-list-item + .breadcrumb-list-item::before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    -webkit-mask: url("/r07/assets/img/common/breadcrumb_arrow.svg");
    mask: url("/r07/assets/img/common/breadcrumb_arrow.svg");
    -webkit-mask-size: contain;
    mask-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    width: calc(4 / var(--font-size) * 1rem);
    height: calc(6 / var(--font-size) * 1rem);
    background-color: var(--gray-color-500);
  }
  .breadcrumb-list-item__in {
  }
  .breadcrumb-list-txt {
    font-size: calc(9 / var(--font-size) * 1rem);
    color: var(--gray-color-500);
    transition: all 0.3s;
  }
  .breadcrumb-list-txt:hover {
    color: var(--primary-color-100);
  }
}

/* --------------------------------------------------------------------------
  FLOW COMPONENT
-------------------------------------------------------------------------- */
@media all and (min-width: 768px), print {
  .c-flow{
    --flow-deco-color: var(--primary-color-100);
    --flow-bg-color: var(--primary-color-10);
    background-color: var(--flow-bg-color);
  }
  .c-flow-step-list{

  }
  .c-flow-step-list__item{

  }
  .c-flow-step-list__item +  .c-flow-step-list__item{
    margin-top:  calc(27 / var(--font-size)* 1rem);
  }
  .c-flow-step-list__inner{

  }
  .c-flow-step-list__content{
    --col: 2;
    --gap-x: 30;
    display: flex;
    flex-wrap: wrap;
    gap: calc(20 / var(--font-size)* 1rem) calc(var(--gap-x) / var(--font-size)* 1rem);
  }
  .c-flow-step-list-number{
    width: calc(130 / var(--font-size)* 1rem);
    height: calc(90 / var(--font-size)* 1rem);
    border: calc(1 / var(--font-size)* 1rem) solid var(--flow-deco-color);
    border-radius: calc(5 / var(--font-size)* 1rem);
    background-color: var(--white-color);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: relative;
  }
  .c-flow-step-list-number::before{
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    margin-bottom: calc(10 / var(--font-size)* 1rem * -1);
    width: calc(14 / var(--font-size)* 1rem);
    height: calc(10 / var(--font-size)* 1rem);
    -webkit-mask: url(/assets/img/common/flow_deco_arrow.svg);
    mask: url(/assets/img/common/flow_deco_arrow.svg);
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    background-color: var(--flow-deco-color);
  }
  .c-flow-step-list__item:last-of-type .c-flow-step-list-number::before{
    content: none;
  }
  .c-flow-step-list-number__label, .c-flow-step-list-number__label--step{
    color: var(--flow-deco-color);
    font-weight: bold;
    line-height: 1;
  }
  .c-flow-step-list-number__label--step{
    margin-bottom:  calc(10 / var(--font-size)* 1rem);
  }
  .c-flow-step-list-number__label{
    font-size: calc(22 / var(--font-size)* 1rem);
  }
  .c-flow-step-list-container{
    width: calc(100% - (130 / var(--font-size)* 1rem) - (var(--gap-x) / var(--font-size)* 1rem));
  }
  .c-flow-step-list-heading{
    margin-bottom: calc(20 / var(--font-size)* 1rem);
  }
  .c-flow-step-list-heading__label{

  }
  .c-flow-step-list-text{

  }
}
@media all and (max-width: 767px) {
}


/* --------------------------------------------------------------------------
  INFO GROUP COMPONENT
-------------------------------------------------------------------------- */

@media all and (min-width: 768px), print {
  .l-info-group{

  }
  .l-info-group-unit{

  }
  .l-info-group-unit + .l-info-group-unit{
    margin-top: calc(30 / var(--font-size)* 1rem);
  }
  .l-info-group-unit__content{

  }
  .l-info-group-doc-list{
    --col: 1;
    --gap-x: 30;
    --gap-y: 30;
    display: flex;
    gap: calc(var(--gap-y) / var(--font-size)* 1rem) calc(var(--gap-x) / var(--font-size)* 1rem);
    flex-wrap: wrap;
    justify-content: flex-start;
  }
  .l-info-group-doc-item{

  }
  .l-info-group-doc-item-img{
    width: calc(433 / var(--font-size)* 1rem);
  }
  .l-info-group-doc-item-list{
    margin-top: calc(20 / var(--font-size)* 1rem);
  }
  .l-info-group-doc-item-link{
    display: inline-block;
  }
  .l-info-group-unit__footer{
    margin-top: calc(20 / var(--font-size)* 1rem);
  }
  .l-info-group-note-list{
    margin-top: calc(14 / var(--font-size)* 1rem);
  }
  .l-info-group-doc-item-txt {
    margin-top: calc(20 / var(--font-size) * 1rem);
}

  /* col */
  .l-info-group-doc-list--2col {
    --col: 2;
  }
  .l-info-group-doc-list--3col {
    --col: 3;
  }
  .l-info-group-doc-list--4col {
    --col: 4;
  }
  .l-info-group-doc-list--5col {
    --col: 5;
  }
  .l-info-group-doc-list--auto .l-info-group-doc-list-item {
    width: auto;
  }
  .l-info-group-doc-list--2col .l-info-group-doc-item,
  .l-info-group-doc-list--3col .l-info-group-doc-item,
  .l-info-group-doc-list--4col .l-info-group-doc-item,
  .l-info-group-doc-list--5col .l-info-group-doc-item{
    width: calc((100% - (var(--gap-x) / var(--font-size)* 1rem)) / var(--col));
  }
  .l-info-group-doc-list--2col .l-info-group-doc-item-img,
  .l-info-group-doc-list--3col .l-info-group-doc-item-img,
  .l-info-group-doc-list--4col .l-info-group-doc-item-img,
  .l-info-group-doc-list--5col .l-info-group-doc-item-img{
    width: 100%;
  }
}
@media all and (max-width: 767px){
  .l-info-group{

  }
  .l-info-group-unit{

  }
  .l-info-group-unit + .l-info-group-unit{
    margin-top: calc(30 / var(--font-size)* 1rem);
  }
  .l-info-group-unit__content{

  }
  .l-info-group-doc-list{
    --col: 1;
    --gap-x: 30;
    --gap-y: 30;
    display: flex;
    gap: calc(var(--gap-y) / var(--font-size)* 1rem) calc(var(--gap-x) / var(--font-size)* 1rem);
    flex-wrap: wrap;
    justify-content: flex-start;
  }
  .l-info-group-doc-item{

  }
  .l-info-group-doc-item-img{
    width: 100%;
  }
  .l-info-group-unit__footer + .l-info-group-doc-list {
    margin-top: calc(20 / var(--font-size)* 1rem);
  }
  .l-info-group-doc-item-list{
    margin-top: calc(30 / var(--font-size)* 1rem);
  }
  .l-info-group-doc-item-link{
    display: inline-block;
  }
  .l-info-group-unit__footer{
    margin-top: calc(20 / var(--font-size)* 1rem);
  }
  .l-info-group-note-list{
    margin-top: calc(14 / var(--font-size)* 1rem);
  }
  .l-info-group-doc-item-txt {
    margin-top: calc(20 / var(--font-size) * 1rem);
}

  /* col */
  .l-info-group-doc-list--2col {
    --col: 1;
  }
  .l-info-group-doc-list--3col {
    --col: 1;
  }
  .l-info-group-doc-list--4col {
    --col: 1;
  }
  .l-info-group-doc-list--5col {
    --col: 1;
  }
  .l-info-group-doc-list--auto .l-info-group-doc-list-item {
    width: auto;
  }
  .l-info-group-doc-list--2col .l-info-group-doc-item,
  .l-info-group-doc-list--3col .l-info-group-doc-item,
  .l-info-group-doc-list--4col .l-info-group-doc-item,
  .l-info-group-doc-list--5col .l-info-group-doc-item{
    width: 100%;
  }
  .l-info-group-doc-list--2col .l-info-group-doc-item-img,
  .l-info-group-doc-list--3col .l-info-group-doc-item-img,
  .l-info-group-doc-list--4col .l-info-group-doc-item-img,
  .l-info-group-doc-list--5col .l-info-group-doc-item-img{
    width: 100%;
  }
  .l-info-group-doc-item-link + .l-info-group-doc-item-link{
    margin-top: calc(15 / var(--font-size)* 1rem);
  }
}

/* --------------------------------------------------------------------------
  INFO THUNMNAIL COMPONENT
-------------------------------------------------------------------------- */
@media all and (min-width: 768px), print {
.l-info-thumbnail{

}
.l-info-thumbnail-list{
  --col: 1;
  --gap-x: 60;
  --gap-y: 40;
  --thumbnail-content-bg-color:var(--primary-color-100);
  --thumbnail-content-txt-color:var(--white-color);
  --thumbnail-content-border-color:var(--primary-color-100);
  --thumbnail-footer-bg-color:var(--gray-color-50);
  --thumbnail-footer-txt-color:var(--black-color);
  display: flex;
  gap: calc(var(--gap-y) / var(--font-size)* 1rem) calc(var(--gap-x) / var(--font-size)* 1rem);
  flex-wrap: wrap;
}
.l-info-thumbnail-list__item{
  width: calc((100% - var(--gap-x) / var(--font-size)* 1rem*(var(--col) - 1)) / var(--col));
}
.l-info-thumbnail-list__in{
  display: flex;
  flex-direction: column;
  height: 100%;
}
.l-info-thumbnail-list-content{
}
.l-info-thumbnail-list-content__link{

}
.l-info-thumbnail-list-content__link:hover{
  --thumbnail-content-bg-color:var(--white-color);
  --thumbnail-content-txt-color:var(--primary-color-100);
  --thumbnail-content-border-color:var(--primary-color-100);
}
.l-info-thumbnail-list-content__in{
  transition: all 0.2s;
  padding: calc(30 / var(--font-size)* 1rem) calc(30 / var(--font-size)* 1rem) calc(20 / var(--font-size)* 1rem);
  border-radius: calc(10 / var(--font-size)* 1rem) calc(10 / var(--font-size)* 1rem) 0 0;
  background-color: var(--thumbnail-content-bg-color);
  border: 1px solid var(--thumbnail-content-border-color);
}
.l-info-thumbnail-list-content-img{

}
.l-info-thumbnail-list-content-img__feature{
}
.l-info-thumbnail-list-content-img__feature .c-img{
  height: calc(286 / var(--font-size)* 1rem);
}
.l-info-thumbnail-list-content-img__feature .c-img__label{
height: 100%;
text-align: center;
}
.l-info-thumbnail-list-content-img__feature img{
  width: auto;
  height: 100%;
}
.l-info-thumbnail-list-content-title{
  color: var(--thumbnail-content-txt-color);
  font-weight: 700;
  text-align: center;
  font-size: calc(20 / var(--font-size)* 1rem);
  margin-top: calc(20 / var(--font-size)* 1rem);
}
.l-info-thumbnail-list-content-title__label{

}
.l-info-thumbnail-list-footer{
  flex-grow: 1;
  flex-shrink: 0;
}
.l-info-thumbnail-list-footer__in{
  padding: calc(20 / var(--font-size)* 1rem) calc(30 / var(--font-size)* 1rem) calc(30 / var(--font-size)* 1rem);
  background-color: var(--thumbnail-footer-bg-color);
  border-radius: 0 0 calc(10 / var(--font-size)* 1rem) calc(10 / var(--font-size)* 1rem);
  height: 100%;
}
.l-info-thumbnail-list-footer-txt{
  color: var(--thumbnail-footer-txt-color);
}
.l-info-thumbnail-list-footer-txt__link{
  color: var(--blue-color-100);
  text-decoration: underline;
}
.l-info-thumbnail-list-footer-txt__link:hover{
  text-decoration: none;
}
.c-topics-date--new {
  position: relative;
  padding-left: calc(48 / var(--font-size) * 1rem);
}
.c-topics-date--new::before {
  position: absolute;
  content: 'NEW';
  font-size: calc(12 / var(--font-size)* 1rem);
  line-height: 16px;
  color: var(--white-color);
  padding: 0 calc(7 / var(--font-size) * 1rem);
  background-color: var(--red-color-100);
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}

/* zehinfo */
#topics .c-topics-date--new {
  position: relative;
  padding-left: 0;
}
#topics .c-topics-date--new::before {
  position: relative;
  content: 'NEW';
  font-size: calc(12 / var(--font-size)* 1rem);
  line-height: 16px;
  color: var(--white-color);
  padding: 0 calc(7 / var(--font-size) * 1rem);
  background-color: var(--red-color-100);
  left: unset;
  top: unset;
  transform: unset;
  display: block;
  width: fit-content;
}

  /* postion */
  .l-info-thumbnail-list--left {
    justify-content: left;
  }

  /* col */
  .l-info-thumbnail-list--2col {
    --col: 2;
  }
  .l-info-thumbnail-list--3col {
    --col: 3;
  }
  .l-info-thumbnail-list--4col {
    --col: 4;
  }
  .l-info-thumbnail-list--5col {
    --col: 5;
  }
  .l-info-thumbnail-list--auto .l-info-thumbnail-list__item{
    width: auto;
  }
  /* row */
  .l-info-thumbnail-list--row{
    --gap-y: 32;
  }
  .l-info-thumbnail-list--row .l-info-thumbnail-list__in{
    flex-direction: row;
  }
  .l-info-thumbnail-list--row .l-info-thumbnail-list-footer{
    flex-shrink: 1;
  }
  .l-info-thumbnail-list--row .l-info-thumbnail-list-footer__in{
    border-radius: 0 calc(10 / var(--font-size)* 1rem) calc(10 / var(--font-size)* 1rem) 0;
    padding: calc(20 / var(--font-size)* 1rem) calc(32 / var(--font-size)* 1rem) calc(20 / var(--font-size)* 1rem);
  }
  .l-info-thumbnail-list--row .l-info-thumbnail-list-content-img__feature .c-img {
    height: calc(206 / var(--font-size) * 1rem);
  }
  .l-info-thumbnail-list--row .l-info-thumbnail-list-content-img__feature img{
    border-radius: calc(10 / var(--font-size)* 1rem) 0 0 calc(10 / var(--font-size)* 1rem);
  }
  .l-info-thumbnail-list--row .l-info-thumbnail-list-footer-txt {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
  .l-info-thumbnail-list--row .c-info-thumbnail-list-footer-lead-txt{
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
    /* ボタン非活性 */
    .link-inactive .l-info-thumbnail-list-content__link {
      --thumbnail-content-bg-color:var(--gray-color-200);
      --thumbnail-content-txt-color:var(--white-color);
      --thumbnail-content-border-color:var(--gray-color-200);
      --thumbnail-footer-bg-color:var(--gray-color-50);
      --thumbnail-footer-txt-color:var(--black-color);
    }
    .link-inactive .l-info-thumbnail-list-content__link{
      pointer-events: none;
    }
    .link-inactive .l-info-thumbnail-list-content-img {
      filter: grayscale(0.8);
    }

  /* トピックス一覧 */
  .c-info-thumbnail-list-date--new{
    position: relative;
  }
  .c-info-thumbnail-list-date--new::after {
    position: relative;
    content: 'NEW';
    font-size: calc(12 / var(--font-size)* 1rem);
    line-height: 16px;
    color: var(--white-color);
    padding: 0 calc(7 / var(--font-size) * 1rem);
    background-color: var(--red-color-100);
    margin-left: calc(10 / var(--font-size)* 1rem);
  }

}

@media all and (min-width: 768px) and (max-width: 1080px), print {
  .l-info-thumbnail-list-content-img__feature .c-img{
    height: 100%;
  }
  .l-info-thumbnail-list-content-img__feature .c-img__label{
    height: auto;
  }
  .l-info-thumbnail-list-content-img__feature .c-img{
    height: 100%;
  }
  .l-info-thumbnail-list-content-img__feature img{
    width: 100%;
    height: auto;
  }
}

@media all and (max-width: 767px), print {
  .l-info-thumbnail{
  
  }
  .l-info-thumbnail-list{
    --col: 1;
    --gap-x: 60;
    --gap-y: 20;
    --thumbnail-content-bg-color:var(--primary-color-100);
    --thumbnail-content-txt-color:var(--white-color);
    --thumbnail-content-border-color:var(--primary-color-100);
    --thumbnail-footer-bg-color:var(--gray-color-50);
    --thumbnail-footer-txt-color:var(--black-color);
    display: flex;
    gap: calc(var(--gap-y) / var(--font-size)* 1rem) calc(var(--gap-x) / var(--font-size)* 1rem);
    flex-wrap: wrap;
    justify-content: center;
  }
  .l-info-thumbnail-list__item{
    width: calc((100% - var(--gap-x) / var(--font-size)* 1rem*(var(--col) - 1)) / var(--col));
  }
  .l-info-thumbnail-list__in{
    display: flex;
    flex-direction: column;
    height: 100%;
  }
  .l-info-thumbnail-list-content{
  }
  .l-info-thumbnail-list-content__link{
  
  }
  .l-info-thumbnail-list-content__link:hover{
    --thumbnail-content-bg-color:var(--white-color);
    --thumbnail-content-txt-color:var(--primary-color-100);
    --thumbnail-content-border-color:var(--primary-color-100);
  }
  .l-info-thumbnail-list-content__in{
    transition: all 0.2s;
    padding: calc(15 / var(--font-size)* 1rem) calc(15 / var(--font-size)* 1rem) calc(15 / var(--font-size)* 1rem);
    border-radius: calc(10 / var(--font-size)* 1rem) calc(10 / var(--font-size)* 1rem) 0 0;
    background-color: var(--thumbnail-content-bg-color);
    border: 1px solid var(--thumbnail-content-border-color);
  }
  .l-info-thumbnail-list-content-img{
  
  }
  .l-info-thumbnail-list-content-img__feature{
  
  }
  .l-info-thumbnail-list-content-img__feature .c-img{
    width: 100%;
  }
  .l-info-thumbnail-list-content-title{
    color: var(--thumbnail-content-txt-color);
    font-weight: 700;
    text-align: center;
    font-size: calc(16 / var(--font-size)* 1rem);
    margin-top: calc(15 / var(--font-size)* 1rem);
  }
  .l-info-thumbnail-list-content-title__label{
  
  }
  .l-info-thumbnail-list-footer{
    flex-grow: 1;
    flex-shrink: 0;
  }
  .l-info-thumbnail-list-footer__in{
    padding: calc(20 / var(--font-size)* 1rem) calc(15 / var(--font-size)* 1rem) calc(20 / var(--font-size)* 1rem);
    background-color: var(--thumbnail-footer-bg-color);
    border-radius: 0 0 calc(10 / var(--font-size)* 1rem) calc(10 / var(--font-size)* 1rem);
    height: 100%;
  }
  .l-info-thumbnail-list-footer-txt{
    color: var(--thumbnail-footer-txt-color);
  }
  .l-info-thumbnail-list-footer-txt__link{
    color: var(--blue-color-100);
    text-decoration: underline;
  }
  .l-info-thumbnail-list-footer-txt__link:hover{
    text-decoration: none;
  }
    /* ボタン非活性 */
    .link-inactive .l-info-thumbnail-list-content__link {
      --thumbnail-content-bg-color:var(--gray-color-200);
      --thumbnail-content-txt-color:var(--white-color);
      --thumbnail-content-border-color:var(--gray-color-200);
      --thumbnail-footer-bg-color:var(--gray-color-50);
      --thumbnail-footer-txt-color:var(--black-color);
    }
    .link-inactive .l-info-thumbnail-list-content__link{
      pointer-events: none;
    }
    .link-inactive .l-info-thumbnail-list-content-img {
      filter: grayscale(0.8);
    }
  .c-topics-date--new {
    position: relative;
    padding-left: calc(48 / var(--font-size) * 1rem);
  }
  .c-topics-date--new::before {
    position: absolute;
    content: 'NEW';
    font-size: calc(12 / var(--font-size)* 1rem);
    line-height: 16px;
    color: var(--white-color);
    padding: 0 calc(7 / var(--font-size) * 1rem);
    background-color: var(--red-color-100);
    left: 0;
    top: 50%;
    transform: translateY(-50%);
  }
  /* zehinfo */
  #topics .c-topics-date--new {
    position: relative;
    padding-left: 0;
  }
  #topics .c-topics-date--new::before {
    position: relative;
    content: 'NEW';
    font-size: calc(12 / var(--font-size)* 1rem);
    line-height: 16px;
    color: var(--white-color);
    padding: 0 calc(7 / var(--font-size) * 1rem);
    background-color: var(--red-color-100);
    left: unset;
    top: unset;
    transform: unset;
    display: block;
    width: fit-content;
  }

    /* postion */
    .l-info-thumbnail-list--left {
      justify-content: left;
    }
  
    /* col */
    .l-info-thumbnail-list--2col {
      --col: 1;
    }
    .l-info-thumbnail-list--3col {
      --col: 1;
    }
    .l-info-thumbnail-list--4col {
      --col: 1;
    }
    .l-info-thumbnail-list--5col {
      --col: 1;
    }
    .l-info-thumbnail-list--auto .l-info-thumbnail-list__item {
      width: auto;
    }
      /* row */
    .l-info-thumbnail-list--row {
      --gap-y: 24;
    }
    .l-info-thumbnail-list--row .l-info-thumbnail-list__in{
    }
    .l-info-thumbnail-list--row .l-info-thumbnail-list-footer {
      flex-shrink: 1;
    }
    .l-info-thumbnail-list--row .l-info-thumbnail-list-footer__in{
      border-radius: 0 0 calc(10 / var(--font-size)* 1rem) calc(10 / var(--font-size)* 1rem);
    }
    .l-info-thumbnail-list--row .l-info-thumbnail-list-content-img__feature img{
      border-radius: calc(10 / var(--font-size)* 1rem) calc(10 / var(--font-size)* 1rem) 0 0;
    }
    .l-info-thumbnail-list--row .c-info-thumbnail-list-footer-lead-txt {
      font-size: calc(14 / var(--font-size) * 1rem);
      word-wrap: break-word;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }

    /* トピックス一覧 */
    .c-info-thumbnail-list-date--new{
      position: relative;
      padding-top: calc(18 / var(--font-size) * 1rem);
    }
    .c-info-thumbnail-list-date--new::after {
      position: absolute;
      content: 'NEW';
      font-size: calc(12 / var(--font-size)* 1rem);
      line-height: 16px;
      color: var(--white-color);
      padding: 0 calc(7 / var(--font-size) * 1rem);
      background-color: var(--red-color-100);
      top: 0;
      left: 0;
    }
  }

/* --------------------------------------------------------------------------
  TAB
-------------------------------------------------------------------------- */

@media all and (min-width: 768px), print {
  .tab-top{
    margin-bottom: calc(90 / var(--font-size) * 1rem);
    --page-sec-width: 1060;
  }
  .tab-top__inner{
    max-width: calc(var(--page-sec-width) / var(--font-size)* 1rem);
    margin: auto;
    padding: 0 calc(20 / var(--font-size)* 1rem);
  }
  .tab{
    --tab-current-deco-color: var(--primary-color-100);
    --tab-current-bg-color: var(--primary-color-10);
    --tab-border-color: var(--gray-color-200);
    --tab-bg-color: var(--gray-color-50);
    --tab-px-size: 24;
    --tab-ico-size: 10;
    --tab-arrow-color:var(--black-color);
  }
  .tab-list{
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;

    max-width: calc(1060 / var(--font-size) * 1rem);
    margin: 0 auto;
    padding-left: calc(25 / var(--font-size) * 1rem);
    padding-right: calc(25 / var(--font-size) * 1rem);
    border-bottom: calc(1 / var(--font-size) * 1rem) solid var(--tab-border-color);
  }
  .tab-list-item{
    border-top: calc(1 / var(--font-size) * 1rem) solid var(--tab-border-color);
    border-left: calc(1 / var(--font-size) * 1rem) solid var(--tab-border-color);
    border-right: calc(1 / var(--font-size) * 1rem) solid var(--tab-border-color);
    border-top-left-radius: calc(5 / var(--font-size) * 1rem);
    border-top-right-radius: calc(5 / var(--font-size) * 1rem);
    background-color: var(--tab-bg-color);
    z-index: 0;
    min-width: calc(220 / var(--font-size) * 1rem);
    transition: 0.3s all;
    overflow: hidden;
  }
  .tab-list-item:hover {
    --tab-bg-color: var(--primary-color-10);
  }
  .tab-list-item + .tab-list-item{
    margin-left: calc(16 / var(--font-size) * 1rem);
  }
  .tab-list-item__btn{
    display: block;
    position: relative;
    width: 100%;
    height: auto;
    padding: calc(32 / var(--font-size) * 1rem) calc(var(--tab-px-size) / var(--font-size) * 1rem);
    text-align: center;
    font-size: calc(16 / var(--font-size) * 1rem);
    font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: center;
    max-height: calc(82 / var(--font-size) * 1rem);
    line-height: 1.3;
  }

  .tab[data-tab="1"] .tab-list-item--1,
  .tab[data-tab="2"] .tab-list-item--2,
  .tab[data-tab="3"] .tab-list-item--3,
  .tab[data-tab="4"] .tab-list-item--4{
    background-color: var(--tab-current-bg-color);
    z-index: 2;
  }
  .tab[data-tab="1"] .tab-list-item--1 .tab-list-item__btn,
  .tab[data-tab="2"] .tab-list-item--2 .tab-list-item__btn,
  .tab[data-tab="3"] .tab-list-item--3 .tab-list-item__btn,
  .tab[data-tab="4"] .tab-list-item--4 .tab-list-item__btn{
    color: var(--tab-current-deco-color);
  }

  .tab-list-item .tab-list-item__btn::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: calc(100% - calc(30 / var(--font-size) * 1rem) * 2);
    height: calc(6 / var(--font-size) * 1rem);
    margin-left: calc(30 / var(--font-size) * 1rem);
    margin-right: calc(30 / var(--font-size) * 1rem);
    background-color: var(--tab-current-deco-color);
    opacity: 0;
    transition: 0.3s all;
  }
  .tab-list-item:hover .tab-list-item__btn::before,
  .tab[data-tab="1"] .tab-list-item--1 .tab-list-item__btn::before,
  .tab[data-tab="2"] .tab-list-item--2 .tab-list-item__btn::before,
  .tab[data-tab="3"] .tab-list-item--3 .tab-list-item__btn::before,
  .tab[data-tab="4"] .tab-list-item--4 .tab-list-item__btn::before{
    opacity: 1;
  }

  /* tab-panel */
  .tab[data-tab="1"] .tab-panel-item--1,
  .tab[data-tab="2"] .tab-panel-item--2,
  .tab[data-tab="3"] .tab-panel-item--3,
  .tab[data-tab="4"] .tab-panel-item--4{
    display: block;
  }
  .tab-panel-item{
    display: none;
    position: relative;
    z-index: 1;
  }

  .tab-panel-item__inner{
    margin: calc(90 / var(--font-size) * 1rem) auto 0;
  }

  .tab .l-page-sec + .l-page-sec{
    margin-top: calc(60 / var(--font-size) * 1rem);
  }

  .tab-list-item-arrow{
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    width: calc(var(--tab-px-size) / var(--font-size)* 1rem);
    height: calc(var(--tab-px-size) / var(--font-size)* 1rem);
  }

  .tab-list-item-arrow_label{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
  }

  .tab-list-item-arrow .c-svg{
    width: calc(var(--tab-ico-size) / var(--font-size)* 1rem);
    fill: var(--tab-arrow-color);
    transition: all 0.2s;
  }

  /* tab--faq */
  .tab--faq{
    counter-reset: number 0;
    --tab-px-size: 48;
  }
  .tab--faq .tab-panel-item + .tab-panel-item {
    margin-top: calc(90 / var(--font-size) * 1rem);
  }
  .tab--faq .tab-panel-item__inner{
    margin-top: 0;
  }
  .tab--faq .tab-list{
    flex-wrap: wrap;
    border-bottom: none;
    margin-bottom: calc(80 / var(--font-size) * 1rem);
  }
  .tab--faq .tab-list-item{
    border: calc(1 / var(--font-size) * 1rem) solid var(--tab-border-color);
    border-radius: calc(5 / var(--font-size) * 1rem);
    width: calc((100% - 25 / var(--font-size) * 1rem * 2) / 3);
    min-width: unset;
  }
  .tab--faq .tab-list-item + .tab-list-item{
    margin-left: calc(25 / var(--font-size) * 1rem);
  }
  .tab--faq .tab-list-item:nth-of-type(3n + 1){
    margin-left: 0;
  }
  .tab--faq .tab-list-item:nth-of-type(n + 3){
    margin-top: calc(10 / var(--font-size) * 1rem);
  }
  .tab.tab--faq .tab-list-item__btn{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding: 0 calc(var(--tab-px-size) / var(--font-size) * 1rem);
    text-align: left;
    font-weight: normal;
    height: calc(60 / var(--font-size) * 1rem);
    /* font-size: calc(14 / var(--font-size) * 1rem); */
    color: var(--black-color);
  }
  .tab.tab--faq .tab-list-item__btn:hover {

  }
  .tab--faq .tab-list-item-txt{
    position: relative;
  }
  .tab--faq .tab-list-item-txt::before{
    counter-increment: number 1;
    content: counter(number) ". ";
    position: absolute;
    left: 0;
    top: 50%;
    margin-left: calc(30 / var(--font-size) * 1rem * -1);
    transform: translateY(-50%);
  }
  .tab.tab--faq .tab-list-item{
    background-color: var(--tab-bg-color);
    transition: all 0.3s;
  }
  .tab--faq .tab-list-item:hover {
    background-color: var(--primary-color-10);
  }
  .tab--faq .tab-panel-item{
    display: block;
  }
}

@media all and (max-width: 767px){
  .tab-top{
    margin-bottom: calc(52 / var(--font-size) * 1rem);
    --page-sec-width: 1000;
  }
  .tab-top__inner{
    max-width: calc(var(--page-sec-width) / var(--font-size)* 1rem);
    margin: auto;
    padding: 0 calc(25 / var(--font-size)* 1rem);
  }
  .tab{
    --tab-current-deco-color: var(--primary-color-100);
    --tab-current-bg-color: var(--primary-color-10);
    --tab-border-color: var(--gray-color-200);
    --tab-bg-color: var(--gray-color-50);
    --tab-px-size: 12;
    --tab-ico-size: 10;
    --tab-arrow-color:var(--black-color);
  }
  .tab-list{
    display: flex;
    align-items: stretch;
    justify-content: flex-start;
    overflow-x: scroll;
    margin: 0 auto;
    padding-left: calc(25 / var(--font-size) * 1rem);
    padding-right: calc(25 / var(--font-size) * 1rem);
    border-bottom: calc(1 / var(--font-size) * 1rem) solid var(--tab-border-color);
  }
  .tab-list-item{
    border-top: calc(1 / var(--font-size) * 1rem) solid var(--tab-border-color);
    border-left: calc(1 / var(--font-size) * 1rem) solid var(--tab-border-color);
    border-right: calc(1 / var(--font-size) * 1rem) solid var(--tab-border-color);
    border-top-left-radius: calc(5 / var(--font-size) * 1rem);
    border-top-right-radius: calc(5 / var(--font-size) * 1rem);
    background-color: var(--tab-bg-color);
    z-index: 0;
    min-width: calc(105 / var(--font-size) * 1rem);
    min-height: calc(56 / var(--font-size) * 1rem);
    overflow: hidden;
  }
  .tab-list-item + .tab-list-item{
    margin-left: calc(5 / var(--font-size) * 1rem);
  }
  .tab-list-item__btn{
    display: block;
    position: relative;
    width: 100%;
    height: auto;
    padding: calc(8 / var(--font-size) * 1rem) calc(var(--tab-px-size) / var(--font-size) * 1rem);
    text-align: center;
    font-size: calc(16 / var(--font-size) * 1rem);
    font-weight: 500;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .tab-list-item-txt{
    font-size: calc(13 / var(--font-size) * 1rem);
  }
  .tab-list-item-txt__label {
    line-height: calc(21 / 13);
  }

  .tab[data-tab="1"] .tab-list-item--1,
  .tab[data-tab="2"] .tab-list-item--2,
  .tab[data-tab="3"] .tab-list-item--3,
  .tab[data-tab="4"] .tab-list-item--4{
    background-color: var(--tab-current-bg-color);
    z-index: 2;
  }
  .tab[data-tab="1"] .tab-list-item--1 .tab-list-item__btn,
  .tab[data-tab="2"] .tab-list-item--2 .tab-list-item__btn,
  .tab[data-tab="3"] .tab-list-item--3 .tab-list-item__btn,
  .tab[data-tab="4"] .tab-list-item--4 .tab-list-item__btn{
    color: var(--tab-current-deco-color);
  }

  .tab[data-tab="1"] .tab-list-item--1 .tab-list-item__btn::before,
  .tab[data-tab="2"] .tab-list-item--2 .tab-list-item__btn::before,
  .tab[data-tab="3"] .tab-list-item--3 .tab-list-item__btn::before,
  .tab[data-tab="4"] .tab-list-item--4 .tab-list-item__btn::before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: calc(100% - calc(12 / var(--font-size) * 1rem) * 2);
    height: calc(4 / var(--font-size) * 1rem);
    margin-left: calc(12 / var(--font-size) * 1rem);
    margin-right: calc(12 / var(--font-size) * 1rem);
    background-color: var(--tab-current-deco-color);
  }

  /* tab-panel */
  .tab[data-tab="1"] .tab-panel-item--1,
  .tab[data-tab="2"] .tab-panel-item--2,
  .tab[data-tab="3"] .tab-panel-item--3,
  .tab[data-tab="4"] .tab-panel-item--4{
    display: block;
  }
  .tab-panel-item{
    display: none;
    position: relative;
    z-index: 1;
  }

  .tab-panel-item__inner{
    margin: calc(50 / var(--font-size) * 1rem) auto 0;
  }

  .tab .l-page-sec + .l-page-sec{
    margin-top: calc(50 / var(--font-size) * 1rem);
  }

  .tab-list-item-arrow{
    width: calc(var(--tab-px-size) / var(--font-size)* 1rem);
    height: calc(var(--tab-px-size) / var(--font-size)* 1rem);
  }

  .tab-list-item-arrow_label{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
  }

  .tab-list-item-arrow .c-svg{
    width: calc(var(--tab-ico-size) / var(--font-size)* 1rem);
    fill: var(--tab-arrow-color);
    transition: all 0.2s;
  }

  /* tab--faq */
  .tab--faq{
    counter-reset: number 0;
    --tab-px-size: 16;
  }
  .tab--faq .tab-panel-item + .tab-panel-item {
    margin-top: calc(50 / var(--font-size) * 1rem);
  }
  .tab--faq .tab-panel-item__inner{
    margin-top: 0;
  }
  .tab--faq .tab-list{
    flex-wrap: wrap;
    border-bottom: none;
    margin-bottom: calc(50 / var(--font-size) * 1rem);
    overflow-x: auto;
  }
  .tab--faq .tab-list-item{
    border: calc(1 / var(--font-size) * 1rem) solid var(--tab-border-color);
    border-radius: calc(5 / var(--font-size) * 1rem);
    width: calc((100% - (10 / var(--font-size) * 1rem)) / 2);
  }
  .tab--faq .tab-list-item + .tab-list-item{
    margin-left: calc(10 / var(--font-size) * 1rem);
  }
  .tab--faq .tab-list-item:nth-of-type(2n + 1){
    margin-left: 0;
  }
  .tab--faq .tab-list-item:nth-of-type(n + 3){
    margin-top: calc(10 / var(--font-size) * 1rem);
  }
  .tab.tab--faq .tab-list-item__btn{
    display: flex;
    align-items: center;
    padding: 0 calc(var(--tab-px-size) / var(--font-size) * 1rem) 0 calc(var(--tab-px-size) * 2.5 / var(--font-size) * 1rem);
    text-align: left;
    font-weight: normal;
    height: calc(108 / var(--font-size) * 1rem);
    font-size: calc(14 / var(--font-size) * 1rem);
    color: var(--black-color);
    flex-direction: column;
    justify-content: center;
  }
  .tab--faq .tab-list-item-txt{
    position: relative;
    font-size: calc(14 / var(--font-size) * 1rem);
  }
  .tab--faq .tab-list-item-txt::before{
    counter-increment: number 1;
    content: counter(number) ". ";
    position: absolute;
    left: 0;
    top: 50%;
    margin-left: calc(26 / var(--font-size) * 1rem * -1);
    transform: translateY(-50%);
  }
  .tab.tab--faq .tab-list-item{
    background-color: var(--tab-bg-color);
  }
  .tab--faq .tab-panel-item{
    display: block;
  }
}


/* --------------------------------------------------------------------------
accordion
-------------------------------------------------------------------------- */
@media all and (min-width: 768px){
  .js-accordion-container {
    transition: all 0.3s;
    display: none;
    opacity: 0;
    visibility: hidden;
  }
  .js-accordion.is-accordion-active .js-accordion-container {
    display: block;
    opacity: 1;
    visibility: visible;
  }
}
@media all and (max-width: 767px){
  .js-accordion-container {
    transition: all 0.3s;
    display: none;
    opacity: 0;
    visibility: hidden;
  }
  .js-accordion.is-accordion-active .js-accordion-container {
    display: block;
    opacity: 1;
    visibility: visible;
  }
}

/* --------------------------------------------------------------------------
  検索窓
-------------------------------------------------------------------------- */
@media all and (min-width: 768px){
  .c-search-area {
  }
  .c-search-area__in {
  }
  .c-search-area__header {
    margin-bottom: calc(20 / var(--font-size) * 1rem);
  }
  .c-search-area__tab {
  }
  .c-search-tab {
    --tab-font-color: var(--gray-color-500);
    --tab-bg-color: var(--gray-color-50);
    --tab-border-color: var(--gray-color-200);
  }
  .c-search-tab__in {
    --col: 2;
    display: flex;
  }
  .c-search-tab-item {
    width: calc(100% / var(--col));
  }
  .c-search-tab-item:hover,
  .c-search-tab-item--active {
    --tab-font-color: var(--white-color);
    --tab-bg-color: var(--gray-color-650);
    --tab-border-color: var(--gray-color-650);
  }
  .c-search-tab-item--active {
    pointer-events: none;
  }
  .c-search-tab-btn {
    display: block;
    background-color: var(--tab-bg-color);
    border: calc(1 / var(--font-size) * 1rem) solid var(--tab-border-color);
    transition: all 0.3s;
  }
  .c-search-tab-item:nth-of-type(1) .c-search-tab-btn {
    border-top-left-radius: calc(10 / var(--font-size) * 1rem);
  }
  .c-search-tab-item:nth-last-of-type(1) .c-search-tab-btn {
    border-top-right-radius: calc(10 / var(--font-size) * 1rem);
  }
  .c-search-tab-btn__in {
    padding: 0 calc(20 / var(--font-size) * 1rem);
  }
  .c-search-tab__body {
    padding: calc(20 / var(--font-size) * 1rem) 0;
  }
  .c-search-tab-txt {
    text-align: center;
  }
  .c-search-tab-txt__label {
    font-size: calc(20 / var(--font-size) * 1rem);
    font-weight: 700;
    color: var(--tab-font-color);
    line-height: 1.4;
    transition: all 0.3s;
  }
  .c-search-area__body {
    background-color: var(--primary-color-10);
    border-radius: calc(12 / var(--font-size) * 1rem);
    padding: calc(60 / var(--font-size) * 1rem) calc(90 / var(--font-size) * 1rem);
  }
  .c-search-area__tab + .c-search-area__body {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
  }
  .c-search-area-form {
  }
  .c-search-area-form__in {
  }
  .c-search-area-form__body {
    display: flex;
    gap: calc(24 / var(--font-size) * 1rem) calc(48 / var(--font-size) * 1rem);
  }
  .c-search-area-form-box {
  }
  .c-search-area-form-box--left {
    width: calc(504 / var(--font-size) * 1rem);
  }
  .c-search-area-form-box--right {
    width: calc(384 / var(--font-size) * 1rem);
  }
  .c-search-area-form-inputs {
  }
  .c-search-area-form-input {
  }
  .c-search-area-form-input + .c-search-area-form-input {
    margin-top: calc(24 / var(--font-size) * 1rem);
  }
  .c-search-area__footer {
    margin-top: calc(60 / var(--font-size) * 1rem);
  }
  .c-search-area__btn .c-btn {
    --btn-min-height: 64;
  }
  .c-search-area__content{
    margin-top: calc(150 / var(--font-size) * 1rem);
    margin-bottom: calc(150 / var(--font-size) * 1rem);
    text-align: center;
  }
}
@media all and (max-width: 767px){
  .c-search-area {
  }
  .c-search-area__in {
  }
  .c-search-area__header {
    margin-bottom: calc(15 / var(--font-size) * 1rem);
  }
  .c-search-area__tab {
  }
  .c-search-tab {
    --tab-font-color: var(--gray-color-500);
    --tab-bg-color: var(--gray-color-50);
    --tab-border-color: var(--gray-color-200);
  }
  .c-search-tab__in {
    --col: 2;
    display: flex;
  }
  .c-search-tab-item {
    width: calc(100% / var(--col));
  }
  .c-search-tab-item:hover,
  .c-search-tab-item--active {
    --tab-font-color: var(--white-color);
    --tab-bg-color: var(--gray-color-650);
    --tab-border-color: var(--gray-color-650);
  }
  .c-search-tab-item--active {
    pointer-events: none;
  }
  .c-search-tab-btn {
    display: block;
    background-color: var(--tab-bg-color);
    border: calc(1 / var(--font-size) * 1rem) solid var(--tab-border-color);
    transition: all 0.3s;
  }
  .c-search-tab-item:nth-of-type(1) .c-search-tab-btn {
    border-top-left-radius: calc(10 / var(--font-size) * 1rem);
  }
  .c-search-tab-item:nth-last-of-type(1) .c-search-tab-btn {
    border-top-right-radius: calc(10 / var(--font-size) * 1rem);
  }
  .c-search-tab-btn__in {
    padding: 0 calc(10 / var(--font-size) * 1rem);
  }
  .c-search-tab__body {
    padding: calc(20 / var(--font-size) * 1rem) 0;
  }
  .c-search-tab-txt {
    text-align: center;
  }
  .c-search-tab-txt__label {
    font-size: calc(13 / var(--font-size) * 1rem);
    font-weight: 500;
    color: var(--tab-font-color);
    line-height: 1.4;
    transition: all 0.3s;
  }
  .c-search-area__body {
    background-color: var(--primary-color-10);
    border-radius: calc(12 / var(--font-size) * 1rem);
    padding: calc(30 / var(--font-size) * 1rem) calc(25 / var(--font-size) * 1rem) calc(40 / var(--font-size) * 1rem);
  }
  .c-search-area__tab + .c-search-area__body {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
  }
  .c-search-area-form {
  }
  .c-search-area-form__in {
  }
  .c-search-area-form__body {

  }
  .c-search-area-form-box {
  }
  .c-search-area-form-box--left {
    width: 100%;
  }
  .c-search-area-form-box--right {
    width: 100%;
  }
  .c-search-area-form-inputs {
  }
  .c-search-area-form-input {
  }
  .c-search-area-form-input + .c-search-area-form-input {
    margin-top: calc(24 / var(--font-size) * 1rem);
  }
  .c-search-area__footer {
    margin-top: calc(55 / var(--font-size) * 1rem);
  }
  .c-search-area__btn .c-btn {
    --btn-min-height: 56;
  }
  .c-search-area__content{
    margin-top: calc(80 / var(--font-size) * 1rem);
    margin-bottom: calc(80 / var(--font-size) * 1rem);
  }
}

/* --------------------------------------------------------------------------
  検索結果
-------------------------------------------------------------------------- */
@media all and (min-width: 768px){
  .c-result {
    /* margin-top: calc(60 / var(--font-size) * 1rem); */
  }
  .c-result__in {
  }
  .c-result__body {
  }
  .c-result__header {
    margin-bottom: calc(60 / var(--font-size) * 1rem);
  }
  .c-result-header-ico-explanation {
  }
  .c-result-header-ico-explanation-header {
    margin-bottom: calc(14 / var(--font-size) * 1rem);
  }
  .c-result-header-ico-explanation-unit + .c-result-header-ico-explanation-unit{
    margin-top: calc(14 / var(--font-size) * 1rem);
    padding-top: calc(14 / var(--font-size) * 1rem);
    border-top: calc(1 / var(--font-size) * 1rem) solid var(--gray-color-200);
  }
  .c-result-header-ico-explanation-list + .c-result-header-ico-explanation-header {
    margin-top: calc(14 / var(--font-size) * 1rem);
  }
  .c-result-header-ico-explanation-list {
    display: flex;
    flex-wrap: wrap;
    gap: calc(14 / var(--font-size) * 1rem) calc(30 / var(--font-size) * 1rem);
  }
  .c-result-header-ico-explanation-list-item.c-result-header-ico-explanation-list-item--full {
    width: 100%;
  }
  .c-result-header-ico-explanation-list-item__in {
  }
  .c-result-header-ico-explanation-list-item .c-txt-ico {
    margin-left: 0;
    margin-right: calc(10 / var(--font-size) * 1rem);
  }
  .c-result-header-note {
    margin-top: calc(24 / var(--font-size) * 1rem);
  }
  .c-result-header-btns {
    margin-top: calc(10 / var(--font-size) * 1rem);
  }
  .c-result-header-btn {
  }
  .c-result-header-desc {
    display: flex;
    align-items: start;
    margin-top: calc(24 / var(--font-size) * 1rem);
  }
  .c-result-header-desc .c-btn {
    width: calc(126 / var(--font-size) * 1rem);
    margin-right: calc(12 / var(--font-size) * 1rem);
  }
  .c-result-header-desc .c-btn__body {
    padding: calc(4 / var(--font-size)* 1rem) 0 calc(6 / var(--font-size)* 1rem);
  }
  .c-result-header-desc__txt .c-result-header-note {
    margin-top: calc(8 / var(--font-size) * 1rem);
  }
  .c-result-header-csv {
    margin-top: calc(56 / var(--font-size) * 1rem);
  }
  .c-result-header-csv__in {
    display: flex;
    align-items: center;
  }
  .c-result-header-csv-btn {
    width: calc(260 / var(--font-size) * 1rem);
    flex-shrink: 0;
  }
  .c-result-header-csv-btn .c-btn {
    --btn-min-height: 42;
    --btn-px: 48;
  }
  .c-result-header-csv-btn .c-btn .c-btn__body {
    padding-right: calc(10 / var(--font-size) * 1rem);
  }
  .c-result-header-csv-txt {
    margin-left: calc(40 / var(--font-size) * 1rem);
  }
  .c-result-table {
  }
  .c-result-table .c-table-chart__thead {
    /* position: sticky;
    top: 0; */
  }
  .c-result-table-number-txt {
    font-size: calc(16 / var(--font-size) * 1rem);
    font-weight: 500;
  }
  .c-result-table-number-txt strong {
    font-size: calc(20 / 16 * 1em);
    font-weight: 700;
  }
  .c-result-table-ico-txt {

  }
  .c-result-table-ico-txt__label {
    display: inline-block;
    width: calc(30 / var(--font-size) * 1rem);
  }
}
@media all and (max-width: 767px){
  .c-result {
    /* margin-top: calc(60 / var(--font-size) * 1rem); */
  }
  .c-result__in {
  }
  .c-result__body {
  }
  .c-result__header {
    margin-bottom: calc(30 / var(--font-size) * 1rem);
  }
  .c-result-header-ico-explanation {
  }
  .c-result-header-ico-explanation-header {
    margin-bottom: calc(14 / var(--font-size) * 1rem);
  }
  .c-result-header-ico-explanation-unit + .c-result-header-ico-explanation-unit{
    margin-top: calc(14 / var(--font-size) * 1rem);
    padding-top: calc(14 / var(--font-size) * 1rem);
    border-top: calc(1 / var(--font-size) * 1rem) solid var(--black-color);
  }
  .c-result-header-ico-explanation-list + .c-result-header-ico-explanation-header {
    margin-top: calc(14 / var(--font-size) * 1rem);
  }
  .c-result-header-ico-explanation-list {
    display: flex;
    flex-wrap: wrap;
    gap: calc(14 / var(--font-size) * 1rem) calc(30 / var(--font-size) * 1rem);
  }
  .c-result-header-ico-explanation-list-item.c-result-header-ico-explanation-list-item--full {
    width: 100%;
  }
  .c-result-header-ico-explanation-list-item__in {
  }
  .c-result-header-ico-explanation-list-item__in .c-txt{
    padding-left: 2.3em;
    text-indent: -2.3em;
  }
  .c-result-header-ico-explanation-list-item__in .c-txt-ico{
      text-indent: 0;
  }
  .c-result-header-ico-explanation-list-item .c-txt-ico {
    margin-left: 0;
    margin-right: calc(10 / var(--font-size) * 1rem);
  }
  .c-result-header-note {
    margin-top: calc(24 / var(--font-size) * 1rem);
  }
  .c-result-header-btns {
    margin-top: calc(10 / var(--font-size) * 1rem);
  }
  .c-result-header-btn {
  }
  .c-result-header-desc {
    display: flex;
    align-items: start;
    margin-top: calc(20 / var(--font-size) * 1rem);
    gap: calc(16 / var(--font-size) * 1rem);
  }
  .c-result-header-desc .c-btn {
    width: calc(102 / var(--font-size) * 1rem);
  }
  .c-result-header-desc .c-btn__body {
    padding: calc(6 / var(--font-size)* 1rem);
  }
  .c-result-header-desc__txt {
    /* margin-top: calc(16 / var(--font-size) * 1rem); */
  }
  .c-result-header-desc__txt .c-result-header-note {
    margin-top: calc(8 / var(--font-size) * 1rem);
  }
  .c-result-header-csv {
    margin-top: calc(56 / var(--font-size) * 1rem);
  }
  .c-result-header-csv__in {
    display: flex;
    align-items: center;
    flex-direction: column;
  }
  .c-result-header-csv-btn {
    width: 100%;
    max-width: calc(255 / var(--font-size) * 1rem);
    flex-shrink: 0;
    margin-left: auto;
    margin-right: auto;
  }
  .c-result-header-csv-btn .c-btn {
    --btn-min-height: 42;
    --btn-px: 48;
  }
  .c-result-header-csv-btn .c-btn .c-btn__body {
    padding-right: calc(10 / var(--font-size) * 1rem);
  }
  .c-result-header-csv-txt {
    margin-top: calc(20 / var(--font-size) * 1rem);
  }
  .c-result-table {
  }
  .c-result-table .c-table-chart__thead {
    /* position: sticky;
    top: 0; */
  }
  .c-result-table-number-txt {
    font-size: calc(16 / var(--font-size) * 1rem);
    font-weight: 500;
  }
  .c-result-table-number-txt strong {
    font-size: calc(20 / 16 * 1em);
    font-weight: 700;
  }
  .c-result-table-ico-txt {

  }
  .c-result-table-ico-txt__label {
    display: inline-block;
    width: calc(30 / var(--font-size) * 1rem);
  }
}

/* ==========================================================================
  IMG-SCROLL
========================================================================== */
@media all and (max-width: 767px) {
  .img-scroll__in {
    overflow-x: scroll;
    overflow-y: hidden !important;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}
.img-scroll__body {
    position: relative;
    margin-left: calc(25 / var(--font-size) * 1rem);
    background-color: var(--white-color);
    width: calc(875 / var(--font-size) * 1rem);
    border-collapse: collapse;
}
.img-scroll__body::after {
    content: "";
    display: block;
    position: absolute;
    right: 0;
    top: 0;
    margin-right: calc(25 / var(--font-size)* 1rem * -1);
    width: calc(25 / var(--font-size)* 1rem);
    height: 100%;
}
}

/* ==========================================================================
  PAGER
========================================================================== */
@media all and (min-width: 768px){
  .c-pager {
    margin-top: calc(30 / var(--font-size) * 1rem);
  }
  .c-pager__in {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: calc(20 / var(--font-size) * 1rem);
  }
  .c-pager-arrow {
    --pager-arrow-bg-color: var(--white-color);
    --pager-arrow-ico-color: var(--black-color);
    --pager-arrow-txt-color: var(--black-color);
    --pager-arrow-border-color: var(--gray-color-200);

    width: calc(87 / var(--font-size) * 1rem);
    height: calc(42 / var(--font-size) * 1rem);
    border: calc(1 / var(--font-size) * 1rem) solid var(--pager-arrow-border-color);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: calc(1 / var(--font-size) * 1rem);
    background-color: var(--pager-arrow-bg-color);
    transition: all 0.3s;
  }
  .c-pager-arrow--prev {
    /* transform: rotate(180deg); */
  }
  .c-pager-arrow--prev::after {
    content: "前へ";
    margin-left: calc(10 / var(--font-size) * 1rem);
    color: var(--pager-arrow-txt-color);
    font-size: calc(16 / var(--font-size) * 1rem);
    line-height: 1.4;
    font-weight: 500;
    transition: all 0.3s
  }
  .c-pager-arrow--next {
  }
  .c-pager-arrow--next::before {
    content: "次へ";
    margin-right: calc(10 / var(--font-size) * 1rem);
    color: var(--pager-arrow-txt-color);
    font-size: calc(16 / var(--font-size) * 1rem);
    line-height: 1.4;
    font-weight: 500;
    transition: all 0.3s
  }
  .c-pager-arrow:hover {
    --pager-arrow-ico-color: var(--primary-color-100);
    --pager-arrow-txt-color: var(--primary-color-100);
    --pager-arrow-border-color: var(--primary-color-100);
  }
  .c-pager-arrow--disable {
    --pager-arrow-ico-color: var(--gray-color-200);
    --pager-arrow-txt-color: var(--gray-color-200);
    --pager-arrow-border-color: var(--gray-color-200);
    pointer-events: none;
  }
  .c-pager-arrow__label {
    width: calc(10 / var(--font-size) * 1rem);
    height: calc(10 / var(--font-size) * 1rem);
  }
  .c-pager-arrow--prev .c-pager-arrow__label {
    transform: rotate(180deg);
  }
  .c-pager-arrow svg {
    fill: var(--pager-arrow-ico-color);
    transition: all 0.3s
  }
  .js-pager-num {
    display: flex;
    align-items: center;
    gap: calc(5 / var(--font-size) * 1rem);
  }
  .js-pager-trigger {
    font-size: calc(14 / var(--font-size) * 1rem);
    font-weight: bold;
    color: var(--black-color);
    transition: all 0.3s;
    width: calc(36 / var(--font-size) * 1rem);
    height: calc(36 / var(--font-size) * 1rem);
    display: flex;
    align-items: center;
    justify-content: center;
    border: var(--gray-color-200) solid calc(1 / var(--font-size) * 1rem);
  }
  .js-pager-trigger--dot {
    border: none;
    margin-bottom: calc(10 / var(--font-size) * 1rem);
    width: auto;
  }
  .js-pager-trigger:hover {
    color: var(--primary-color-100);
    border-color: var(--primary-color-100);
  }
  .js-pager-trigger--active.js-pager-trigger {
    color: var(--primary-color-100);
    border-color: var(--primary-color-100);
    pointer-events: none;
  }
}
@media all and (max-width: 767px){
  .c-pager {
    margin-top: calc(30 / var(--font-size) * 1rem);
  }
  .c-pager__in {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: calc(8 / var(--font-size) * 1rem);
  }
  .c-pager-arrow {
    --pager-arrow-bg-color: var(--white-color);
    --pager-arrow-ico-color: var(--black-color);
    --pager-arrow-txt-color: var(--black-color);
    --pager-arrow-border-color: var(--gray-color-200);

    width: calc(50 / var(--font-size) * 1rem);
    height: calc(30 / var(--font-size) * 1rem);
    border: calc(1 / var(--font-size) * 1rem) solid var(--pager-arrow-border-color);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: calc(1 / var(--font-size) * 1rem);
    background-color: var(--pager-arrow-bg-color);
    transition: all 0.3s;
  }
  .c-pager-arrow--prev {
    /* transform: rotate(180deg); */
  }
  .c-pager-arrow--prev::after {
    content: "前へ";
    margin-left: calc(0 / var(--font-size) * 1rem);
    color: var(--pager-arrow-txt-color);
    font-size: calc(10 / var(--font-size) * 1rem);
    line-height: 1.4;
    font-weight: 500;
    transition: all 0.3s
  }
  .c-pager-arrow--next {
  }
  .c-pager-arrow--next::before {
    content: "次へ";
    margin-right: calc(0 / var(--font-size) * 1rem);
    color: var(--pager-arrow-txt-color);
    font-size: calc(10 / var(--font-size) * 1rem);
    line-height: 1.4;
    font-weight: 500;
    transition: all 0.3s
  }
  .c-pager-arrow:hover {
    --pager-arrow-ico-color: var(--primary-color-100);
    --pager-arrow-txt-color: var(--primary-color-100);
    --pager-arrow-border-color: var(--primary-color-100);
  }
  .c-pager-arrow--disable {
    --pager-arrow-ico-color: var(--gray-color-200);
    --pager-arrow-txt-color: var(--gray-color-200);
    --pager-arrow-border-color: var(--gray-color-200);
    pointer-events: none;
  }
  .c-pager-arrow__label {
    width: calc(10 / var(--font-size) * 1rem);
    height: calc(10 / var(--font-size) * 1rem);
  }
  .c-pager-arrow--prev .c-pager-arrow__label {
    transform: rotate(180deg);
  }
  .c-pager-arrow svg {
    fill: var(--pager-arrow-ico-color);
    transition: all 0.3s
  }
  .js-pager-num {
    display: flex;
    align-items: center;
    gap: calc(5 / var(--font-size) * 1rem);
  }
  .js-pager-trigger {
    font-size: calc(10 / var(--font-size) * 1rem);
    font-weight: bold;
    color: var(--black-color);
    transition: all 0.3s;
    width: calc(24 / var(--font-size) * 1rem);
    height: calc(24 / var(--font-size) * 1rem);
    display: flex;
    align-items: center;
    justify-content: center;
    border: var(--gray-color-200) solid calc(1 / var(--font-size) * 1rem);
  }
  .js-pager-trigger--dot {
    border: none;
    margin-bottom: calc(10 / var(--font-size) * 1rem);
    width: auto;
  }
  .js-pager-trigger:hover {
    color: var(--primary-color-100);
    border-color: var(--primary-color-100);
  }
  .js-pager-trigger--active.js-pager-trigger {
    color: var(--primary-color-100);
    border-color: var(--primary-color-100);
    pointer-events: none;
  }
}

/* --------------------------------------------------------------------------
  C-SUBMIT-BOX
-------------------------------------------------------------------------- */
@media all and (min-width: 768px) {
  .c-submit-box {
    margin-top: calc(30 / var(--font-size) * 1rem);
  }
  .c-submit-box-top {
    margin-bottom: calc(30 / var(--font-size) * 1rem);
  }
  .c-submit-box__in {
    background: var(--primary-color-10);
    border: solid calc(1 / var(--font-size) * 1rem) var(--primary-color-100);
    padding: 0 calc(28 / var(--font-size) * 1rem);
  }
  .c-submit-box__body {
    padding: calc(28 / var(--font-size) * 1rem) 0;
  }
  .c-submit-box--attention .c-submit-box__in{
    background: none;
    border: solid calc(1 / var(--font-size) * 1rem) var(--red-color-100);
  }
  .c-submit-box--important .c-submit-box__in{
    background: var(--red-color-50);
    border: solid calc(1 / var(--font-size) * 1rem) var(--red-color-100);
  }
  .c-submit-box--normal .c-submit-box__in{
    background: none;
    border: solid calc(1 / var(--font-size) * 1rem) var(--black-color);
  }
  .notification-page-sec {
    margin-top: calc(90 / var(--font-size) * 1rem);
  }
  .c-submit-list {}
  .c-submit-list .c-list-item{}
  .c-submit-list .c-list-item::before {
    color: var(--red-color-100);
  }
  .c-submit-list .c-list-item + .c-list-item{
    margin-top: calc(20 / var(--font-size) * 1rem);
  }
  .c-submit-box--white .c-submit-box__in {
    background: var(--white-color);
  }
}

@media all and (max-width: 767px) {
  .c-submit-box {
    margin-top: calc(30 / var(--font-size) * 1rem);
  }
  .c-submit-box-top {
    margin-bottom: calc(30 / var(--font-size) * 1rem);
  }
  .c-submit-box__in {
    background: var(--primary-color-10);
    border: solid calc(1 / var(--font-size) * 1rem) var(--primary-color-100);
    padding: 0 calc(20 / var(--font-size) * 1rem);
  }
  .c-submit-box__body {
    padding: calc(20 / var(--font-size) * 1rem) 0;
  }
  .c-submit-box--attention .c-submit-box__in{
    background: none;
    border: solid calc(1 / var(--font-size) * 1rem) var(--red-color-100);
  }
  .c-submit-box--important .c-submit-box__in{
    background: var(--red-color-50);
    border: solid calc(1 / var(--font-size) * 1rem) var(--red-color-100);
  }
  .c-submit-box--normal .c-submit-box__in{
    background: none;
    border: solid calc(1 / var(--font-size) * 1rem) var(--black-color);
  }
  .notification-page-sec {
    margin-top: calc(90 / var(--font-size) * 1rem);
  }
  .c-submit-list {}
  .c-submit-list .c-list-item{}
  .c-submit-list .c-list-item::before {
    color: var(--red-color-100);
  }
  .c-submit-list .c-list-item + .c-list-item{
    margin-top: calc(12 / var(--font-size) * 1rem);
  }
  .c-submit-box--white .c-submit-box__in {
    background: var(--white-color);
  }
}


/* トピックス一覧 */
@media all and (min-width: 768px) {
  .zehinfo-topics .l-info-thumbnail-list-content-img__feature {
    width: calc(250 / var(--font-size) * 1rem);
  }
  .zehinfo-topics .l-info-thumbnail-list-content-img{
    width: calc(250 / var(--font-size) * 1rem);
    height: 100%;
    border-radius: calc(10 / var(--font-size)* 1rem) 0 0 calc(10 / var(--font-size)* 1rem);
    overflow: hidden;
  }
  .zehinfo-topics  .l-info-thumbnail-list-content-img img {
    object-fit: cover;
    object-position: left top;
    height: 100%;
  }
}
@media all and (max-width: 767px){
  .zehinfo-topics .l-info-thumbnail-list-content-img{
    border-radius: calc(10 / var(--font-size)* 1rem) calc(10 / var(--font-size)* 1rem) 0 0 ;
    overflow: hidden;
  }
}

.c-submit-box.closed{
  margin-top: 0;
  margin-bottom: calc(60 / var(--font-size) * 1rem);
}


/* --------------------------------------------------------------------------
  NEWS
-------------------------------------------------------------------------- */
@media all and (min-width: 768px), print {
  .bg-header{
    color: #fff;
    text-align: center;
    background: var(--primary-color-100);
    padding: calc(10 / var(--font-size)* 1rem);
    margin-bottom: calc(24 / var(--font-size)* 1rem);
  }
}
@media all and (max-width: 767px){
  .bg-header{
    color: #fff;
    text-align: center;
    background: var(--primary-color-100);
    padding: calc(8 / var(--font-size)* 1rem);
    margin-bottom: calc(16 / var(--font-size)* 1rem);
  }
}

.info.is-hidden{
  display: none;
}