/*  .x-about
================================================== */
.x-about { position: relative; padding: 43px 0 51px; }

.x-about:after { position: absolute; bottom: 0; left: 0; width: 60px; height: 330px; content: ''; background: url(../img/x-guide/bg_about01.png) no-repeat center/contain; z-index: -1; }

.x-about__area-txt { position: relative; padding: 27px 25px 186px; background: url(../img/x-guide/bg_about03_sp.jpg) no-repeat center/cover; }

.x-about__area-txt:after { position: absolute; bottom: 18px; right: 10px; width: 230px; height: 160px; content: ''; background: url(../img/x-guide/bg_about02.png) no-repeat center/contain; }

.x-about__area-img { position: relative; margin-top: -164px; padding: 0 25px; z-index: 1; }

.x-about-head { position: relative; margin-bottom: 14px; font-size: 2.5rem; text-align: center; font-weight: 500; }

.x-about-head__main { font-size: 3rem; background: -webkit-gradient(linear, left top, left bottom, color-stop(70%, transparent), color-stop(70%, #d2d8e2), color-stop(90%, #d2d8e2), color-stop(90%, transparent)); background: linear-gradient(transparent 70%, #d2d8e2 70%, #d2d8e2 90%, transparent 90%); line-height: 1.2; font-weight: 500; }

.x-about-head__main-small { font-size: 2rem; line-height: 1.5; }

.x-about__txt { position: relative; line-height: 1.8; }

@media screen and (min-width: 600px) { .x-about { position: relative; padding: 120px 0 115px; }
  .x-about:after { content: none; }
  .x-about__area-txt { left: 9%; width: 89%; margin: 0 0 0 auto; padding: 119px 109px 242px 422px; box-sizing: border-box; background: url(../img/x-guide/bg_about03_pc.jpg) no-repeat center/cover; }
  .x-about__area-txt:after { bottom: 112px; right: 13px; width: 460px; height: 328px; }
  .x-about__area-img { position: relative; margin: -681px 0 0 -139px; padding: 0; }
  .x-about-head { margin-bottom: 25px; font-size: 4.5rem; text-align: left; letter-spacing: 0.1em; }
  .x-about-head__main { font-size: 5.6rem; background: -webkit-gradient(linear, left top, left bottom, color-stop(70%, transparent), color-stop(70%, #d2d8e2), color-stop(90%, #d2d8e2), color-stop(90%, transparent)); background: linear-gradient(transparent 70%, #d2d8e2 70%, #d2d8e2 90%, transparent 90%); line-height: 1.5; }
  .x-about-head__main-small { font-size: 4rem; line-height: 2; }
  .x-about__txt { font-size: 1.8rem; line-height: 2; } }

/*  .x-movie
================================================== */
.x-movie { padding-bottom: 50px; }

.x-movie__slider { margin-bottom: 27px; height: 112px; background: url(../img/x-guide/pic_slide01.jpg) 0 0/1030px repeat-x; -webkit-animation: bgLoopSp 50000ms linear infinite; animation: bgLoopSp 50000ms linear infinite; }

.x-movie .x-movie__area-movie { position: relative; width: 100%; padding-top: 56.25%; }

.x-movie .x-movie__area-movie iframe { position: absolute; top: 0; right: 0; width: 100% !important; height: 100% !important; }

@media screen and (min-width: 600px) { .x-movie { padding-bottom: 100px; }
  .x-movie__slider { margin-bottom: 80px; height: 224px; background-size: 2059px; -webkit-animation: bgLoopPc 60000ms linear infinite; animation: bgLoopPc 60000ms linear infinite; }
  .x-movie-box__area-txt { padding: 37px 130px 48px; } }

@-webkit-keyframes bgLoopSp { 0% { background-position: 0 50%; }
  100% { background-position: -1030px 50%; } }

@keyframes bgLoopSp { 0% { background-position: 0 50%; }
  100% { background-position: -1030px 50%; } }

@-webkit-keyframes bgLoopPc { 0% { background-position: 0 50%; }
  100% { background-position: -2059px 50%; } }

@keyframes bgLoopPc { 0% { background-position: 0 50%; }
  100% { background-position: -2059px 50%; } }

/*  .x-price
================================================== */
.x-price { padding: 51px 0 0; }

.x-price__inner { padding: 0; }

@media screen and (min-width: 600px) { .x-price { padding: 102px 0; }
  .x-price__inner { width: 100%; max-width: 1260px; } }

/*  .x-advantage
================================================== */
.x-advantage { padding: 43px 0 50px; background: #f6f6f6; }

.x-advantage-list { position: relative; margin: 54px 0 59px; }

.x-advantage-list:before { position: absolute; bottom: -38px; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); content: ''; width: 0; height: 0; border-style: solid; border-width: 19px 53.5px 0 53.5px; border-color: #d2a971 transparent transparent transparent; }

.x-advantage-list__item { position: relative; padding: 37px 15px 22px; background: #fff; box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.16); }

.x-advantage-list__item:before { position: absolute; top: -29px; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); width: 60px; height: 60px; content: ''; }

.x-advantage-list__item.is-01:before { background: url(../img/x-guide/ico_advantage01.png) no-repeat center/contain; }

.x-advantage-list__item.is-02:before { background: url(../img/x-guide/ico_advantage02.png) no-repeat center/contain; }

.x-advantage-list__item.is-03:before { background: url(../img/x-guide/ico_advantage03.png) no-repeat center/contain; }

.x-advantage-list__item.is-04:before { background: url(../img/x-guide/ico_advantage04.png) no-repeat center/contain; }

.x-advantage-list__item + .x-advantage-list__item { margin-top: 40px; }

.x-advantage-list__area-txt { text-align: center; line-height: 1.7; }

.x-advantage-list__txt { font-weight: 500; letter-spacing: 0.1em; }

.x-advantage-list__txt-large { font-size: 1.8rem; line-height: 1.5; font-weight: inherit; }

.x-advantage-list__txt-large span { font-weight: inherit; }

.x-advantage-list__txt-note { font-size: 1.2rem; color: #999; line-height: 2; }

.x-advantage-list__note { margin-top: 7px; font-size: 1.2rem; color: #999; letter-spacing: 0.08em; }

@media screen and (min-width: 600px) { .x-advantage { padding: 94px 0 99px; }
  .x-advantage-list { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: 80px 0 105px; }
  .x-advantage-list:before { bottom: -54px; border-width: 30px 84.5px 0 84.5px; }
  .x-advantage-list__item { width: 48%; padding: 88px 15px 38px; box-shadow: 2.571px 3.064px 8px 0px rgba(0, 0, 0, 0.15); box-sizing: border-box; }
  .x-advantage-list__item:before { top: -43px; width: 116px; height: 116px; }
  .x-advantage-list__item + .x-advantage-list__item { margin-top: 0; }
  .x-advantage-list__item:nth-child(n + 3) { margin-top: 69px; }
  .x-advantage-list__area-txt { line-height: 1.9; }
  .x-advantage-list__txt { font-size: 2rem; }
  .x-advantage-list__txt-large { font-size: 3rem; line-height: 1.5; }
  .x-advantage-list__txt-note { color: #999; line-height: 2.5; }
  .x-advantage-list__note { margin-top: 18px; font-size: 1.3rem; } }

/*  .x-advantage-sec
================================================== */
.x-advantage-sec { margin: 0 -15px; }

.x-advantage-sec + .x-advantage-sec { margin-top: 30px; }

.x-advantage-sec__area-txt { position: relative; margin-top: -34px; padding: 44px 15px 25px; background: rgba(255, 255, 255, 0.9); overflow: hidden; }

.x-advantage-sec__area-txt:before { position: absolute; top: -10px; right: -82px; width: 100px; height: 100px; content: ''; -webkit-transform: skew(28deg); -ms-transform: skew(28deg); transform: skew(28deg); background: rgba(4, 45, 113, 0.05); }

.x-advantage-sec__area-txt:after { position: absolute; bottom: -10px; left: -58px; width: 100px; height: 150px; content: ''; -webkit-transform: skew(28deg); -ms-transform: skew(28deg); transform: skew(28deg); background: rgba(4, 45, 113, 0.05); }

.x-advantage-sec__area-img { padding-right: 15px; }

.x-advantage-sec-head { margin-bottom: 11px; }

.x-advantage-sec-head__main { position: relative; font-size: 2.1rem; line-height: 1.5; z-index: 1; }

.x-advantage-sec-head__sub { position: absolute; top: -10px; left: 2px; color: #e5e9f0; font-size: 6rem; letter-spacing: 0.05em; }

.x-advantage-sec__txt { line-height: 1.8; }

.x-advantage-sec__txt-blue { font-weight: 500; }

.x-advantage-sec.is-reverse .x-advantage-sec__area-img { padding-left: 15px; padding-right: 0; }

@media screen and (min-width: 600px) { .x-advantage-sec { margin: 0; }
  .x-advantage-sec + .x-advantage-sec { margin-top: 80px; }
  .x-advantage-sec__box { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; }
  .x-advantage-sec__area-txt { max-width: 69%; -ms-flex-preferred-size: 69%; flex-basis: 69%; margin: 56px -101px 0 -240px; padding: 83px 80px 52px; box-sizing: border-box; }
  .x-advantage-sec__area-txt:before { top: -10px; right: -167px; width: 200px; height: 200px; -webkit-transform: skew(24deg); -ms-transform: skew(24deg); transform: skew(24deg); }
  .x-advantage-sec__area-txt:after { bottom: -10px; left: -134px; width: 200px; height: 300px; -webkit-transform: skew(23deg); -ms-transform: skew(23deg); transform: skew(23deg); }
  .x-advantage-sec__area-img { -ms-flex-preferred-size: 100%; flex-basis: 100%; max-width: 100%; margin-left: -401px; padding-right: 0; }
  .x-advantage-sec-head { margin-bottom: 32px; }
  .x-advantage-sec-head__main { font-size: 3.4rem; }
  .x-advantage-sec-head__sub { top: 2px; left: 51px; font-size: 8rem; }
  .x-advantage-sec__txt { font-size: 1.5rem; line-height: 2; }
  .x-advantage-sec.is-reverse .x-advantage-sec__area-img { margin: 0 -511px 0 78px; -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; }
  .x-advantage-sec.is-reverse .x-advantage-sec__area-txt { margin: 56px -196px 0 -72px; } }

/*  .x-differences
================================================== */
.x-differences { padding: 42px 0; }

.x-differences__area-img { margin: 0 -5px 30px; }

@media screen and (min-width: 600px) { .x-differences { padding: 95px 0 107px; }
  .x-differences__area-img { margin: 0 0 83px; } }

/*  .x-navigate
================================================== */
.x-navigate { padding: 43px 0 50px; background: #f6f6f6; }

.x-navigate-movie { position: relative; width: 100%; margin: 15px 0 30px; padding-top: 56.25%; }

.x-navigate-movie iframe { position: absolute; top: 0; right: 0; width: 100%; height: 100%; }

@media screen and (min-width: 600px) { .x-navigate { padding: 93px 0 93px; }
  .x-navigate-movie { max-width: 835px; margin: 32px auto 78px; } }

/*  .x-simulation
================================================== */
.x-simulation { padding: 50px 0 50px; }

.x-simulation__lead { margin-bottom: 20px; font-size: 1.3rem; padding: 0 28px; }

@media screen and (min-width: 600px) { .x-simulation { padding: 100px 0; }
  .x-simulation__lead { margin-bottom: 63px; font-size: 1.6rem; padding: 0; text-align: center; } }

/*  .x-flow
================================================== */
.x-flow { padding: 45px 0 48px; background: #f6f6f6; }

.x-flow-list__item { border: 1px solid #eee; box-shadow: 2px 2px 4px 0px rgba(0, 0, 0, 0.16); background: #fff; }

.x-flow-list__item + .x-flow-list__item { position: relative; margin-top: 38px; }

.x-flow-list__item + .x-flow-list__item:before { position: absolute; top: -30px; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); width: 0; height: 0; border-style: solid; border-width: 15px 42.5px 0 42.5px; border-color: #d2aa71 transparent transparent transparent; content: ''; }

.x-flow-list__area-txt { padding: 15px 22px 20px; }

.x-flow-list__area-img { margin: -1px; }

.x-flow-list-head { margin-bottom: 10px; text-align: center; }

.x-flow-list-head__step { padding: 2px 14px; font-size: 1rem; color: #fff; background-color: #042d71; }

.x-flow-list-head__main { font-size: 1.7rem; letter-spacing: 0.1em; font-weight: 500; line-height: 1.6; }

.x-flow-list__txt { font-size: 1.3rem; }

@media screen and (min-width: 600px) { .x-flow { padding: 97px 0 97px; }
  .x-flow-list__item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; box-shadow: 2.571px 3.064px 8px 0px rgba(0, 0, 0, 0.15); }
  .x-flow-list__item + .x-flow-list__item { margin-top: 58px; }
  .x-flow-list__item + .x-flow-list__item:before { top: -41px; border-width: 20px 56.5px 0 56.5px; }
  .x-flow-list__area-txt { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; padding: 20px 80px; }
  .x-flow-list__area-img { width: 39%; }
  .x-flow-list-head { margin-bottom: 14px; text-align: center; }
  .x-flow-list-head__step { padding: 3px 27px; font-size: 1.5rem; }
  .x-flow-list-head__main { margin-top: 8px; font-size: 2.8rem; }
  .x-flow-list__txt { font-size: 1.6rem; } }

/*  .x-satisfy
================================================== */
.x-satisfy { position: relative; padding-bottom: 380px; }

.x-satisfy:before { position: absolute; bottom: 0; left: 0; width: 100%; height: 380px; content: ''; background: url(../img/x-guide/bg_satisfy02.jpg) no-repeat center/cover; }

.x-satisfy__area-txt { padding: 74px 36px 26px; margin: 0 -15px; color: #fff; background: url(../img/x-guide/bg_satisfy01_sp.jpg) no-repeat center/cover; }

.x-satisfy-head { margin-bottom: 13px; font-size: 2.6rem; letter-spacing: 0.1em; line-height: 1.5; }

.x-satisfy-head__small { font-size: 1.9rem; }

@media screen and (min-width: 600px) { .x-satisfy { position: relative; padding: 125px 0 93px; background: url(../img/x-guide/bg_satisfy01_pc.jpg) no-repeat center/cover; }
  .x-satisfy:before { content: none; }
  .x-satisfy__area-txt { max-width: 541px; padding: 0; margin: 0; background: none; }
  .x-satisfy-head { margin-bottom: 39px; font-size: 4.5rem; line-height: 1.5; }
  .x-satisfy-head__small { font-size: 3.2rem; }
  .x-satisfy__txt + .x-satisfy__txt { margin-top: 32px; } }

/*  .x-msg
================================================== */
.x-msg { padding: 42px 0 10px; }

.x-msg__box { padding: 17px 23px 18px; background: #e7f3f4; }

.x-msg__txt { font-size: 1.2rem; }

@media screen and (min-width: 600px) { .x-msg { padding: 91px 0 10px; }
  .x-msg__box { padding: 24px 30px; }
  .x-msg__txt { font-size: 1.3rem; } }

/*  .x-links
================================================== */
.x-links { position: relative; padding: 5px 0 50px; }

.x-links:before { position: absolute; bottom: 0; left: 0; width: 100%; height: 86%; content: ''; background: #d5ae78; }

.x-links-list { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; }

.x-links-list__item { position: relative; width: 49%; }

.x-links-list__item:nth-child(n + 3) { margin-top: 10px; }

.x-links-list__link { display: block; }

@media screen and (min-width: 600px) { .x-links { padding: 40px 0 69px; }
  .x-links:before { height: 66%; }
  .x-links-list { display: -webkit-box; display: -ms-flexbox; display: flex; }
  .x-links-list__item { width: 24%; }
  .x-links-list__item:nth-child(n + 3) { margin-top: 0; }
  .x-links-list__link { -webkit-transition: all 0.3s ease; transition: all 0.3s ease; }
  .x-links-list__link:hover { opacity: 0.7; } }
