@charset "utf-8";

/*============================================================
base
============================================================*/

body { padding-top: 10.78125vw; /* 138px */ }

a[href^="tel:"] { pointer-events: none !important; }

.pc { display: block; }
br.pc,span.pc { display: inline; }
.mb { display: none; }

/*============================================================
main
============================================================*/

.global-main { min-height: 0; }

/* btn-effect ***********************************************/

a:link.btn-service,
a:visited.btn-service {
  background-color: #9f4c55;
  transition: background-color .3s linear 0s;
}

a:hover.btn-service,
a:active.btn-service {
  background-color: #bc8288;
}

/* area-topicpath *******************************************/

.area-topicpath {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  height: 3.125vw; /* 40px */
  margin-bottom: -3.125vw; /* -40px */
}

.area-topicpath ul {
  position: relative;
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  width: 46.875vw; /* 600px */
  height: 3.125vw; /* 40px */
  padding-right: 5.078125vw; /* 65px */
  background-color: #fff;
  font-size: 1.015625vw; /* 13px */
  letter-spacing: .12em;
  color: #192c43;
  padding-left: 1.171875vw; /* 15px */
}

.area-topicpath a { color: #192c43; }

.area-topicpath a:link,
.area-topicpath a:visited {
  opacity: 1;
  transition: opacity .3s linear 0s;
}

.area-topicpath a:hover,
.area-topicpath a:active {
  opacity: .5;
}

.area-topicpath li + li::before {
  content: "＞";
  margin: 0 0.78125vw; /* 10px */
}

.area-topicpath ul::before {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  right: 100%;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 3.125vw 3.125vw 0; /* 40px 40px */
  border-color: transparent #fff transparent transparent;
}

.area-topicpath li {
  white-space: nowrap;
}

.area-topicpath li.ell {
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: normal;
}

/* area-pagetitle *******************************************/

.area-pagetitle {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  height: 17.1875vw; /* 220px */
  background : -moz-linear-gradient(10deg,rgba(243, 244, 246, 1) 0%,rgba(234, 236, 239, 1) 19.91%,rgba(210, 214, 219, 1) 52.38%,rgba(170, 178, 186, 1) 93.15%,rgba(163, 171, 180, 1) 100%);
  background : -webkit-linear-gradient(10deg, rgba(243, 244, 246, 1) 0%, rgba(234, 236, 239, 1) 19.91%, rgba(210, 214, 219, 1) 52.38%, rgba(170, 178, 186, 1) 93.15%, rgba(163, 171, 180, 1) 100%);
  background : linear-gradient(80deg, rgba(243, 244, 246, 1) 0%, rgba(234, 236, 239, 1) 19.91%, rgba(210, 214, 219, 1) 52.38%, rgba(170, 178, 186, 1) 93.15%, rgba(163, 171, 180, 1) 100%);
}

.area-pagetitle h1 {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  color: #192c43;
}

.area-pagetitle h1 img {
  height: 9.0625vw; /* 116px */
  width: auto;
}

.area-pagetitle h1 span {
  display: inline-block;
  margin-top: .5em;
  margin-left: 1.5625vw; /* 20px */
  font-size: 1.40625vw; /* 18px */
  font-weight: 700;
  letter-spacing: .2em;
  white-space: nowrap;
}

#trial .area-pagetitle,
#repair .area-pagetitle {
  height: 26.5625vw; /* 340px */
  background: transparent;
  background-size: cover;
}

#trial .area-pagetitle { background-image: url( ../img/ttl-trial-bg.jpg ); }
#repair .area-pagetitle { background-image: url( ../img/ttl-repair-bg.jpg ); }

#trial .area-pagetitle h1,
#repair .area-pagetitle h1 { color: #fff; }

/* area-contact *********************************************/

.area-contact {
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  min-height: 26.5625vw; /* 340px */
  height: 26.5625vw; /* 340px */
  padding-top: 5.859375vw; /* 75px */
  background-color: #9f4c55;
}

.area-contact > p {
  display: inline-block;
  position: relative;
  width: 65.625vw; /* 840px */
  margin: 0 auto;
  text-align: center;
  white-space: nowrap;
}

.area-contact > p::before {
  content: '';
  display: inline-block;
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 0.390625vw; /* 5px */
  background-color: #b27077;
}

.area-contact > p > span {
  position: relative;
  display: inline-block;
  height: 2.03125vw; /* 26px */
  margin: 0 auto;
  font-size: 2.03125vw; /* 26px */
  font-weight: 700;
  letter-spacing: .1em;
  color: #fff;
}

.area-contact a.btn-contact {
  height: 6.25vw; /* 80px */
  width: 36.71875vw; /* 470px */
  margin: 0 auto;
  margin-top: 2.890625vw; /* 37px */
  background-color: #fff;
  color: #192c43;
}

.area-contact a:link.btn-contact,
.area-contact a:visited.btn-contact {
  opacity: 1;
  transition: opacity .3s linear 0s;
}

.area-contact a:hover.btn-contact,
.area-contact a:active.btn-contact {
  opacity: .5;
}

.area-contact a.btn-contact > span {
  font-size: 2.03125vw; /* 26px */
  font-weight: 700;
  letter-spacing: .13em;
}

#home .area-contact {
  background-color: transparent;
  min-height: 25vw; /* 320px */
  height: 25vw; /* 320px */
  padding-top: 4.296875vw; /* 55px */
}

/* box-mov ***************************************************/

.box-mov {
  position: relative;
  width: 62.5vw; /* 800px */
  height: 35.15625vw; /* 450px */
  margin: 0 auto;
  background-color: #444;
}

.box-mov > iframe {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* ttl-section **********************************************/

.ttl-section,
.ttl-section img {
  height: 5.3125vw; /* 68px */
  width: auto;
}

/*============================================================
news
============================================================*/

.area-news {
  width: 58.59375vw; /* 750px */
  margin: 0 auto;
  padding-top: 7.8125vw; /* 100px */ 
  padding-bottom: 10.9375vw; /* 140px */
}

/* list */

.list-news li {
  font-size: 1.5625vw; /* 20px */
  font-weight: 700;
  line-height: 1.25;
  margin-bottom: 3.125vw; /* 40px */
  padding-bottom: 2.34375vw; /* 30px */
  border-bottom: 1px solid #808080;
}

.list-news li .date {
  display: block;
  margin-bottom: 0.78125vw; /* 10px */
  font-size: 1.09375vw; /* 14px */
  font-weight: 400;
  font-style: italic;
  letter-spacing: .1em;
}

.wp-pagenavi {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding-top: 1.5625vw; /* 20px */
}

.wp-pagenavi > span,
.wp-pagenavi > a {
  display : -webkit-inline-box;
  display : -webkit-inline-flex;
  display : inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  height: 4.0625vw; /* 52px */
  min-width: 1em;
  margin: 0 0.9375vw;
  font-size: 1.71875vw; /* 22px */
}

.wp-pagenavi > span:not(.extend),
.wp-pagenavi > a {
  transform: skewX(-20deg);
  min-width: 4.0625vw; /* 52px */
  padding: 0 .75em;
  background-color: #192c43;
  color: #fff;
}

.wp-pagenavi > span:not(.extend) > span,
.wp-pagenavi > a > span { transform: skewX(20deg); }

.wp-pagenavi > a:link,
.wp-pagenavi > a:visited {
  opacity: 1;
  transition: opacity .3s linear 0s;
}

.wp-pagenavi > a:hover,
.wp-pagenavi > a:active {
  opacity: .5;
}

/* single */

.area-ttl { margin-bottom: 3.90625vw; /* 50px */ }

.area-ttl .date {
  margin-bottom: 1.875vw; /* 24px */
  font-size: 1.40625vw; /* 18px */
  font-weight: 400;
  font-style: italic;
  letter-spacing: .1em;
}

.area-ttl h1 {
  font-size: 2.65625vw; /* 34px */
  font-weight: 700;
  line-height: 1.25;
}

.area-content {
  font-size: 1.25vw; /* 16px */
  line-height: 2.65625vw; /* 34px */
  text-align: justify;
  text-justify: inter-character;
}

.area-content img.size-full {
  width: 100%;
  height: auto;
}

.area-content > p,
.area-content > div { clear: both; }

.area-content:after,
.area-content > p:after,
.area-content > div:after {content:'';display:block;clear:both;}

.area-content > p + p,
.area-content > p + div,
.area-content > div + div,
.area-content > div + p { margin-top: 1.5em; }

.area-content em { font-style: italic; }

.area-content a:link,
.area-content a:visited { text-decoration: underline; }
.area-content a:hover,
.area-content a:active { text-decoration: none; }

.wp-caption-text { clear: both; }

.area-content .alignnone,
.area-content img.alignnone {
  clear: both;
  float: none;
}

.area-content .alignleft,
.area-content img.alignleft {
  clear: both;
  float: left;
}

.area-content .alignright,
.area-content img.alignright {
  clear: both;
  float: right;
}

.area-content .aligncenter,
.area-content img.aligncenter {
  clear: both;
  display: block;
  margin-right: auto;
  margin-left: auto;
}

.wp-caption {
  clear: both;
  line-height: 1.25;
}

/*============================================================
contact
============================================================*/

.area-step {
  width: 75vw; /* 960px */
  margin: 0 auto;
  margin-top: 7.8125vw; /* 100px */
}

.area-step ul {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.area-step li {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
  font-size: 1.25vw; /* 16px */
  font-weight: 700;
  color: #8c95a1;
}

.area-step li + li { margin-left: 5.15625vw; /* 66px */ }

.area-step li > span {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 4.0625vw; /* 52px */
  height: 4.0625vw; /* 52px */
  border: 0.15625vw solid #8c95a1; /* 2px */
  background-color: #fff;
  color: #8c95a1;
  font-size: 1.71875vw; /* 22px */
  font-weight: 400;
}

.area-step li.selected { color: #192c43; }

.area-step li.selected > span {
  border-color: #192c43;
  background-color: #192c43;
  color: #fff;
}

.area-msg {
  width: 75vw; /* 960px */
  margin: 0 auto;
  margin-top: 5.46875vw; /* 70px */
}

.area-msg p {
  font-size: 1.25vw; /* 16px */
  line-height: 2.34375vw; /* 30px */
}

.area-form {
  width: 75vw; /* 960px */
  margin: 0 auto;
  margin-top: 3.515625vw; /* 45px */
  padding-bottom: 10.9375vw; /* 140px */
}

.list-input { position: relative; }

.list-input dt {
  position: absolute;
  left: 0;
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 14.84375vw; /* 190px */
  height: 3.90625vw; /* 50px */
  padding-right: 0.9375vw; /* 12px */
}

.list-input dt > label {
  font-size: 1.25vw; /* 16px */
  font-weight: 700;
}

.list-input dt > span {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 2.734375vw; /* 35px */
  height: 1.5625vw; /* 20px */
  border-radius: 0.78125vw; /* 10px */
  background-color: #808080;
  font-size: 0.9375vw; /* 12px */
  color: #fff;
}

.list-input dt > span.reg { background-color: #ff934f; }

.list-input dd {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-bottom: 2.03125vw; /* 26px */
  margin-left: 14.84375vw; /* 190px */
  min-height: 3.90625vw; /* 50px */
}

.list-input dd ul {
  height: 3.90625vw; /* 50px */
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.list-input dd ul li + li { margin-left: 2.34375vw; /* 30px */}

.list-input dd ul li a:link,
.list-input dd ul li a:visited { text-decoration: underline; }

.list-input dd label.error {
  min-width: 100%;
  margin-top: .5em;
  color: red;
}

.box-conf {
  border: 1px solid #e8eaec;
  padding: 2.734375vw  3.90625vw 1.5vw 3.90625vw; /* 35px 50px */
}

.list-conf {
  position: relative;
  line-height: 1.75;
}

.list-conf dt {
  position: absolute;
  left: 0;
  width: 16.40625vw; /* 210px */
  padding-right: 0.9375vw; /* 12px */
  font-size: 1.25vw; /* 16px */
  font-weight: 700;
}

.list-conf dd {
  margin-left:16.40625vw; /* 210px */
  margin-bottom: 1.5em;
}

.list-conf dd .error { color: red; }

.area-comp { padding: 7.8125vw 0 10.9375vw 0; /* 100px 0 140px 0 */ }

.area-compmsg { padding-bottom: 7.8125vw; }

.area-comp p {
  text-align: center;
  font-size: 1.25vw; /* 16px */
}

.area-comp p.msg {
  margin-bottom: 3.515625vw; /* 45px */
  font-size: 2.65625vw; /* 34px */
  font-weight: 700;
  color: #192c43;
}

input[type="checkbox"] + label::before,
input[type="radio"] + label::before {
  width: 1.5625vw; /* 20px */
  height: 1.5625vw; /* 20px */
  background-size: 3.125vw 3.125vw; /* 40px 40px */
  margin-right: 0.46875vw; /* 6px */
}
input[type="checkbox"] + label::before { background-position: 0 0; }
input[type="radio"] + label::before { background-position: 0 -1.5625vw; }
input[type="checkbox"]:checked + label::before { background-position: -1.5625vw 0; }
input[type="radio"]:checked + label::before { background-position: -1.5625vw -1.5625vw; }

input[type="text"],
input[type="email"],
input[type="tel"],
textarea {
  width: 100%;
  min-height: 3.90625vw; /* 50px */
  padding: 0 1.5625vw; /* 20px */
  background-color: #e8eaec;
  font-size: 1.25vw; /* 16px */
}

textarea {
  min-height: 20.625vw; /* 264px */
  padding: .75em 1.5625vw; /* 20px */
  line-height: 1.5;
}

input[type="text"]#zip {
  padding-left: 3.125vw; /* 40px */
  background-image: url( ../img/icon-zip.svg );
  background-size: 1.5625vw 1.5625vw; /* 20px 20pa */
  background-position: 1vw 50%;
}

.box-file {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 3.90625vw; /* 50px */
  padding: 0 1.5625vw; /* 20px */
  border: 1px solid #e8eaec;
}

.box-file label {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  min-width: 8.4375vw; /* 108px */
  width: 8.4375vw; /* 108px */
  height: 2.03125vw; /* 26px */
  background-color: #192c43;
  text-align: center;
  font-size: 1.09375vw; /* 14px */
  color: #fff;
}

.box-file span {
  display: block;
  margin-left: 1.5625vw; /* 20px */
  font-size: 1.09375vw; /* 14px */
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: normal;
}

.box-file + p.msg {
  margin-top: .75em;
  font-size: 1.09375vw; /* 14px */
  color: #555;
}

.box-btn {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-top: 4.6875vw; /* 60px */
}

.box-btn .btn-skew {
  min-width: 21.875vw; /* 280px */
  height: 4.0625vw; /* 52px */
  margin: 0 1.171875vw; /* 0 15px */
}

.box-btn button { letter-spacing: 1em; }

.box-btn .btn-primary { background-color: #192c43; }
.box-btn .btn-secondary { background-color: #a3abb4; }

.box-btn a:link,
.box-btn a:visited,
.box-btn button {
  opacity: 1;
  transition: opacity .3s linear 0s;
}

.box-btn a:hover,
.box-btn a:active,
.box-btn button:hover {
  opacity: .5;
}

/*============================================================
privacy
============================================================*/

.area-privacy {
  width: 75vw; /* 960px */
  margin: 0 auto;
  padding-top: 5.859375vw; /* 75px */
  padding-bottom: 10.9375vw; /* 140px */
}

.area-privacy > p {
  font-size: 1.25vw; /* 16px */
  line-height: 2.65625vw; /* 34px */
  text-align: justify;
  text-justify: inter-character;
}

.area-privacy > p.lbl {
  margin-top: 1.5em;
  margin-bottom: .75em;
  font-size: 2.1875vw; /* 28px */
  font-weight: 700;
  line-height: 4.21875vw; /* 54px */
}

.area-privacy a:link,
.area-privacy a:visited {
  text-decoration: underline;
}

.area-privacy a:hover,
.area-privacy a:active {
  text-decoration: none;
}

/*============================================================
sitemap
============================================================*/

.area-sitemap {
  width: 58.59375vw; /* 750px */
  margin: 0 auto;
  padding-top: 9.375vw; /* 120px */
  padding-bottom: 10.9375vw; /* 140px */
}

.area-sitemap ul {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-top: -4.21875vw; /* 54px */
}

.area-sitemap li {
  width: 28.125vw; /* 360px */
  height: 3.90625vw; /* 50px */
  margin-top: 4.21875vw; /* 54px */
}

.area-sitemap li a {
  display: block;
  width: 28.125vw; /* 360px */
  height: 3.90625vw; /* 50px */
  padding-left: 1.5625vw; /* 20px */
  font-size: 1.71875vw; /* 22px */
  font-weight: 700;
  color: #192c43;
  background-image: url( ../img/line-sitemap.svg );
  background-size: 28.125vw 3.90625vw;
}

.area-sitemap li a:link,
.area-sitemap li a:visited {
  opacity: 1;
  transition: opacity .3s linear 0s;
}

.area-sitemap li a:hover,
.area-sitemap li a:active {
  opacity: .5;
}

/*============================================================
company
============================================================*/

#company .global-main { background-color: #e3e6e8; }

.area-message {
  position: relative;
  padding-top: 5.859375vw; /* 75px */
  padding-bottom: 9.765625vw; /* 125px */
  margin-bottom: 4.6875vw; /* 60px */
  background-color: #fff;
}

.area-message::after {
  content: '';
  display: block;
  width: 100%;
  height: 4.6875vw; /* 60px */
  background-size: 100vw 4.6875vw; /* 1280px 60px */
  position: absolute;
  top: auto;
  bottom: -4.6875vw; /* -60px */
  left: 0;
  background-image: url( ../img/bar-right.svg );
  background-position: 42.96875vw 0; /* 550px 0 */
}

.area-message > div {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  width: 75vw; /* 960px */
  margin: 0 auto;
  margin-top: 5.859375vw; /* 75px */
}

.area-message > div > div {
  min-width: 45.3125vw; /* 580px */
  width: 45.3125vw; /* 580px */
}

.area-message .ttl {
  margin-top: -0.9375vw; /* 12px */
  margin-bottom: -0.9375vw; /* 12px */
  font-size: 3.28125vw; /* 42px */
  font-weight: 700;
  line-height: 5.15625vw; /* 66px */
  letter-spacing: .045em;
  color: #192c43;
}

.area-message .bdy {
  margin-top: 2.34375vw; /* 30px */
  margin-bottom: -0.703125vw; /* 9px */
  font-size: 1.25vw; /* 16px */
  line-height: 2.65625vw; /* 34px */
  text-align: justify;
  text-justify: inter-character;
}

.area-message .sig {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  margin-left: auto;
  margin-right: 0;
  margin-top: 2.734375vw; /* 35px */
}

.area-message .sig > span {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  text-align: right;
  font-size: 1.171875vw; /* 15px */
  line-height: 1.796875vw; /* 23px */
}

.area-message .sig img {
  margin-left: 2.34375vw; /* 30px */
  width: 15.46875vw; /* 198px */
  height: 3.125vw; /* 40px */
}

.area-message > div > img {
  width: 24.21875vw; /* 310px */
  height: 33.203125vw; /* 425px */
}

.area-aboutus {
  padding-top: 2.5vw; /* 32px */
  padding-bottom: 10.9375vw; /* 140px */
}

.area-aboutus dl {
  position: relative;
  width: 75vw; /* 960px */
  margin: 0 auto;
  margin-top: 4.0625vw; /* 52px */
}

.area-aboutus dt {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  position: absolute;
  left: 0;
  height: 6.328125vw; /* 81px */
  font-size: 1.25vw; /* 16px */
  font-weight: 700;
}

.area-aboutus dd {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  padding-left: 10.9375vw; /* 140px */
  height: 6.328125vw; /* 81px */
  border-bottom: 0.078125vw solid #8c95a1; /* 1px */
  font-size: 1.25vw; /* 16px */
}

.area-aboutus > div {
  position: relative;
  width: 75vw; /* 960px */
  height: 33.203125vw; /* 425px */
  margin: 0 auto;
  margin-top: 4.6875vw; /* 60px */
}

.area-aboutus > div iframe {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/*============================================================
trial / repair
============================================================*/

#trial .global-main,
#repair .global-main { background-color: #e3e6e8; }

.box-contact {
  position: absolute;
  top: auto;
  left: 60.9375vw; /* 780px */
  height: 4.6875vw; /* 60px */
  margin-top: -3.125vw; /* -40px */
  padding-right: 1.953125vw; /* 25px */
  z-index: 2;
  background-color: #9f4c55;
  transition: background-color .3s linear 0s;
}

.box-contact > a.btn-contact {
  position: relative;
  display : -webkit-inline-box;
  display : -webkit-inline-flex;
  display : inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  height: 3.125vw; /* 40px */
  margin-left: -1.171875vw; /* 15px */
  font-size: 1.484375vw; /* 19px */
  font-weight: 700;
  color: #fff;
}

.box-contact > a.btn-contact i {
  display: block;
  width: 3.515625vw; /* 45px */
  height: 3.125vw; /* 40px */
  background-color: #9f4c55;
  margin-right: 0.234375vw; /* 3px */
  transition: background-color .3s linear 0s;
}

.box-contact:hover,
.box-contact:hover > a.btn-contact i {
  background-color: #bc8288;
}

.box-contact > a.btn-contact i svg {
  width: 3.515625vw; /* 45px */
  height: 3.125vw; /* 40px */
  fill: #fff;
}

.area-worry {
  position: relative;
  padding-top: 7.8125vw; /* 100px */
  padding-bottom: 6.25vw; /* 80px */
  background-color: #fff;
  z-index: 1;
}

.area-worry::after {
  content: '';
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 3.125vw 2.34375vw 0 2.34375vw; /* 40px 30px 0 30px */
  border-color: #fff transparent transparent transparent;
  position: absolute;
  right: 50%;
  bottom: -3.125vw; /* -40px */
  -webkit-transform: translate(50%,0);
  transform: translate(50%,0);
  z-index: 1;
}

.area-worry > p {
  text-align: center;
  margin: -1.015625vw auto; /* 13px */
  line-height: 4.6875vw; /* 60px */
  font-size: 2.578125vw; /* 33px */
  font-weight: 700;
  letter-spacing: .18em;
  color: #192c43;
}

.area-worry > ul {
  width: 60.9375vw; /* 780px */
  margin: 0 auto;
  margin-top: 3.90625vw; /* 50px */
}

.area-worry > ul li {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  min-height: 4.6875vw; /* 60px */
  height: 4.6875vw; /* 60px */
  font-size: 1.71875vw; /* 22px */
  font-weight: 700;
  color: #fff;
  letter-spacing: .05em;
}

.area-worry > ul li::before {
  content: '';
  display: block;
  width: 2.1875vw; /* 28px */
  height: 1.5625vw; /* 20px */
  margin: 0 0.78125vw 0 1.484375vw; /* 0 10px 0 19px */
  background-image: url( ../img/icon-check.svg );
  background-size: 2.1875vw 1.5625vw; /* 28px 20px */
}

.area-worry > ul li + li { margin-top: 1.5625vw; /* 20px */ }

.area-worry > ul li:nth-child( odd ) { background-color: #192c43; }
.area-worry > ul li:nth-child( even ) { background-color: #475669; }

.area-achieve {
  padding-top: 8.59375vw; /* 110px */
  padding-bottom: 5.46875vw; /* 70px */
  background-size: cover;
}

#trial .area-achieve { background-image: url( ../img/area-achieve-bg-trial.jpg); }
#repair .area-achieve { background-image: url( ../img/area-achieve-bg-repair.jpg); }

.area-achieve > p {
  display: block;
  position: relative;
  width: 71.09375vw; /* 910px */
  margin: 0 auto;
  text-align: center;
  white-space: nowrap;
}

.area-achieve > p::before {
  content: '';
  display: inline-block;
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 0.46875vw; /* 6px */
  background-color: #b27077;
}

.area-achieve > p > span {
  position: relative;
  display: inline-block;
  height: 2.8125vw; /* 36px */
  margin: 0 auto;
  padding-bottom: 0.234375vw; /* 3px */
  font-size: 2.578125vw; /* 33px */
  font-weight: 700;
  letter-spacing: .1em;
  color: #fff;
}

.area-achieve > ul {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  width: 75vw; /* 960px */
  margin: 0 auto;
  margin-top: 3.515625vw; /* 45px */
}

.area-achieve > ul li {
  width: 36.71875vw; /* 470px */
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-top: 1.5625vw; /* 20px */
  min-height: 6.25vw; /* 80px */
  font-size: 1.71875vw; /* 22px */
  font-weight: 700;
  color: #192c43;
  letter-spacing: .05em;
}

.area-achieve > ul li { background-color: rgba(255, 255, 255, .9); }

#trial .area-achieve > ul li:nth-child( 2 ),
#trial .area-achieve > ul li:nth-child( 3 ),
#trial .area-achieve > ul li:nth-child( 6 ),
#repair .area-achieve > ul li:nth-child( 2 ),
#repair .area-achieve > ul li:nth-child( 5 ) { background-color: rgba(209, 213, 217, .9) !important; }

.area-achieve > ul li span > span { font-size: 70%; }

#repair .area-achieve > ul li:nth-child(1){
  width: 142.1875vw; /* 1820px */
}


.area-mov {
  padding-top: 3.90625vw; /* 50px */
  padding-bottom: 6.25vw; /* 80px */
}

.area-mov > p {
  padding-bottom: 1.71875vw; /* 22px */
  background-image: url( ../img/area-mov-p-bg.svg );
  background-size: 40.625vw 1.71875vw; /* 520px 22px */
  background-position: 50% 100%;
  text-align: center;
  line-height: 6.25vw; /* 80px */
  font-size: 2.578125vw; /* 33px */
  font-weight: 700;
  letter-spacing: .14em;
  color: #192c43;
}

.area-mov > .box-mov { margin-top: 2.34375vw; /* 30px */ }

.area-case {
  position: relative;
  padding-top: 6.25vw; /* 80px */
  padding-bottom: 8.59375vw; /* 110px */
  margin-top: 4.6875vw; /* 60px */
  margin-bottom: 4.6875vw; /* 60px */
  background-color: #fff;
}

.area-case::before,
.area-case::after,
.area-faq::before {
  content: '';
  display: block;
  width: 100%;
  height: 4.6875vw; /* 60px */
  background-size: 100vw 4.6875vw; /* 1280px 60px */
  position: absolute;
  top: -4.6875vw; /* -60px */
  left: 0;
  background-image: url( ../img/bar-left.svg );
  background-position: -71.875vw 0; /* -920px 0*/
}

.area-case::after {
  background-image: url( ../img/bar-right.svg );
  background-position: 71.875vw 0; /* -920px 0*/
  top: auto;
  bottom: -4.6875vw; /* -60px */
}

.box-case {
  width: 75vw; /* 960px */
  margin: 0 auto;
  margin-top: 3.125vw; /* 40px */
}

.box-case > div {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.box-case > div + div {
  margin-top: 2.34375vw; /* 30px */
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse;
}

.box-case > div img {
  min-width: 29.6875vw; /* 380px */
  width: 29.6875vw; /* 380px */
  height: 25vw; /* 320px */
}

.box-case > div div {
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  max-height: 25vw; /* 320px */
  background-color: #e3e6e8;
  padding: 0 2.734375vw; /* 40px 35px */
}

.box-case .ttl {
  margin-top: -0.625vw; /* -8px */
  font-size: 1.953125vw; /* 25px */
  font-weight: 700;
  line-height: 3.203125vw; /* 41px */
  letter-spacing: .06em;
  color: #192c43;
}

.box-case .bdy {
  margin-top: 0.703125vw; /* 9px */
  margin-bottom: -0.703125vw; /* 9px */
  font-size: 1.25vw; /* 16px */
  line-height: 2.34375vw; /* 30px */
  text-align: justify;
  text-justify: inter-character;
}

.box-voice {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 75vw; /* 960px */
  margin: 0 auto;
  margin-top: 3.125vw; /* 40px */
}

.box-voice h3 {
  width: 15vw; /* 192px */
  height: 15vw; /* 192px */
}

.box-voice ul {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  width: 56.25vw; /* 720px */
  font-size: 1.5625vw; /* 20px */
  font-weight: 700;
  letter-spacing: .04em;
  line-height: 2.65625vw; /* 34px */
}

.box-voice li {
  position: relative;
  padding: 1.40625vw 0.78125vw; /* 18px 10px */
  text-align: justify;
  text-justify: inter-character;
}

.box-voice li + li::after {
  content: '';
  display: block;
  width: 100%;
  height: 0.15625vw; /* 2px */
  position: absolute;
  right: 0;
  top: -0.078125vw; /* -1px */
  left: 0;
  background-image: url( ../img/line-dot.svg );
  background-repeat: repeat-x;
  background-size: 0.625vw 0.15625vw; /* 8px 2px */
}

.area-flow {
  padding-top: 3.125vw; /* 40px */
  padding-bottom: 6.25vw; /* 80px */
}

.box-flow {
  position: relative;
  width: 75vw; /* 960px */
  margin: 0 auto;
  margin-top: 4.6875vw; /* 60px */
  padding-top: 4.6875vw; /* 60px */
}

.box-flow::before {
  content: '';
  height: 4.6875vw; /* 60px */
  width: 83.203125vw; /* 1065px */
  position: absolute;
  top: 0;
  left: 4.296875vw; /* 55px */
  background-image: url( ../img/box-flow-bg.svg );
  background-size: 83.203125vw 4.6875vw;
}

.box-flow > div {
  width: 57.8125vw; /* 740px */
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.box-flow > div:nth-child( even ){
  width: 48.4375vw; /* 620px */
  margin-left: 26.5625vw; /* 340px */
}

.box-flow .lbl {
  position: relative;
  min-width: 8.59375vw; /* 110px */
  width: 8.59375vw; /* 110px */
  height: 8.59375vw; /* 110px */
  border: 0.078125vw solid #192c43; /* 1px */
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.box-flow .lbl img {
  width: 4.375vw; /* 56px */
  height: 4.375vw; /* 56px */
}

.box-flow .lbl::after {
  content: '';
  display: block;
  position: absolute;
  background-position: 0 100%;
}

.box-flow > div:nth-child( 1 ) {
  height: 17.1875vw; /* 220px */
}

.box-flow > div:nth-child( 1 ) .lbl::after {
  width: 22.34375vw; /* 286px */
  height: 10.46875vw; /* 134px */
  background-image: url( ../img/line-flow-step-odd.svg );
  background-size: 22.34375vw 11.5625vw; /* 148px */
  top: 100%;
  left: 50%;
}

.box-flow > div:nth-child( 2 ) {
  height: 14.6875vw; /* 188px */
}

.box-flow > div:nth-child( 2 ) .lbl::after {
  width: 26.5625vw; /* 340px */
  height: 6.25vw; /* 80px */
  background-image: url( ../img/line-flow-step-eve.svg );
  background-size: 26.5625vw 6.25vw;
  top: 100%;
  right: 50%;
}

.box-flow > div:nth-child( 3 ) {
  height: 18.203125vw; /* 233px */
}

.box-flow > div:nth-child( 3 ) .lbl::after {
  width: 22.34375vw; /* 286px */
  height: 11.5625vw; /* 148px */
  background-image: url( ../img/line-flow-step-odd.svg );
  background-size: 22.34375vw 11.5625vw;
  top: 100%;
  left: 50%;
}

.box-flow > div > div {
  min-width: 46.875vw; /* 600px */
  width: 37.5vw; /* 480px */
}

.box-flow > div:nth-child( even ) > div {
  min-width: 37.5vw; /* 480px */
}

.box-flow .ttl {
  margin-top: -0.625vw; /* -8px */
  font-size: 1.953125vw; /* 25px */
  line-height: 3.203125vw; /* 41px */
  font-weight: 700;
  color: #192c43;
}

.box-flow .bdy {
  margin-top: .25em;
  font-size: 1.25vw; /* 16px */
  line-height: 2.65625vw; /* 34px */
  text-align: justify;
  text-justify: inter-character;
}

.box-flow .link-tel {
  display: block;
  width: 16.875vw; /* 216px */
  height: 1.5625vw; /* 20px */
  margin-top: 0.78125vw; /* 10px */
}

.box-flow .link-tel img {
  width: 16.875vw; /* 216px */
  height: 1.5625vw; /* 20px */
}

.box-flow .btn-contact {
  height: 2.8125vw; /* 36px */
  margin-top: 1.171875vw; /* 15px */
  margin-left: 0.78125vw; /* 10px */
  padding: 0 1.5625vw; /* 0 20px */
  background-color: #192c43;
}

.box-flow .btn-contact:link,
.box-flow .btn-contact:visited {
  opacity: 1;
  transition: opacity .3s linear 0s;
}

.box-flow .btn-contact:hover,
.box-flow .btn-contact:active {
  opacity: .5;
}

.box-flow .box-des {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 39.84375vw; /* 510px */
  height: 8.125vw; /* 104px */
  margin-top: 1.171875vw; /* 15px */
  padding: 0 1.5625vw; /* 20px */
  background-color: #fff;
}

.box-flow .box-des .des-lbl {
  font-size: 1.5625vw; /* 20px */
  font-weight: 700;
  line-height: 2.265625vw; /* 29px */
  color: #192c43;
  padding-right: 1.25em;
  margin-right: 1.25em;
  border-right: 0.078125vw solid #8c95a1; /* 1px */
}

.box-flow .box-des .des-addr {
  font-size: 1.25vw; /* 16px */
  line-height: 1.953125vw; /* 25px */
}

.area-faq {
  position: relative;
  padding-top: 6.25vw; /* 80px */
  padding-bottom: 9.375vw; /* 120px */
  margin-top: 4.6875vw; /* 60px */
  background-color: #fff;
}

.area-faq dl {
  width: 75vw; /* 960px */
  margin: 0 auto;
}

.area-faq dt {
  position: relative;
  min-height: 3.90625vw; /* 50px */
  margin-top: 3.515625vw; /* 45px */
  padding-left: 5.15625vw; /* 66px */
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: 1.953125vw; /* 25px */
  font-weight: 700;
  color: #192c43;
}

.area-faq dt::before {
  content: '';
  display: block;
  width: 3.90625vw; /* 50px */
  height: 3.90625vw; /* 50px */
  position: absolute;
  top: 0;
  left: 0;
  background-image: url( ../img/area-faq-dt.svg );
}

.area-faq dd {
  position: relative;
  margin-top: 1em;
  padding-left: 5.15625vw; /* 66px */
  font-size: 1.25vw; /* 16px */
  line-height: 2.65625vw; /* 34px */
  text-align: justify;
  text-justify: inter-character;
}

.area-faq dd::before {
  content: '';
  display: block;
  width: 3.90625vw; /* 50px */
  height: 3.90625vw; /* 50px */
  position: absolute;
  top: 0.625vw; /* 8px */
  left: 0;
  background-image: url( ../img/area-faq-dd.svg );
}

/*============================================================
home
============================================================*/

#home {
  padding-top: 0;
  overflow: hidden;
}

#home.loaded { overflow: auto; }

#movwrap {
  position: fixed;
  right: 50%;
  bottom: 50%;
  -webkit-transform: translate( 50%, 50% );
  transform: translate( 50%, 50% );
  width: calc( 100vh * (420/119) );
  height: 100vh;
  padding-bottom: 56.25%;
  z-index: -1;
  pointer-events: none;
}

#movwrap::after {
  content: '';
  display: block;
  position: absolute;
  top: 0; right: 0; bottom: 0; left: 0;
  width: 100%;
  height: 100%;
  background-image: url( ../img/overlay.png );
  background-repeat: repeat;
  background-position: 0 0;
}

#mov {
  position: absolute;
  top: 0; right: 0; bottom: 0; left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.area-hero {
  height: 100vh;
  position: relative;
}

.box-hero {
  width: 100%;
  height: 100vh;
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.box-hero > p,
.box-hero > p img {
  width: 42.1875vw; /* 540px */
  height: 9.0625vw; /* 116px */
}

.box-hero ul {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 40.78125vw; /* 522px */
  padding: 0 0.859375vw; /* 0 11px */
  margin: 0 auto;
  margin-top: 6.640625vw; /* 85px */
}

.box-hero a.btn-service {
  width: 18.359375vw; /* 235px */
  height: 4.6875vw; /* 60px */
  font-size: 1.640625vw; /* 21px */
}

.box-news {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  position: absolute;
  bottom: 3.828125vw; /* 49px */
  left: 0;
  width: 47.8125vw; /* 612px */
  height: 4.84375vw; /* 62px */
  padding-left: 5.15625vw; /* 66px */
  background-image: url( ../img/box-news-bg.svg );
  background-size: 47.8125vw 4.84375vw;   
}

.box-news > h2,
.box-news > img {
  width: 4.84375vw; /* 62px */
  height: 1.25vw; /* 16px */
}

.box-news h2 { margin-right: 2.734375vw; /* 35px */ }

.box-news > dl {
  width: 21.09375vw; /* 270px */
  color: #fff;
}

.box-news dt {
  font-size: 0.9375vw; /* 12px */
  font-style: italic;
  letter-spacing: .1em;
}

.box-news dd {
  margin-top: .25em;
  font-size: 1.09375vw; /* 14px */
  font-weight: 700;
}

.box-news dd a {
  display: block;
  width: 21.09375vw; /* 270px */
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: normal;
  color: #fff;
}

.box-news > p {
  margin-left: auto;
  margin-right: 1.171875vw; /* 15px */
}

a:link.btn-box-news,
a:visited.btn-box-news {
  width: 10.15625vw; /* 130px */
  height: 2.65625vw; /* 34px */
  background-color: #fff;
  color: #192c43;
  opacity: 1;
  transition: opacity .3s linear 0s;
}

a:hover.btn-box-news,
a:active.btn-box-news {
  opacity: .5;
}

a.btn-box-news img {
  width: 7.03125vw; /* 90px */
  height: 0.78125vw; /* 10px */
}

.scroll,
.scroll > svg {
  width: 1.5625vw; /* 20px */
  height: 9.375vw; /* 120px */
}

.scroll {
  position: absolute;
  right: 2.734375vw; /* 35px */
  bottom: 3.90625vw; /* 50px */
}

.area-service {
  position: relative;
  padding-top: 5.9375vw; /* 76px */
  padding-bottom: 3.125vw; /* 40px */
  margin-top: 4.6875vw; /* 60px */
  margin-bottom: 4.6875vw; /* 60px */
  background-color: rgba( 255, 255, 255, .85 );
}

.area-service::before,
.area-service::after {
  content: '';
  display: block;
  width: 100%;
  height: 4.6875vw; /* 60px */
  background-size: 100vw 4.6875vw; /* 1280px 60px */
  position: absolute;
  top: -4.6875vw; /* -60px */
  left: 0;
  opacity: .85;
  background-image: url( ../img/bar-left.svg );
  background-position: -60.15625vw 0; /* -770px 0*/
}

.area-service::after {
  background-image: url( ../img/bar-right.svg );
  background-position: 9.375vw 0; /* 120px 0*/
  top: auto;
  bottom: -4.6875vw; /* -60px */
}

.area-service-inner {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.area-service div.box-first h2,
.area-service div.box-first h2 > img {
  width: 26.5625vw; /* 340px */
  height: 4.84375vw; /* 62px */
}
  
.area-service div.box-first p {
  margin-top: 5.625vw; /* 72px */
  margin-left: 12.5vw; /* 160px */
  font-size: 2.578125vw; /* 33px */
  font-weight: 700;
  line-height: 4.6875vw; /* 60px */
  letter-spacing: .18em;
  color: #192c43;
}

.area-service div.box-second {
  width: 34.375vw; /* 440px */
  margin-right: 12.5vw; /* 160px */
}

.area-service div.box-second p {
  margin-top: .5em;
  font-size: 1.25vw; /* 16px */
  line-height: 2.65625vw; /* 34px */
  text-align: justify;
  text-justify: inter-character;
}

.area-service div.box-second ul {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 33.90625vw; /* 434px */
  padding: 0 0.78125vw; /* 0 10px */
  margin-top: 3.125vw; /* 40px */
}

.area-service div.box-second a.btn-service {
  width: 15.390625vw; /* 197px */
  height: 3.59375vw; /* 46px */
  font-size: 1.25vw; /* 16px */
}

.area-service .box-mov { margin-top: 6.25vw; /* 80px */ }

/*============================================================
header
============================================================*/

.global-header,
.sub-header {
  z-index: 10;
  position: absolute;
  top: 0;
  width: 100%;
  min-height: 10.78125vw; /* 138px */
  height: 10.78125vw; /* 138px */
  padding-right: 5.078125vw; /* 65px */
  padding-left: 5.078125vw; /* 65px */
  user-select: none;
}

.sub-header {
  position: fixed;
  min-height: 7.8125vw; /* 100px */
  height: 7.8125vw; /* 100px */
  background-color: #fff;
  -webkit-transform: translateY(-105%);
  -ms-transform: translateY(-105%);
  transform: translateY(-105%);
  box-shadow: 0 0.234375vw 0 rgba(25, 44, 67, .2); /* 3px */
}

.sub-header.ac {
  -webkit-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
  transition: all .7s linear 0s;
}

.sub-header.da {
  -webkit-transform: translateY(-105%);
  -ms-transform: translateY(-105%);
  transform: translateY(-105%);
  transition: all .7s linear 0s;
}

.header-inner {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  min-height: 10.78125vw; /* 138px */
  height: 10.78125vw; /* 138px */
}

.sub-header .header-inner {
  min-height: 7.8125vw; /* 100px */
  height: 7.8125vw; /* 100px */
}

/* #home .global-header {
  position: fixed;
  mix-blend-mode: difference;
}

.ie #home .global-header {
  position: absolute;
  mix-blend-mode: normal;
} */

.header-line,
.header-line svg {
  width: 100%;
  height: 6.328125vw; /* 81px */
}

.header-line {
  position: absolute;
  top: 2.3046875vw; /* 29.5px */
  left: 0;
}

.header-logo,
.header-logo svg {
  position: relative;
  width: 15.3125vw; /* 196px */
  height: 3.046875vw; /* 39px */
}

.sub-header .header-logo,
.sub-header .header-logo svg {
  width: 13.515625vw; /* 173px */
  height: 2.65625vw; /* 34px */
}

.header-logo svg,
.header-line svg { fill: #192c43; }

.header-nav a { color: #192c43; }

#home .global-header .header-logo svg,
#home .global-header .header-line svg { fill: #fff; }
#home .global-header .header-nav a { color: #fff; }

.header-nav,
.list-header-nav {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.list-header-nav {   height: 2.34375vw; /* 30px */ }

.list-header-nav li { margin-right: 2.734375vw; /* 35px */ }

.list-header-nav a {
  position: relative;
  font-size: 1.328125vw; /* 17px */
  font-weight: 700;
}

.sub-header .list-header-nav a {
  font-size: 1.015625vw; /* 13px */
}

.list-header-nav a::after {
  content: '';
  display: block;
  width: 0.46876vw; /* 6px */
  height: 0.46876vw; /* 6px */
  border-radius: 50%;
  position: absolute;
  right: calc( 50% - 0.46876vw / 2 );
  bottom: -1.171875vw; /* -15px */
  background-color: #192c43;
  opacity: 0;
  transition: opacity .3s linear 0s;
}

#home .global-header .list-header-nav a::after { background-color: #fff; }

.list-header-nav a.selected::after,
.list-header-nav a:hover::after,
.list-header-nav a:active::after { opacity: 1; }

.global-header .skew,
.sub-header .skew {
  height: 2.34375vw; /* 30px */
  padding-right: 0.78125vw; /* 10px */
  background-color: #192c43;
  opacity: 1;
  transition: opacity .3s linear 0s;
}

.sub-header .skew { padding-left: 0.78125vw; /* 10px */ }

.global-header .skew:hover,
.sub-header .skew:hover { opacity: .5; }

#home .global-header .skew { background-color: #fff; }

.header-inner a.btn-contact {
  position: relative;
  display : -webkit-inline-box;
  display : -webkit-inline-flex;
  display : inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  height: 1.484375vw; /* 19px */
  font-size: 0.9375vw; /* 12px */
  font-weight: 700;
  color: #fff;
}

#home .global-header .header-inner a.btn-contact { color: #192c43; }

.header-inner a.btn-contact i {
  display: block;
  width: 1.71875vw; /* 22px */
  height: 1.484375vw; /* 19px */
  background-image: url( ../img/icon-btn-contact-h.svg );
  background-size: 1.71875vw 1.484375vw;
  margin-right: 0.15625vw; /* 2px */
}

.sub-header .header-inner a.btn-contact i { margin-right: 0; }

#home .global-header .header-inner a.btn-contact i {
  background-image: url( ../img/icon-btn-contact-h-wht.svg );
}

/*============================================================
footer
============================================================*/

.global-footer {
  position: relative;
  margin-top: -4.6875vw; /* -60px */
  padding-top: 4.6875vw; /* 60px */
  min-height: 25.78125vw; /* 330px */
  height: 25.78125vw; /* 330px */
  user-select: none;
}

.footer-top {
  position: absolute;
  top: 0.15625vw; /* 2px */
  right: 0;
  width: 23.4375vw; /* 300px */
  height: 4.6875vw; /* 60px */
  padding-top: 1.015625vw; /* 13px */
  background-color: #192c43;
}

.footer-top::before {
  content: '';
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 0 4.6875vw 4.6875vw; /* 0 0 60px 60px */
  border-color: transparent transparent #192c43 transparent;
  position: absolute;
  top: 0;
  right: 100%;
}

.global-footer a.btn-contact {
  position: relative;
  display : -webkit-inline-box;
  display : -webkit-inline-flex;
  display : inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  height: 3.125vw; /* 40px */
  margin-left: -2.109375vw; /* 27px */
  font-size: 1.484375vw; /* 19px */
  font-weight: 700;
  color: #fff;
}

.global-footer a.btn-contact i {
  display: block;
  width: 3.515625vw; /* 45px */
  height: 3.125vw; /* 40px */
  background-color: #192c43;
  margin-right: 0.234375vw; /* 3px */
}

.global-footer a.btn-contact i svg {
  width: 3.515625vw; /* 45px */
  height: 3.125vw; /* 40px */
  fill: #fff;
}

.global-footer a:link.btn-contact,
.global-footer a:visited.btn-contact,
.global-footer a:link.btn-contact i svg,
.global-footer a:visited.btn-contact i svg {
  color: rgba(255, 255, 255, 1);
  fill: rgba(255, 255, 255, 1);
  transition: color .3s linear 0s,fill .3s linear 0s;
}

.global-footer a:hover.btn-contact,
.global-footer a:active.btn-contact,
.global-footer a:hover.btn-contact i svg,
.global-footer a:active.btn-contact i svg {
  color: rgba(255, 255, 255, .5);
  fill: rgba(255, 255, 255, .5);
}


.footer-btm {
  position: relative;
  height: 21.09375vw; /* 270px */
  padding: 5.15625vw 7.8125vw 0 7.8125vw; /* 66px 100px 0 100px */
  background-color: #192c43;
}

.footer-inner {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.footer-logo,
.footer-logo svg {
  width: 17.96875vw; /* 230px */
  height: 3.59375vw; /* 46px */
}

.footer-logo svg { fill: #fff; }

.footer-nav { width: 37.5vw; /* 480px */ }

.footer-nav a { color: #fff; }

.footer-nav a:link,
.footer-nav a:visited {
  opacity: 1;
  transition: opacity .3s linear 0s;
}

.footer-nav a:hover,
.footer-nav a:active {
  opacity: .5;
}

.list-footer-nav {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.list-footer-nav a {
  font-size: 1.328125vw; /* 17px */
  font-weight: 700;
}

.list-footer-subnav {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  margin-top: 1.953125vw; /* 25px */
}

.list-footer-subnav li {
  margin-left: 1.953125vw; /* 25px */
}

.list-footer-subnav a {
  font-size: 0.9375vw; /* 12px */
  font-weight: 700;
  letter-spacing: .1em;
}

.list-footer-subnav a::before {
  content: '−';
  font-weight: 400;
  margin-right: .25em;
}

.copyright {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 5.546875vw; /* 71px */
  padding: 1.40625vw 0 0 66.484375vw; /* 18px 0 0 851px */
  background-image: url( ../img/line-copyright.svg );
  background-size: 100vw 2.421875vw; /* 1280px 31px */
  background-position: 50% 0;
}

.copyright img {
  width: 25.78125vw; /* 330px */
  height: 0.9375vw; /* 12px */
}

.pagetop {
  position: absolute;
  right: 2.734375vw; /* 35px */
  bottom: 18.75vw; /* 240px */
  width: 1.5625vw; /* 20px */
  height: 5.625vw; /* 72px */
}

a.btn-pagetop,
a.btn-pagetop > i {
  display: block;
  width: 1.5625vw; /* 20px */
  height: 5.625vw; /* 72px */
}