@charset "Shift_JIS";
/* Updated 2026/06/17.T */

.c-products-articles.-bg01 {
  background: none;
}
.c-products-articles_index.-bg01 {
  background: #E5EDEA;
}
.c-products-articles_indexTxt.-fs01 {
  font-size: 1.6rem;
}
.c-products-articles_indexTxt.-fs01::before {
  font-size: 1.8rem;
}
.c-products-link.-top.-icon01 {
  padding-top: 96px !important;
  position: relative;
}
.c-products-link.-top.-icon01::before {
  content: '';
  display: block;
  width: 95px;
  height: 32px;
  background: url(/kojin/direct/products/cmn/imgs/cmn_ico_line_01.png) no-repeat 0 0;
  background-size: contain;
  position: absolute;
  top: 0;
}
.c-products-articles_layerBg.-bg03 {
  z-index: 1;
}

/* SP STYLES */
@media screen and (max-width: 767.98px) {
  .c-products-link.-top.-icon01 {
    padding-top: 112px !important;
  }
}

._mt56 {
  margin-top: 56px !important;
}
._t-black01 {
  color: #475347 !important;
}

.anchor-target {
  position: relative;
}
.anchor-target::before {
  content: '';
  display: block;
  height: 82px;
  margin-top: -82px;
  visibility: hidden;
  pointer-events: none;
}
.anchor-target.-topics:not(:first-child) {
  margin-top: 80px;
}

/*-------------------------------------
monthly
-------------------------------------*/
.monthly-comments {
  margin-top: 48px;
}
.monthly-comments > .head {
  text-align: center;
}
.monthly-comments > .head .title {
  display: flex;
  max-width: 164px;
  justify-content: center;
  align-items: center;
  margin: 0 auto;
  padding: 4px;
  background: #CADDD7;
  border-radius: 32px;
  font-size: 1.4rem;
  font-weight: 500;
}
.monthly-comments > .head .detail {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 8px;
  font-size: 1.8rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: 1.2;
}
.monthly-comments > .head .detail .num {
  font-size: 2.0rem;
}
.monthly-comments > .head .detail > .inner {
  padding: 0 12px;
}
.monthly-comments > .head .detail::before,
.monthly-comments > .head .detail::after {
  content: '';
  display: block;
  width: 6px;
  height: 17px;
  background: url(/kojin/direct/products/cmn/imgs/cmn_ico_line_03.png) no-repeat 0 0;
  background-size: contain;
}
.monthly-comments > .head .detail::after {
  transform: scaleX(-1);
}
.monthly-comments > .rep-list {
  display: flex;
  justify-content: space-between;
  margin-top: 24px;
}
.monthly-comments > .rep-list > .item {
  width: calc(100% / 3 - 16px);
}
.monthly-comments > .rep-list > .item:not(:first-child) {
  margin-left: 24px;
}
.monthly-comments > .rep-list > .item .img01 {
  width: 88px;
  flex-shrink: 0;
}
.monthly-comments > .rep-list > .item .img01 > .ico {
  width: 100%;
  height: auto;
}
.monthly-comments > .rep-list .dl {
  display: flex;
  flex-flow: column wrap;
  align-items: center;
  margin-top: 11px;
}
.monthly-comments > .rep-list .title > .rep {
  display: block;
  font-size: 1.2rem;
  font-weight: 350;
  text-align: center;
}
.monthly-comments > .rep-list .title > .name {
  display: block;
  width: 99px;
  max-width: 100%;
  background: #E5EDEA;
  margin: 4px auto 0;
  padding: 4px 8px;
  color: #004831;
  font-size: 1.4rem;
  font-weight: 500;
  text-align: center;
  border-radius: 40px;
  line-height: 1;
}
.monthly-comments > .rep-list .detail {
  margin-top: 4px;
  padding-left: 12px;
  position: relative;
  font-size: 1.2rem;
}
.monthly-comments > .rep-list .detail::before {
  content: '';
  display: block;
  width: 8px;
  height: 8px;
  background: #D4A23C;
  border-radius: 50%;
  position: absolute;
  left: 0;
  top: .4em;
}

/* PC Only */
@media screen and (min-width: 768px) {
  .monthly-comments {
    padding-bottom: 40px;
  }
  .monthly-comments > .rep-list > .item {
    display: flex;
    width: calc(100% / 3 - 16px);
    justify-content: space-between;
  }
}

/* SP STYLES */
@media screen and (max-width: 767.98px) {
  .monthly-comments > .rep-list > .item {
    width: calc(100% / 3 - (32px / 3));
  }
  .monthly-comments > .rep-list > .item:not(:first-child) {
    margin-left: 16px;
  }
  .monthly-comments > .rep-list > .item .img01 {
    width: 72px;
    margin: 0 auto;
  }
}

/* SMALL STYLES */
@media screen and (max-width: 374.98px) {
  .monthly-comments > .rep-list > .item {
    width: calc(100% / 3 - (6.4vw / 3));
  }
  .monthly-comments > .rep-list > .item:not(:first-child) {
    margin-left: 2.13vw;
  }
  .monthly-comments > .rep-list .title > .rep,
  .monthly-comments > .rep-list .detail {
    font-size: 3.2vw;
  }
  .monthly-comments > .rep-list .title > .name {
    font-size: 3.73vw;
  }
}

/*-------------------------------------
Topics
-------------------------------------*/
.topics-articles {
  background: #E5EDEA;
  position: relative;
}
.topics-section {
  padding: 72px 0 56px;
  background: #F9F8F3;
  border-radius: 80px;
  position: relative;
}
.topics-section > .inner {
  width: 682px;
  max-width: 100%;
  margin: 0 auto;
}
.topics-section > .inner > .tag {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 146px;
  height: 36px;
  margin: 0 auto;
  background: #004831;
  border-radius: 24px 24px 1px 24px;
  color: #FFF;
  position: absolute;
  top: -16px;
  left: calc(50% - (146px / 2));
}
.topics-section > .inner > .tag > .img {
  width: 69px;
  height: auto;
}
.topics-section > .inner > .tag > .num {
  margin-left: 4px;
  font-family: "Roboto", sans-serif;
  font-size: 2.2rem;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.02em;
}
.topics-section .voice-area > .comment01 > .item > .txt01,
.topics-section .point-area > .comment01 > .item > .txt01 {
  background: #FFF;
}
.topics-section .voice-area > .comment01 > .item > .txt01::before,
.topics-section .point-area > .comment01 > .item > .txt01::before {
  background: url(/kojin/direct/products/cmn/imgs/bg_comment_sp.png) no-repeat 0 0;
  background-size: contain;
}
.topics-section .accordion-list > .accordion > .btn {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 155px;
  margin: 64px auto 0;
  padding: 8px 16px 8px 24px;
  background: #F9F8F3;
  color: #004831;
  font-size: 1.6rem;
  font-weight: 500;
  text-align: center;
  border: 1px solid #004831;
  border-radius: 999px;
}
.topics-section .accordion-list > .accordion > .btn::after {
  content: '';
  display: block;
  width: 24px;
  height: 24px;
  background: url(/kojin/direct/products/cmn/imgs/cmn_ico_arrow_down_01.png) no-repeat 0 0;
  background-size: contain;
  margin-left: 8px;
}
.topics-section .accordion-list > .accordion > .btn[aria-expanded=true]::after {
  transform: rotate(180deg);
}
.topics-section .c-products-articles_h2 {
  font-size: 1.8rem;
}

/* PC Only */
@media screen and (min-width: 768px) {
  .topics-articles {
    border-top-right-radius: 128px;
    padding-top: 48px;
  }
}

/* SP STYLES */
@media screen and (max-width: 767.98px) {
  .topics-articles {
    margin-top: -30px;
    padding-top: 88px;
  }
  .topics-articles::before {
    content: '';
    display: block;
    width: 100%;
    height: 88px;
    border-radius: 0px 0px 0px 88px;
    background: #F9F8F3;
    position: absolute;
    top: 0;
    left: 0;
  }
  .topics-section {
    padding: 40px 16px 32px;
    border-radius: 40px;
    box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.04);
  }
  .topics-section .accordion-list > .accordion > .btn {
    margin-top: 24px;
  }
  .topics-articles .anchor-target.-topics:first-child {
    margin-top: 88px;
  }
  .topics-section .voice-area > .comment01 > .item > .txt01,
  .topics-section .point-area > .comment01 > .item > .txt01 {
    border-radius: 12px;
  }
}

/* thank you */
.thanks-area {
  margin-top: 80px;
  background: linear-gradient(0deg,rgba(249, 248, 243, 1) 58%, rgba(229, 237, 234, 1) 58%);
}
.thanks-area > .inner {
  width: 682px;
  max-width: 100%;
  height: 330px;
  margin: 0 auto;
  padding: 88px 96px;
  background: #FFF;
  border: 6px solid #CADDD7;
  border-radius: 540px 540px 8px 8px;
  overflow: hidden;
  position: relative;
}
.thanks-area > .inner::after {
  content: '';
  display: block;
  width: 174px;
  height: 143px;
  background: url(/kojin/direct/products/cmn/imgs/cmn_bg_ico_01.png) no-repeat 0 0;
  background-size: contain;
  position: absolute;
  right: 16px;
  bottom: 0;
}
.thanks-area > .inner .head {
  display: flex;
  justify-content: center;
}
.thanks-area > .inner .text {
  margin-top: 40px;
  line-height: 1.8;
}

/* SP STYLES */
@media screen and (max-width: 767.98px) {
  .thanks-area {
    margin-top: 64px;
    padding: 0 16px;
  }
  .thanks-area > .inner {
    width: 343px;
    height: auto;
    padding: 44px 48px 32px;
    border-width: 3px;
    border-radius: 272px 272px 4px 4px;
  }
  .thanks-area > .inner .head .title {
    width: 35.86%;
    max-width: 248px;
    min-width: 124px;
  }
  .thanks-area > .inner::after {
    width: 96px;
    height: 71px;
    right: 0;
  }
  .thanks-area > .inner .text {
    margin-top: 24px;
    font-size: 1.4rem;
  }
}

/*-------------------------------------
Voice
-------------------------------------*/
.voice-area {
  padding-bottom: 32px;
  position: relative;
}
.voice-area::after {
  content: '';
  display: block;
  width: 100%;
  height: 2px;
  background: url(/kojin/direct/products/cmn/imgs/cmn_bg_line_02.png) repeat-x 0 0;
  background-size: auto 2px;
  position: absolute;
  bottom: 0;
  left: 0;
}
.voice-area > .head .title {
  display: flex;
  justify-content: center;
  align-items: center;
}
.voice-area > .head .title::before {
  content: '';
  display: block;
  width: 32px;
  height: 32px;
  background: url(/kojin/direct/products/cmn/imgs/cmn_ico_voice_01.png) no-repeat 0 0;
  background-size: contain;
  flex-shrink: 0;
}
.voice-area > .head .title > .inner {
  margin-left: 4px;
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.5;
  text-align: center;
}
.voice-area > .comment01 {
  margin-top: 8px;
}
.voice-area > .comment01 > .item {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.voice-area > .comment01 > .item:not(:first-child) {
  margin-top: 16px;
}
.voice-area > .comment01 > .item > .img01 {
  width: 88px;
  flex-shrink: 0;
}
.voice-area > .comment01 > .item > .img01 > .ico {
  width: 100%;
  height: auto;
}
.voice-area > .comment01 > .item > .img01 > .name {
  display: block;
  margin-top: 8px;
  color: #004831;
  font-size: 1.2rem;
  text-align: center;
}
.voice-area > .comment01 > .item > .txt01 {
  display: flex;
  align-items: center;
  position: relative;
  width: calc(100% - 104px);
  background: #F9F8F3;
  padding: 20px 32px;
  border-radius: 20px;
}
.voice-area > .comment01 > .item > .txt01::before {
  content: '';
  display: block;
  position: absolute;
  width: 16px;
  height: 18px;
  background: url(/kojin/direct/products/cmn/imgs/bg_comment.png) no-repeat 0 0 / 100% 100%;
  bottom: 18px;
  left: 100%;
  margin-left: -4px;
  transform: scaleX(-1);
}

/* SP STYLES */
@media screen and (max-width: 767.98px) {
  .voice-area > .comment01 {
    margin-top: 16px;
  }
  .voice-area > .comment01 > .item:not(:first-child) {
    margin-top: 24px;
  }
  .voice-area > .comment01 > .item > .img01 {
    width: 72px;
  }
  .voice-area > .comment01 > .item > .txt01 {
    width: calc(100% - 88px);
    padding: 16px;
    background: #FFF;
    font-size: 1.4rem;
    border-radius: 12px;
  }
  .voice-area > .comment01 > .item > .txt01::before {
    width: 18px;
    height: 18px;
    background: url(/kojin/direct/products/cmn/imgs/bg_comment_sp.png) no-repeat 0 0 / 100% 100%;
    left: calc(100% - 3px);
    top: calc(50% + 18px);
  }
}

/*-------------------------------------
Banker
-------------------------------------*/
.voice-area + .banker-area {
  margin-top: 32px;
}
.banker-area > .head {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.banker-area > .head > .ico {
  width: 88px;
  flex-shrink: 0;
}
.banker-area > .head > .ico > .img {
  width: 100%;
  height: auto;
}
.banker-area > .head > .text {
  width: calc(100% - 104px);
}
.banker-area > .head > .text .title {
  font-size: 1.4rem;
  font-weight: 700;
}
.banker-area > .head > .text .detail {
  display: flex;
  align-items: center;
  margin-top: 8px;
}
.banker-area > .head > .text .detail > .rep {
  color: #004831;
  font-size: 1.4rem;
}
.banker-area > .head > .text .detail > .name {
  min-width: 64px;
  margin-left: 8px;
  padding: 4px 8px;
  background: #E5EDEA;
  border-radius: 40px;
  line-height: 1;
  color: #004831;
  font-size: 1.4rem;
  text-align: center;
}
.banker-area > .body {
  margin-top: 24px;
}

/* SP STYLES */
@media screen and (max-width: 767.98px) {
  .banker-area > .head > .ico {
    width: 72px;
  }
  .banker-area > .head > .text {
    width: calc(100% - 88px);
  }
  .banker-area > .head > .text .detail > .rep {
    font-size: 1.3rem;
  }
  .banker-area > .head > .text .detail > .name {
    font-size: 1.2rem;
  }
}

/*-------------------------------------
Recommend
-------------------------------------*/
.banker-area + .recommend-area {
  margin-top: 24px;
}
.recommend-area {
  margin-top: 16px;
}
.recommend-area > .head .title {
  display: flex;
  align-items: center;
  justify-content: center;
}
.recommend-area > .head .title::before,
.recommend-area > .head .title::after {
  content: '';
  display: block;
  width: 6px;
  height: 17px;
  background: url(/kojin/direct/products/cmn/imgs/cmn_ico_line_03.png) no-repeat 0 0;
  background-size: contain;
}
.recommend-area > .head .title::after {
  transform: scaleX(-1);
}
.recommend-area > .head .title > .inner {
  padding: 0 12px;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.5;
  text-align: center;
}
.recommend-area > .body {
  margin-top: 16px;
  padding: 24px 72px;
  background: #E5EDEA;
  border-radius: 16px;
}
.recommend-area > .body .list {
  font-weight: 500;
}
.recommend-area > .body .list > .item {
  display: flex;
  align-items: flex-start;
}
.recommend-area > .body .list > .item:not(:first-child) {
  margin-top: 8px;
}
.recommend-area > .body .list > .item::before {
  content: '';
  display: block;
  width: 20px;
  height: 20px;
  background: url(/kojin/direct/products/cmn/imgs/cmn_ico_check_01.png) no-repeat left center;
  background-size: contain;
  margin-right: 8px;
  flex-shrink: 0;
  position: relative;
  top: .25em;
}

/* SP STYLES */
@media screen and (max-width: 767.98px) {
  .recommend-area > .body {
    margin-top: 12px;
    padding: 24px 16px;
  }
}

/*-------------------------------------
Step
-------------------------------------*/
.step-area {
  margin-top: 32px;
}
.step-area + .step-area {
  margin-top: 48px;
}
.step-area > .head .balloon {
  padding: 24px 0 8px;
  text-align: center;
  position: relative;
}
.step-area > .head .balloon::after {
  content: '';
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-right: 9px solid transparent;
  border-left: 9px solid transparent;
  border-top: 16px solid #c97d54;
  border-bottom: 0;
  position: absolute;
  left: calc(50% - (18px / 2));
  bottom: 0;
  z-index: 0;
}
.step-area > .head .balloon > .inner {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 24px;
  background: #C97D54;
  color: #FFF;
  line-height: 1;
  border-radius: 100px;
  font-size: 1.4rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  position: relative;
  z-index: 1;
}
.step-area > .head .title01 {
  margin-top: 16px;
  padding-bottom: 0.01em;
  border-left: 10px solid #E4B474;
}
.step-area > .head .title01 > .inner {
  display: block;
  padding-left: 12px;
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.5;
}
.step-area > .body {
  margin-top: 24px;
}
.carousel-blk01:not(:first-child) {
  margin-top: 28px;
}
.carousel-blk01 {
  max-width: calc(682px + ((50px * 2) + 14px));
  padding-right: calc(50px + 7px);
  padding-left: calc(50px + 7px);
  margin: 0 auto;
}
.carousel-blk01>.list .item>.inner {
  display: block;
  overflow: hidden;
}
.carousel-blk01>.list>.slick-arrow {
  top: calc(50% - ((40px + 32px)/ 2));
  width: 40px;
  height: 40px;
  transition: background-color .3s ease-out;
  background: #004831;
  border-radius: 50%;
  box-shadow: 0px 10px 12px 0px rgba(20, 29, 29, 0.08);
  z-index: 1;
}
.carousel-blk01>.list>.slick-arrow::before {
  content: '';
  display: block;
  position: absolute;
  top: calc(50% - (1.375em / 2));
  left: calc(50% - (1.375em / 2));
  width: 1.375em;
  height: 1.375em;
  background: url(/kojin/cmn/imgs/ico_arrow_right_02.svg) 0 0/cover no-repeat;
}
.carousel-blk01>.list>.slick-arrow::after {
  content: '';
  display: block;
  width: 40px;
  height: 40px;
  box-shadow: 0px 0px 4px 0px rgba(20, 29, 29, 0.05);
}
.carousel-blk01>.list>.slick-arrow.slick-prev::before {
  transform: rotate(180deg);
}
.carousel-blk01>.list>.slick-arrow:focus {
  background: #628f18;
}
.carousel-blk01>.list>.slick-arrow:hover {
  background: #003927;
}
.carousel-blk01>.list>.slick-arrow[aria-disabled=true] {
  visibility: hidden;
}
.carousel-blk01>.list>.slick-dots li button {
  width: 10px;
  height: 10px;
  background: #d5dedb;
  border-radius: 50%;
}
.carousel-blk01>.list>.slick-dots li button[aria-selected=true] {
  background: #004831;
}
.carousel-blk01>.list>.slick-dots li.slick-active button::before {
  background: #004831;
}
.carousel-blk01>.list>.slick-dots li:not(:first-child) {
  margin-left: 12px;
}
.carousel-blk01 .container {
  position: relative;
  width: 100%;
  max-width: 300px;
  margin-top: 30px;
  margin-right: auto;
  margin-left: auto;
}
.carousel-blk01 .container .slick-num {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: rgba(255,255,255,.5);
  text-align: center;
  line-height: 2;
  font-size: 18px;
}
.carousel-blk01>.list .slick-slide {
  padding: 0 50px;
}
.carousel-blk01>.list .item .carousel-inner {
  display: block;
}
.carousel-blk01>.list .item .carousel-inner > .head .title {
  display: flex;
}
.carousel-blk01>.list .item .carousel-inner > .head .title > .ico {
  display: inline-block;
  width: 28px;
  height: 28px;
  background: #C97D54;
  border-radius: 50%;
  color: #FFF;
  font-size: 1.8rem;
  font-family: "Roboto", sans-serif;
  font-weight: 700;
  text-align: center;
  line-height: 28px;
  margin-right: 8px;
  flex-shrink: 0;
}
.carousel-blk01>.list .item .carousel-inner > .head .title > .inner {
  font-size: 1.8rem;
  font-weight: 700;
}
.carousel-blk01>.list .item .carousel-inner > .img {
  width: 100%;
  margin: 24px auto 0;
  text-align: center;
}
.carousel-blk01>.list .item .carousel-inner > .text {
  width: 100%;
  max-width: 504px;
  padding-top: 24px;
}
.carousel-blk01>.list .item .carousel-inner > .text .list-notice01 {
  color: #56635F;
  font-size: 1.2rem;
}
.carousel-blk01>.list>.slick-arrow.slick-prev {
  left: -20px;
}
.carousel-blk01>.list>.slick-arrow.slick-next {
  right: -20px;
}
.carousel-blk01>.list>.slick-dots {
  bottom: 0;
  font-size: 0;
  position: static;
  width: auto;
  max-width: 460px;
  margin: 16px auto 0;
}
.carousel-blk01>.list>.slick-dots>li,
.carousel-blk01>.list>.slick-dots>li:not(:first-child) {
  margin: 6px 6px 0;
}
.carousel-blk01>.list>.slick-dots>li.slide-stop,
.carousel-blk01>.list>.slick-dots>li.slide-stop:not(:first-child) {
  margin: 0 6px 0;
  vertical-align: middle;
}
.carousel-blk01>.list>.slick-dots>li.slide-stop::before,
.carousel-blk01>.list>.slick-dots>li.slide-stop:not(:first-child)::before {
  top: 0;
}
.carousel-blk01>.list.slick-dotted {
  padding-bottom: 0;
}
.carousel-blk01>.slick-num {
  margin: 16px auto 0;
  text-align: center;
  font-size: 2rem;
  color: #004831;
}
.carousel-blk01>.slick-num>.now-count {
  font-size: 2.4rem;
  font-weight: 700;
}
.carousel-blk01>.slick-num>.slide-stop {
  display: inline-block;
  margin: 0 0 0 12px;
}
.carousel-blk01>.slick-num>.slide-stop::before {
  content: '';
  display: inline-block;
  width: 6px;
  height: 10px;
  border-right: 2px solid #d5dedb;
  border-left: 2px solid #d5dedb;
}
.carousel-blk01>.slick-num>.slide-stop.is-stop::before {
  width: 0;
  height: 0;
  border-width: 5px 0 5px 10px;
  border-style: solid;
  border-color: transparent transparent transparent #004831;
}
.carousel-blk01 .slick-list {
  background: #FFF;
  border-radius: 24px;
  box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.04);
}

/* PC Only */
@media screen and (min-width: 768px) {
  .carousel-blk01 .slick-list {
    min-height: 300px;
  }
  .carousel-blk01>.list .item .carousel-inner {
    width: 100%;
    max-width: 568px;
    padding: 32px 32px;
  }
  .carousel-blk01>.list .item .carousel-inner > .head .title {
    text-align: center;
  }
}

/* SP STYLES */
@media screen and (max-width: 767.98px) {
  .carousel-blk01 {
    max-width: 100%;
    padding-right: 0;
    padding-left: 0;
  }
  .carousel-blk01>.list .slick-slide {
    padding: 0 16px;
  }
  .carousel-blk01>.list>.slick-arrow.slick-prev {
    left: -8px;
  }
  .carousel-blk01>.list>.slick-arrow.slick-next {
    right: -8px;
  }
  .carousel-blk01>.list .item .carousel-inner {
    padding: 32px 0;
  }
}

/*-------------------------------------
fan!Fun!POINT
-------------------------------------*/
.point-area {
  margin-top: 48px;
  padding-top: 32px;
  position: relative;
}
.point-area::before {
  content: '';
  display: block;
  width: 100%;
  height: 2px;
  background: url(/kojin/direct/products/cmn/imgs/cmn_bg_line_01.png) repeat-x 0 0;
  background-size: auto 2px;
  position: absolute;
  top: 0;
  left: 0;
}
.point-area > .head::before {
  content: '';
  display: block;
  width: 95px;
  height: 32px;
  margin: 0 auto;
  background: url(/kojin/direct/products/cmn/imgs/cmn_ico_line_01.png) no-repeat 0 0;
  background-size: contain;
}
.point-area > .head .title {
  margin-top: 12px;
  text-align: center;
}
.point-area > .head .title .sub {
  display: flex;
  align-items: center;
  justify-content: center;
}
.point-area > .head .title .sub > .inner {
  padding: 0 8px;
}
.point-area > .head .title .sub::before,
.point-area > .head .title .sub::after {
  content: '';
  display: block;
  width: 5px;
  height: 12px;
  background: url(/kojin/direct/products/cmn/imgs/cmn_ico_line_02.png) no-repeat 0 0;
  background-size: contain;
}
.point-area > .head .title .sub::after {
  transform: scaleX(-1);
}
.point-area > .head .title .sub + .img {
  margin-top: 4px;
}
.point-area > .comment01 {
  margin-top: 24px;
}
.point-area > .comment01 > .item {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}
.point-area > .comment01 > .item:not(:first-child) {
  margin-top: 16px;
}
.point-area > .comment01 > .item > .img01 {
  width: 88px;
  flex-shrink: 0;
}
.point-area > .comment01 > .item > .img01 > .ico {
  width: 100%;
  height: auto;
}
.point-area > .comment01 > .item > .img01 > .name {
  display: block;
  margin-top: 8px;
  color: #004831;
  font-size: 1.2rem;
  text-align: center;
}
.point-area > .comment01 > .item:not(.-banker) {
  align-items: center;
}
.point-area > .comment01 > .item.-banker {
  flex-flow: row-reverse nowrap;
}
.point-area > .comment01 > .item > .txt01 {
  display: flex;
  align-items: center;
  position: relative;
  width: calc(100% - 104px);
  padding: 16px;
  background: #F9F8F3;
}
.point-area > .comment01 > .item:not(.-banker) > .txt01 {
  padding: 20px 32px;
}
.point-area > .comment01 > .item.-banker > .txt01 {
  border-radius: 12px;
}
.point-area > .comment01 > .item > .txt01::before {
  content: '';
  display: block;
  position: absolute;
  width: 16px;
  height: 18px;
  background: url(/kojin/direct/products/cmn/imgs/bg_comment.png) no-repeat 0 0 / 100% 100%;
}
.point-area > .comment01 > .item:not(.-banker) > .txt01::before {
  bottom: 18px;
  left: 100%;
  margin-left: -4px;
  transform: scaleX(-1);
}
.point-area > .comment01 > .item.-banker > .txt01::before {
  top: 18px;
  right: 100%;
  margin-right: -4px;
}
.point-area > .comment01 > .item.-banker > .txt01::after {
  content: '';
  display: block;
  width: 32px;
  height: 32px;
  background: url(/kojin/direct/products/cmn/imgs/cmn_ico_light_01.svg) no-repeat 0 0;
  background-size: contain;
  position: absolute;
  top: -12px;
  left: -14px;
}
.point-area > .comment01 > .item.-banker > .txt01 > .inner {
  letter-spacing: 0.02em;
  line-height: 1.8;
}
/* SP STYLES */
@media screen and (max-width: 767.98px) {
  .point-area > .comment01 > .item:not(:first-child) {
    margin-top: 24px;
  }
  .point-area > .comment01 > .item > .img01 {
    width: 64px;
  }
  .point-area > .comment01 > .item > .txt01 {
    width: calc(100% - 80px);
    background: #FFF;
    font-size: 1.4rem;
  }
  .point-area > .comment01 > .item > .txt01::before {
    width: 18px;
    height: 18px;
    background: url(/kojin/direct/products/cmn/imgs/bg_comment_sp.png) no-repeat 0 0 / 100% 100%;
  }
  .point-area > .comment01 > .item:not(.-banker) > .txt01 {
    padding: 16px;
  }
  .point-area > .comment01 > .item:not(.-banker) > .txt01::before {
    bottom: calc(50% - (18px / 2));
    left: calc(100% - 3px);
  }
  .point-area > .comment01 > .item.-banker > .txt01::before {
    right: calc(100% - 3px);
  }
}

/*-------------------------------------
post-link
-------------------------------------*/
.c-products-articles_sns + .post-link {
  margin-top: 48px;
}
.post-link > .item {
  width: 100%;
  max-width: 236px;
}

/* SP STYLES */
@media screen and (max-width: 767.98px) {
  .post-link > .item {
    width: calc(50% - 8px);
    max-width: none;
  }
  .post-link>.item:not(:first-child) {
    margin-left: 16px;
  }
  .post-link>.item>.btn-type01 {
    padding-left: 2em;
    padding-right: 2em;
  }
  .post-link .glyph-link01.-left>.inner::before {
    left: 0.8em;
  }
  .post-link .icon-link01>.inner::after {
    right: 0.8em;
  }
}

/* SMALL STYLES */
@media screen and (max-width: 360.98px) {
  .post-link>.item>.btn-type01 {
    font-size: 4.27vw;
  }
}

/*-------------------------------------
find more
-------------------------------------*/
.findmore-area {
  padding: 80px 0 64px;
  position: relative;
}
.findmore-area > .head > .title .txt {
  display: block;
  margin-top: 8px;
  font-size: 2.2rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  line-height: 1.5;
}
.findmore-area > .head > .img {
  position: absolute;
}
.findmore-area > .list {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 80px;
}
.findmore-area > .list > .link {
  text-decoration: none;
}
.findmore-area > .list .img-box {
  width: 100%;
  padding-top: 67.8%;
  overflow: hidden;
  border-width: 4px;
  border-style: solid;
  position: relative;
}
.findmore-area > .list .img-box.-type01 {
  border-radius: 8px 48px;
}
.findmore-area > .list .img-box.-type02 {
  border-radius: 120px 120px 4px 4px;
}
.findmore-area > .list .img-box.-color01 {
  border-color: #E4B474;
}
.findmore-area > .list .img-box.-color02 {
  border-color: #608070;
}
.findmore-area > .list .img-box.-color03 {
  border-color: #E9B1AA;
}
.findmore-area > .list .img-box.-color04 {
  border-color: #004831;
}
.findmore-area > .list .img-box > .img {
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  transition: .35s all;
}
.findmore-area > .list .info-box {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 12px;
}
.findmore-area > .list .info-box > .cat {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 5px;
  min-width: 72px;
  height: 20px;
  background: #CADDD7;
  border-radius: 40px;
  font-size: 1.2rem;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0;
}
.findmore-area > .list .info-box > .date {
  padding-left: 16px;
  font-family: "Roboto", sans-serif;
  font-size: 1.4rem;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0;
  position: relative;
}
.findmore-area > .list .info-box > .date::before {
  display: block;
  content: '';
  width: 12px;
  height: 12px;
  background-color: #E4B474;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}
.findmore-area > .list .text {
  margin-top: 10px;
  min-height: 42px;
  font-size: 1.4rem;
  font-weight: 700;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  line-clamp: 2;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

/* PC Only */
@media screen and (min-width: 768px) {
  .findmore-area > .head > .title {
    text-align: center;
  }
  .findmore-area > .head > .img {
    top: 0;
    right: 55px;
  }
  .findmore-area > .list > .link {
    width: calc(25% - 14px);
  }
  .findmore-area > .list > .link:not(:first-child) {
    margin-left: 32px;
  }
  .findmore-area > .list > .link:hover .img-box > .img {
    transform: translate(-50%, -50%) scale(1.1);
  }
  .findmore-area > .list > .link:hover .text {
    text-decoration: underline;
    text-underline-offset: 3px;
  }
  .findmore-area > .list + .btn-list01 {
    margin-top: 64px;
  }
}

/* SP STYLES */
@media screen and (max-width: 767.98px) {
  .findmore-area {
    margin-top: 72px;
    padding: 80px 16px;
  }
  .findmore-area > .head > .title {
    max-width: 221px;
  }
  .findmore-area > .head > .title .txt {
    font-size: 1.6rem;
  }
  .findmore-area > .head > .img {
    top: 25px;
    right: 16px;
  }
  .findmore-area > .list > .link {
    width: calc(50% - 8px);
  }
  .findmore-area > .list > .link:not(:first-child) {
    margin-left: 16px;
  }
  .findmore-area > .list .img-box {
    border-width: 3px;
  }
  .findmore-area > .list .img-box.-type01 {
    border-radius: 8px 40px;
  }
  .findmore-area > .list .img-box.-type02 {
    border-radius: 80px 80px 4px 4px;
  }
  .findmore-area > .list + .btn-list01 {
    margin-top: 40px;
  }
}

/* SMALL STYLES */
@media screen and (max-width: 360.98px) {
  .findmore-area > .head > .title {
    max-width: 58.93vw;
  }
}