/*==============================================================================
Media
============================================================================= */
/*==============================================================================
fv
============================================================================= */
@media screen and (min-width: 769px) { .fv .fv-bg { padding: 94px 0 200px; }
  .fv .fv-inner { position: relative; }
  .fv .fv-ttl { font-size: 58px; line-height: 1.17; }
  .fv .fv-txt { margin: 30px 0 0; font-size: 14px; line-height: 1.76; letter-spacing: .14em; }
  .fv .fv-illust { width: 666px; position: absolute; top: -42px; left: 475px; }
  .fv .fv-btn { width: 220px; margin: 40px 20px 0 0; padding: 25px 0; font-size: 16px; line-height: 1; text-align: center; border-radius: 10px;float: left;  } }

@media screen and (max-width: 768px) { .fv .fv-bg { padding: .75rem 0 2rem; }
  .fv .fv-ttl { font-size: .82rem; line-height: 1.2; }
  .fv .fv-txt { margin: .4rem 0 0; font-size: .26rem; line-height: 1.8; letter-spacing: .18em; }
  .fv .fv-illust { width: 6.8rem; margin: .7rem auto 0; }
  .fv .fv-btn { width: 5.8rem; margin: .6rem  auto 0; padding: .45rem 0; font-size: .3rem; line-height: 1; text-align: center; border-radius: .1rem; } }

/*==============================================================================
topic
============================================================================= */
@media screen and (min-width: 769px) { .topic { position: relative; }
  .topic .topic-bg { width: 1200px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
  .topic .topic-content { padding: 35px 0; width: calc(1200px + 23vw); margin: 0 -23vw 0 0; background-color: #f5f5f5; position: absolute; top: 50%; left: 0; transform: translateY(-50%); }
  .topic .topic-inner { margin: 0 0 0 40px; }
  .topic .topic-wrap { display: flex; align-items: center; }
  .topic .topic-ttl { width: 116px; margin: 0 20px 0 0; }
  .topic .topic-link { font-size: 16px; letter-spacing: 0.06em; line-height: 1; } }

@media screen and (max-width: 768px) { .topic { position: relative; }
  .topic .topic-bg { width: 6.9rem; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
  .topic .topic-content { width: calc(6.9rem + 4vw); margin: 0 -4vw 0 0; padding: .3rem; background-color: #f5f5f5; position: absolute; top: 50%; left: 0; transform: translateY(-50%); }
  .topic .topic-inner { margin: 0; }
  .topic .topic-inner { width: 6.3rem; }
  .topic .topic-ttl { width: 1.6rem; }
  .topic .topic-link { margin: .2rem 0 0; font-size: .24rem; letter-spacing: 0.12em; line-height: 1.4; } }

/*==============================================================================
about
============================================================================= */
@media screen and (min-width: 769px) { .about .about-bg { padding: 182px 0 136px; background-color: #282828; }
  .about .about-inner { position: relative; }
  .about .about-inner::before { content: ''; width: 447px; height: 447px; background-image: url(../../images/jp/top/about_bg02.png); background-size: 100% auto; background-repeat: no-repeat; position: absolute; top: -13px; left: -164px; }
  .about .about-ttl { font-size: 36px; line-height: 1; letter-spacing: .02em; text-align: center; }
  .about .about-txt { margin: 40px 0 0; font-size: 16px; letter-spacing: .16em; line-height: 2.18; text-align: center; }
  .about .about-bnr { display: flex; flex-wrap: wrap; justify-content: space-between; margin: 70px 0 0; }
  .about .about-bnr .bnr { background: #f5f5f5; position: relative; padding: 60px 0 30px; }
  .about .about-bnr .bnr .ttl { font-size: 20px; line-height: 1; letter-spacing: .06em; text-align: center; position: relative; }
  .about .about-bnr .bnr .ttl::before { content: ''; width: 76px; height: 1px; background: #282828; position: absolute; top: 5px; left: 74px; transform: rotate(-45deg); }
  .about .about-bnr .bnr .pic { width: 446px; margin: 40px 0 0 auto; }
  .about .about-bnr .bnr .txt { width: 390px; margin: 40px auto 0; font-size: 14px; line-height: 2; letter-spacing: .06em; }
  .about .about-bnr .bnr .more { width: 390px; margin: 40px auto 0; text-align: right; line-height: 1; }
  .about .about-bnr .bnr .more span { display: inline-block; padding: 0 0 8px; border-bottom: 1px solid #000; }
  .about .about-bnr .bnr01 { width: 100%; padding: 87px 0 43px; background-image: url(../../images/jp/top/about_bg01.png); background-repeat: no-repeat; background-size: 513px 100%; background-position: left top; }
  .about .about-bnr .bnr01 .ttl { margin: 0 0 0 590px; text-align: left; }
  .about .about-bnr .bnr01 .ttl::before { top: -25px; left: -59px; }
  .about .about-bnr .bnr01 .pic { width: 549px; position: absolute; top: 118px; left: 19px; margin: 0; }
  .about .about-bnr .bnr01 .logo { width: 185px; margin: 35px 0 0 590px; }
  .about .about-bnr .bnr01 .txt { width: 400px; margin: 30px 0 0 590px; }
  .about .about-bnr .bnr01 .more { width: 400px; margin: 30px 0 0 590px; text-align: right; }
  .about .about-bnr .bnr02, .about .about-bnr .bnr03 { width: 494px; margin: 78px 0 0; }
  .about .about-bnr .bnr02 .pic { box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.15); } }

@media screen and (max-width: 768px) { .about .about-bg { padding: 2.1rem 0 1.1rem; background-color: #282828; }
  .about .about-inner { position: relative; }
  .about .about-inner::before { content: ''; width: 5.12rem; height: 5.12rem; background-image: url(../../images/jp/top/about_bg02.png); background-size: 100% auto; background-repeat: no-repeat; position: absolute; top: 1.27rem; left: -3.06rem; }
  .about .about-ttl { font-size: .48rem; line-height: 1; letter-spacing: .02em; text-align: center; }
  .about .about-txt { width: 7.5rem; margin: .5rem 0 0; font-size: .26rem; letter-spacing: .16em; line-height: 1.69; text-align: center; position: relative; left: 50%; transform: translateX(-50%); }
  .about .about-bnr { margin: .1rem 0 0; }
  .about .about-bnr .bnr { background: #f5f5f5; position: relative; margin: .7rem 0 0; padding: .9rem 0 .6rem; text-align: center; }
  .about .about-bnr .bnr .ttl { display: inline-block; margin: 0 auto; font-size: .38rem; line-height: 1; letter-spacing: .06em; text-align: center; position: relative; }
  .about .about-bnr .bnr .ttl::before { content: ''; width: .76rem; height: 1px; background: #282828; position: absolute; top: -.11rem; left: -.77rem; transform: rotate(-45deg); }
  .about .about-bnr .bnr .pic { width: 6.32rem; margin: .6rem 0 0 auto; }
  .about .about-bnr .bnr .txt { width: 5.44rem; margin: .4rem auto 0; font-size: .24rem; line-height: 2; letter-spacing: .06em; }
  .about .about-bnr .bnr .more { width: 5.44rem; font-size: .26rem; margin: .5rem auto 0; text-align: right; line-height: 1; }
  .about .about-bnr .bnr .more span { display: inline-block; padding: 0 0 .15rem; border-bottom: 1px solid #000; }
  .about .about-bnr .bnr.bnr01 { padding: 1.07rem 0 .6rem; background-image: url(../../images/jp/top/about_bg01.png); background-repeat: no-repeat; background-size: 5.93rem 4.95rem; background-position: left top; }
  .about .about-bnr .bnr.bnr01 .pic { width: 6.23rem; margin: 0 auto; }
  .about .about-bnr .bnr.bnr01 .ttl { margin: 1.1rem auto 0; font-size: .26rem; }
  .about .about-bnr .bnr.bnr01 .ttl::before { left: -.65rem; }
  .about .about-bnr .bnr.bnr01 .logo { width: 2.44rem; margin: .42rem auto 0; } }

/*==============================================================================
value
============================================================================= */
@media screen and (min-width: 769px) { .value { overflow: hidden; }
  .value .value-bg { padding: 177px 0 60px; background-color: #f5f5f5; }
  .value .value-circle { position: relative; }
  .value .value-circle::before { content: ''; width: 1887px; height: 1887px; background: url(../../images/jp/top/value_circle01.png) no-repeat center/cover; position: absolute; top: -756px; left: 679px; }
  .value .value-ttl { font-size: 38px; line-height: 1; letter-spacing: .02em; position: relative; content: ''; z-index: 2; }
  .value .value-ttl::before { content: ''; width: 155px; height: 1px; background: #000; position: absolute; bottom: -39px; left: -31px; }
  .value .value-block { z-index: 2; position: relative; }
  .value .value-list { margin: 85px 0 0; }
  .value .value-item { margin: 20px 0 0 96px; position: relative; }
  .value .value-item-txt { padding: 15px; display: inline-block; background: #282828; font-size: 25px; line-height: 1; letter-spacing: .02em; }
  .value .value-item.item01 { margin: 0 0 0 96px; }
  .value .value-item.item01::before { content: ''; width: 15px; height: 49px; background: url(../../images/jp/top/value_num01.png) no-repeat center; background-size: 100% auto; position: absolute; top: 4px; left: -47px; }
  .value .value-item.item02::before { content: ''; width: 38px; height: 49px; background: url(../../images/jp/top/value_num02.png) no-repeat center; background-size: 100% auto; position: absolute; top: 4px; left: -58px; }
  .value .value-item.item03::before { content: ''; width: 40px; height: 49px; background: url(../../images/jp/top/value_num03.png) no-repeat center; background-size: 100% auto; position: absolute; top: 4px; left: -59px; }
  .value .value-illust { width: 582px; position: absolute; top: -171px; right: 36px; z-index: 2; }
  .value .value-pic { width: 1630px; margin: 208px 0 0 -484px; position: relative; z-index: 2; } }

@media screen and (max-width: 768px) { .value { overflow: hidden; }
  .value .value-bg { padding: .98rem 0 0; background-color: #f5f5f5; }
  .value .value-circle { position: relative; }
  .value .value-circle::before { content: ''; width: 18.87rem; height: 18.87rem; background: url(../../images/jp/top/value_circle01.png) no-repeat center/cover; position: absolute; top: -4.2rem; left: 1rem; }
  .value .value-ttl { font-size: .48rem; line-height: 1; letter-spacing: .02em; position: relative; content: ''; z-index: 2; }
  .value .value-ttl::before { content: ''; width: 3.11rem; height: 1px; background: #000; position: absolute; bottom: -.42rem; left: -.3rem; }
  .value .value-block { z-index: 2; position: relative; }
  .value .value-list { margin: 1rem 0 0; }
  .value .value-item { margin: .3rem 0 0 1.65rem; position: relative; }
  .value .value-item-txt { padding: .2rem; display: inline-block; background: #282828; font-size: .33rem; line-height: 1; letter-spacing: .04em; }
  .value .value-item.item01 { margin: 0 0 0 1.65rem; }
  .value .value-item.item01::before { content: ''; width: .2rem; height: .63rem; background: url(../../images/jp/top/value_num01.png) no-repeat center; background-size: 100% auto; position: absolute; top: .05rem; left: -.6rem; }
  .value .value-item.item02::before { content: ''; width: .48rem; height: .63rem; background: url(../../images/jp/top/value_num02.png) no-repeat center; background-size: 100% auto; position: absolute; top: .05rem; left: -.74rem; }
  .value .value-item.item03::before { content: ''; width: .52rem; height: .63rem; background: url(../../images/jp/top/value_num03.png) no-repeat center; background-size: 100% auto; position: absolute; top: .05rem; left: -.76rem; }
  .value .value-illust { width: 6.54rem; margin: .64rem auto 0; }
  .value .value-pic { margin: .8rem 0 0; width: 7.5rem; position: relative; left: 50%; transform: translateX(-50%); } }

/*==============================================================================
voice
============================================================================= */
@media screen and (min-width: 769px) { .voice { overflow: hidden; position: relative; }
  .voice .voice-bg { padding: 60px 0 143px; background-color: #f5f5f5; }
  .voice .voice-circle::before { content: ''; width: 1887px; height: 1887px; background: url(../../images/jp/top/value_circle01.png) no-repeat center/cover; position: absolute; bottom: -784px; left: -1495px; }
  .voice .voice-ttl { font-size: 40px; text-align: center; line-height: 1; letter-spacing: .02em; position: relative; z-index: 2; }
  .voice .voice-slider { margin: 80px 0 0; position: relative; z-index: 2; }
  .voice .voice-slide { display: flex; align-items: start; transition-property: all; }
  .voice .voice-slide .pic { width: 707px; }
  .voice .voice-slide .box { width: 410px; margin: 185px 0 0 -35px; padding: 20px 25px; position: relative; background-color: #fff; border-left: 5px solid #000; box-shadow: 0px 5px 30px 0px rgba(0, 0, 0, 0.1); }
  .voice .voice-slide .box-top { padding: 10px 0; border-bottom: 1px solid #eaeaea; }
  .voice .voice-slide .box-top .icon { width: 212px; position: absolute; top: -90px; left: -52px; }
  .voice .voice-slide .box-top .ttl { font-size: 20px; line-height: 1.5; letter-spacing: .1em; }
  .voice .voice-slide .box-top .lead { margin: 40px 0 0; font-size: 14px; line-height: 1.3; letter-spacing: .1em; }
  .voice .voice-slide .box-bottom { display: flex; justify-content: space-between; align-items: center; padding: 20px 0 0; }
  .voice .voice-slide .box-bottom .name { font-size: 14px; line-height: 1; letter-spacing: .1em; }
  .voice .voice-slide .box-bottom .logo { width: 123px; }
  .voice .voice-slider-link01 { margin: 38px 0 0; text-align: right; }
  .voice .voice-slider-link01 span { display: inline-block; padding: 0 0 8px; border-bottom: 1px solid #000; }
  .voice .voice-block { margin: 202px 0 0; position: relative; z-index: 2; }
  .voice .voice-block .txt { margin: 0 0 0 20px; font-size: 28px; line-height: 1.3; position: relative; letter-spacing: 0.02em; z-index: 2; }
  .voice .voice-block .txt .size01 { font-size: 34px; }
  .voice .voice-block .txt .size02 { font-size: 40px; }
  .voice .voice-block .txt .asterisk { font-size: 11px; vertical-align: text-top; }
  .voice .voice-block .txt::after { content: ''; width: 581px; height: 1px; background: #000; position: absolute; bottom: -20px; left: 0; }
  .voice .voice-block .illust { width: 641px; position: absolute; top: -119px; left: 563px; }
  .voice .voice-block .note { display: inline-block; position: absolute; top: 244px; left: 670px; font-size: 10px; line-height: 1; }
  .voice .voice-logo { margin: 310px 0 0; padding: 64px 0 40px; background: #fff; position: relative; z-index: 2; }
  .voice .voice-logo .txt { font-size: 26px; line-height: 1; letter-spacing: 0.02em; text-align: center; }
  .voice .voice-logo .logo { width: 1028px; margin: 0 auto; }
  .voice .voice-logo .note { width: 1028px; margin: -50px auto 0; font-size: 12px; line-height: 1; text-align: right; }
  .voice .swiper-button-prev { left: -85px; }
  .voice .swiper-button-prev:after { content: ''; width: 39px; height: 75px; background: url(../../images/jp/top/voice_arrow_left.png) no-repeat; background-size: 100% auto; }
  .voice .swiper-button-next { right: -85px; }
  .voice .swiper-button-next:after { content: ''; width: 39px; height: 75px; background: url(../../images/jp/top/voice_arrow_right.png) no-repeat; background-size: 100% auto; }
  .voice .swiper-pagination { display: flex; justify-content: center; width: 100%; margin: 45px 0 0; }
  .voice .swiper-pagination-bullet { width: 13px; height: 13px; margin: 0 10px; background: transparent; border: 1px solid #373737; opacity: 1; }
  .voice .swiper-pagination-bullet-active { background: #373737; } }

@media screen and (max-width: 768px) { .voice { overflow: hidden; position: relative; }
  .voice .voice-bg { padding: 1.14rem 0 1.03rem; background-color: #f5f5f5; }
  .voice .voice-circle::before { content: ''; width: 18.87rem; height: 18.87rem; background: url(../../images/jp/top/value_circle01.png) no-repeat center/cover; position: absolute; bottom: -5.5rem; left: -14.95rem; }
  .voice .voice-ttl { font-size: .48rem; text-align: center; line-height: 1; letter-spacing: .02em; position: relative; z-index: 2; }
  .voice .voice-slider { margin: .85rem 0 0; position: relative; z-index: 2; }
  .voice .voice-slide { transition-property: all; }
  .voice .voice-slide .pic { width: 6.2rem; margin: 0 auto; }
  .voice .voice-slide .box { width: 5.3rem; margin: -.54rem auto 0; padding: .2rem; position: relative; background-color: #fff; border-left: .05rem solid #000; box-shadow: 0px 0.05rem 0.3rem 0px rgba(0, 0, 0, 0.1); }
  .voice .voice-slide .box-top { padding: .1rem 0; border-bottom: 1px solid #eaeaea; }
  .voice .voice-slide .box-top .icon { width: 2.12rem; position: absolute; top: -.89rem; left: -.59rem; }
  .voice .voice-slide .box-top .ttl { font-size: .28rem; line-height: 1.5; letter-spacing: .1em; }
  .voice .voice-slide .box-top .lead { margin: .5rem 0 0; font-size: .2rem; line-height: 1.4; letter-spacing: .1em; }
  .voice .voice-slide .box-bottom { display: flex; justify-content: space-between; align-items: center; padding: .42rem 0 0; }
  .voice .voice-slide .box-bottom .name { font-size: .2rem; line-height: 1; letter-spacing: .1em; }
  .voice .voice-slide .box-bottom .logo { width: 2rem; }
  .voice .voice-slider-link01 { margin: .6rem 0 0; text-align: right; font-size: .26rem; }
  .voice .voice-slider-link01 span { display: inline-block; padding: 0 0 .15rem; border-bottom: 1px solid #000; }
  .voice .voice-block { width: 6.31rem; margin: .95rem auto 0; position: relative; }
  .voice .voice-block .txt { font-size: .34rem; line-height: 1.3; letter-spacing: .02em; position: relative; }
  .voice .voice-block .txt .size01 { font-size: .4rem; }
  .voice .voice-block .txt .size02 { font-size: .46rem; }
  .voice .voice-block .txt .asterisk { font-size: .16rem; vertical-align: text-top; }
  .voice .voice-block .txt::after { content: ''; width: 6.31rem; height: 1px; background: #000; position: absolute; bottom: -.2rem; left: 50%; transform: translateX(-50%); }
  .voice .voice-block .illust { width: 6.41rem; position: absolute; top: 1.89rem; left: 50%; transform: translateX(-50%); }
  .voice .voice-block .note { display: block; width: 100%; text-align: center; position: absolute; top: 5.6rem; left: 50%; transform: translateX(-50%); font-size: .16rem; }
  .voice .voice-logo { margin: 6.27rem 0 0; padding: .55rem .4rem .3rem; background: #fff; position: relative; z-index: 2; }
  .voice .voice-logo .txt { font-size: .34rem; line-height: 1.5; letter-spacing: 0.02em; text-align: center; }
  .voice .voice-logo .logo { width: auto; margin: .1rem auto 0; }
  .voice .voice-logo .note { margin: -.2rem auto 0; font-size: .18rem; line-height: 1; text-align: right; }
  .voice .swiper-button-prev { left: -.2rem; }
  .voice .swiper-button-prev:after { content: ''; width: .38rem; height: .72rem; background: url(../../images/jp/top/voice_arrow_left.png) no-repeat; background-size: 100% auto; }
  .voice .swiper-button-next { right: -.2rem; }
  .voice .swiper-button-next:after { content: ''; width: .38rem; height: .72rem; background: url(../../images/jp/top/voice_arrow_right.png) no-repeat; background-size: 100% auto; }
  .voice .swiper-pagination { display: flex; justify-content: center; width: 100%; margin: .5rem 0 0; }
  .voice .swiper-pagination-bullet { width: .15rem; height: .15rem; margin: 0 .1rem; background: transparent; border: 1px solid #373737; opacity: 1; }
  .voice .swiper-pagination-bullet-active { background: #373737; } }

/*==============================================================================
company
============================================================================= */
@media screen and (min-width: 769px) { .company .company-bg { padding: 453px 0 62px; background: url(../../images/jp/top/corprate_bg01_pc.jpg) no-repeat center/cover; }
  .company .company-lead { font-size: 24px; letter-spacing: .06em; line-height: 1; }
  .company .company-txt { margin: 30px 0 0; font-size: 14px; letter-spacing: .06em; line-height: 2; } }

@media screen and (max-width: 768px) { .company .company-bg { padding: 0 0 .8rem; }
  .company .company-pic { width: 7.5rem; position: relative; left: 50%; transform: translateX(-50%); }
  .company .company-lead { color: #282828; margin: .6rem 0 0; font-size: .36rem; letter-spacing: .06em; line-height: 1; }
  .company .company-txt { color: #282828; margin: .4rem 0 0; font-size: .2rem; letter-spacing: .06em; line-height: 2; } }

/*==============================================================================
cta
============================================================================= */
@media screen and (min-width: 769px) { .cta .cta-bg { padding: 90px 0 110px; background: url(../../images/jp/common/cta_bg01_pc.jpg) no-repeat center/cover; }
  .cta .cta-ttl { font-size: 24px; letter-spacing: .06em; line-height: 1; text-align: center; }
  .cta .cta-block { display: flex; flex-wrap: wrap; justify-content: center; margin: 71px 0 0; }
  .cta .cta-block .btn { display: flex; justify-content: center; align-self: center; background: #fff; width: 505px; height: 120px; position: relative; border-radius: 10px; color: #282828; font-size: 24px; letter-spacing: .06em; line-height: 1; }
  .cta .cta-block .btn .txt { display: flex; align-self: center; text-align: center; }
  .cta .cta-block .btn.btn01 .icon { width: 120px; position: absolute; top: -46px; left: -19px; }
  .cta .cta-block .btn.btn02 { margin: 0 0 0 30px; background-image: linear-gradient(-50deg, #902e2b 0%, #b02c3c 64%, #be2b4b 100%); }
  .cta .cta-block .btn.btn03 { margin: 40px 0 0; font-size: 20px; line-height: 1.65; } }

@media screen and (max-width: 768px) { .cta .cta-bg { padding: 1rem 0 1.4rem; background: url(../../images/jp/common/cta_bg01_sp.jpg) no-repeat center/cover; }
  .cta .cta-ttl { font-size: .38rem; letter-spacing: .06em; line-height: 1.7; text-align: center; }
  .cta .cta-block { margin: .71rem 0 0; }
  .cta .cta-block .btn { display: flex; justify-content: center; align-self: center; background: #fff; width: 6rem; height: 1.4rem; margin: auto; position: relative; border-radius: .1rem; color: #282828; font-size: .32rem; letter-spacing: .06em; line-height: 1; }
  .cta .cta-block .btn .txt { display: flex; align-self: center; text-align: center; }
  .cta .cta-block .btn.btn01 .icon { width: 1.37rem; position: absolute; top: -.45rem; left: -.28rem; }
  .cta .cta-block .btn.btn02 { margin: .4rem auto 0; background-image: linear-gradient(-50deg, #902e2b 0%, #b02c3c 64%, #be2b4b 100%); }
  .cta .cta-block .btn.btn03 { margin: .4rem auto 0; font-size: .28rem; line-height: 1.65; } }