@charset "UTF-8";
/*---------------------------------------------------------
Reset
---------------------------------------------------------*/
@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@300;500;600&display=swap");
html, body,
div, article, section, main,
h1, h2, h3, h4, h5, h6,
dl, dt, dd,
ul, ol, li,
pre, form, input, textarea, address, nav,
table, th, td,
a, p, img, figure, span, em, small {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

main {
  display: block;
}

ul, li {
  list-style-type: none;
}

table {
  border-collapse: collapse;
}

img {
  border: none;
}

a {
  text-decoration: none;
}

a, button {
  outline: none;
}
a:focus, button:focus {
  outline: none;
}

/*---------------------------------------------------------
font
---------------------------------------------------------*/
/*---------------------------------------------------------
common
---------------------------------------------------------*/
html {
  font-size: 62.5%;
}
@media only screen and (min-width: 320px) and (max-width: 374px) {
  html {
    font-size: calc( 62.5% * ( 640 / 750 ) );
  }
}
@media screen and (min-width: 768px) and (max-width: 1000px) {
  html {
    font-size: 1vw;
  }
}

body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  font-size: 1.2rem;
  font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
  color: #595757;
  line-height: 1.7;
  min-width: 320px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-text-size-adjust: 100%;
  word-break: break-word;
}
@media print, screen and (min-width: 768px) {
  body {
    font-size: 1.7rem;
  }
}

#wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  min-height: 100vh;
  overflow: hidden;
}

main {
  position: relative;
  -webkit-box-flex: 1;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

img {
  width: 100%;
  vertical-align: bottom;
}

a {
  color: #333;
}

.res-pc {
  display: inline !important;
}
@media only screen and (max-width: 767px) {
  .res-pc {
    display: none !important;
  }
}

.res-sp {
  display: none !important;
}
@media only screen and (max-width: 767px) {
  .res-sp {
    display: inline !important;
  }
}

.switch {
  opacity: 0;
  -webkit-transition-duration: 0.2s;
  transition-duration: 0.2s;
}

.inline-block {
  display: inline-block;
}

.inner {
  padding: 0 3.0rem;
}
@media print, screen and (min-width: 768px) {
  .inner {
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 2.0rem;
  }
}

/*---------------------------------------------------------
parts
---------------------------------------------------------*/
.sec-title {
  line-height: 1;
}
.sec-title > span {
  display: block;
  padding-left: 0.8rem;
  border-left: 1px solid #231815;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
}
@media print, screen and (min-width: 768px) {
  .sec-title > span {
    padding-left: 1.7rem;
  }
}

.pagetop {
  display: block;
  width: 3.0rem;
  margin-left: auto;
  margin-top: 3.0rem;
}
@media print, screen and (min-width: 768px) {
  .pagetop {
    width: 4.8rem;
    margin-top: 5.0rem;
  }
}

/*---------------------------------------------------------
header
---------------------------------------------------------*/
header {
  display: none;
}
@media print, screen and (min-width: 768px) {
  header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 8.4rem;
  }
  header p {
    width: 16.0rem;
  }
}

/*---------------------------------------------------------
gnav
---------------------------------------------------------*/
#gnav {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 999;
}
@media only screen and (max-width: 767px) {
  #gnav #gnav-box {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: rgba(59, 64, 67, 0.6);
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%);
    -webkit-transition: -webkit-transform 0.3s;
    transition: -webkit-transform 0.3s;
    transition: transform 0.3s;
    transition: transform 0.3s, -webkit-transform 0.3s;
  }
  #gnav #gnav-box .inner {
    overflow: auto;
    height: 100vh;
    padding-top: 7.5rem;
    padding-bottom: 7.5rem;
  }
  #gnav #gnav-box ul li:nth-child(n+2) {
    margin-top: 2.5rem;
  }
  #gnav #gnav-box ul li a {
    font-size: 2.0rem;
    font-weight: bold;
    color: #fff;
    line-height: 1;
  }
  #gnav #gnav-box ul li a small {
    display: block;
    font-size: 1.6rem;
    font-weight: 300;
    margin-top: 0.5rem;
  }
  #gnav #h_btn {
    position: fixed;
    top: 0;
    right: 0;
    display: block;
    background-color: #959EA7;
    width: 5.9rem;
    height: 5.9rem;
  }
}
@media only screen and (max-width: 767px) and (min-width: 768px) {
  #gnav #h_btn {
    display: none;
  }
}
@media only screen and (max-width: 767px) {
  #gnav #h_btn i {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    display: block;
    background-color: #fff;
    width: 1.6rem;
    height: 1px;
    -webkit-transition: margin 0.1s 0.2s ease, -webkit-transform 0.3s;
    transition: margin 0.1s 0.2s ease, -webkit-transform 0.3s;
    transition: margin 0.1s 0.2s ease, transform 0.3s;
    transition: margin 0.1s 0.2s ease, transform 0.3s, -webkit-transform 0.3s;
  }
  #gnav #h_btn i:nth-child(1) {
    margin-top: -0.6rem;
  }
  #gnav #h_btn i:nth-child(2) {
    -webkit-transition: opacity 0.2s 0.2s;
    transition: opacity 0.2s 0.2s;
  }
  #gnav #h_btn i:nth-child(3) {
    margin-top: 0.6rem;
    margin-left: -0.3rem;
    width: 1.0rem;
  }
}
@media only screen and (max-width: 767px) and (max-width: 767px) {
  #gnav.on #gnav-box {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
@media only screen and (max-width: 767px) {
  #gnav.on #h_btn i {
    -webkit-transition: margin 0.1s ease, -webkit-transform 0.3s 0.2s;
    transition: margin 0.1s ease, -webkit-transform 0.3s 0.2s;
    transition: margin 0.1s ease, transform 0.3s 0.2s;
    transition: margin 0.1s ease, transform 0.3s 0.2s, -webkit-transform 0.3s 0.2s;
  }
  #gnav.on #h_btn i:nth-child(1) {
    margin-top: 0;
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg);
  }
  #gnav.on #h_btn i:nth-child(2) {
    margin-top: 0;
    -webkit-transform: translate(-50%, -50%) rotate(-45deg);
    transform: translate(-50%, -50%) rotate(-45deg);
  }
  #gnav.on #h_btn i:nth-child(3) {
    opacity: 0;
  }
}
@media print, screen and (min-width: 768px) {
  #gnav ul {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    height: 6.0rem;
    padding: 0 8.0rem;
  }
  #gnav ul:before, #gnav ul:after {
    position: absolute;
    display: block;
    content: " ";
    width: 100%;
    left: 0;
  }
  #gnav ul:before {
    top: 0;
    height: 3.5rem;
    background-color: rgba(37, 38, 38, 0.65);
  }
  #gnav ul:after {
    bottom: 0;
    height: 2.5rem;
    background-color: rgba(37, 38, 38, 0.3);
  }
  #gnav ul li {
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    z-index: 9;
  }
  #gnav ul li a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
    background-color: rgba(255, 255, 255, 0);
    -webkit-transition: background 0.3s;
    transition: background 0.3s;
    font-size: 1.4rem;
    color: #fff;
    text-align: center;
  }
  #gnav ul li a:hover {
    background-color: rgba(255, 255, 255, 0.2);
  }
  #gnav ul li a span, #gnav ul li a small {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }
  #gnav ul li a span {
    height: 3.5rem;
    letter-spacing: 0.2em;
  }
  #gnav ul li a small {
    height: 2.5rem;
  }
  #gnav.fixed {
    position: fixed;
  }
}

/*---------------------------------------------------------
footer
---------------------------------------------------------*/
footer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  line-height: 1;
  height: 3.0rem;
}
@media print, screen and (min-width: 768px) {
  footer {
    height: 8.3rem;
  }
}
footer small {
  font-size: 1.0rem;
}
@media print, screen and (min-width: 768px) {
  footer small {
    font-size: 1.3rem;
  }
}

/*---------------------------------------------------------
mv
---------------------------------------------------------*/
#mv {
  height: 63.3333333333vw;
  background: no-repeat center center / cover;
}
@media only screen and (max-width: 767px) {
  #mv {
    background-image: url(../img/mv-sp.jpg);
  }
}
@media print, screen and (min-width: 768px) {
  #mv {
    background-image: url(../img/mv-pc.jpg);
    height: 54.0rem;
  }
}
#mv h1 {
  width: 32vw;
  line-height: 1;
  margin-top: 26.9333333333vw;
}
@media print, screen and (min-width: 768px) {
  #mv h1 {
    width: 40.0rem;
    margin-top: 23.7rem;
  }
}

/*---------------------------------------------------------
mv-name
---------------------------------------------------------*/
#mv-name-box {
  padding: 2.4rem 0 1.5rem;
}
@media print, screen and (min-width: 768px) {
  #mv-name-box {
    position: relative;
    background-color: #929393;
    padding: 4.0rem 0;
  }
  #mv-name-box:before {
    position: absolute;
    display: block;
    content: " ";
    background-color: #252626;
    width: calc( 50% + 15.0rem );
    height: 100%;
    top: 0;
    right: 0;
  }
}
@media print, screen and (min-width: 768px) {
  #mv-name-box .inner {
    position: relative;
  }
  #mv-name-box .inner:before {
    position: absolute;
    display: block;
    content: " ";
    background: url(../img/mv-circle.png) no-repeat center center/contain;
    width: 27.3rem;
    height: 27.3rem;
    top: 10.8rem;
    left: 2.9rem;
  }
}
#mv-name-box #mv-name {
  width: 27.39rem;
}
@media print, screen and (min-width: 768px) {
  #mv-name-box #mv-name {
    width: 49.8rem;
    margin-left: auto;
  }
}
#mv-name-box #mv-copy,
#mv-name-box #mv-name-jp {
  line-height: 1;
}
@media print, screen and (min-width: 768px) {
  #mv-name-box #mv-copy,
  #mv-name-box #mv-name-jp {
    position: relative;
    left: calc( 50% - 6.7rem );
  }
}
#mv-name-box hr {
  display: none;
}
@media print, screen and (min-width: 768px) {
  #mv-name-box hr {
    display: block;
    border: none;
    background: url(../img/mv-bar.jpg) no-repeat center center/contain;
    width: 100%;
    height: 0.8rem;
    margin: 2.0rem 0 0 0;
  }
}
#mv-name-box #mv-copy {
  width: 20.57rem;
  margin-top: 2.5rem;
}
@media print, screen and (min-width: 768px) {
  #mv-name-box #mv-copy {
    width: 37.5rem;
    margin-top: 2.5rem;
  }
}
#mv-name-box #mv-name-jp {
  width: 12.32rem;
  margin-top: 1.5rem;
}
@media print, screen and (min-width: 768px) {
  #mv-name-box #mv-name-jp {
    width: 22.4rem;
    margin-top: 2.8rem;
  }
}

/*---------------------------------------------------------
company
---------------------------------------------------------*/
#company {
  margin-top: 1.5rem;
}
@media print, screen and (min-width: 768px) {
  #company {
    margin-top: 10.3rem;
  }
}
#company .sec-title > span {
  width: 7.0rem;
  padding-bottom: 0.9rem;
  margin-left: auto;
}
@media print, screen and (min-width: 768px) {
  #company .sec-title > span {
    width: 14.1rem;
    padding-bottom: 2.5rem;
  }
}
#company figure {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
#company #company-prof {
  margin-top: 2.5rem;
}
@media print, screen and (min-width: 768px) {
  #company #company-prof {
    margin-top: 3.0rem;
  }
}
@media print, screen and (min-width: 768px) {
  #company #company-prof ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }
}
@media print, screen and (min-width: 768px) {
  #company #company-prof ul li {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
  }
}
#company #company-prof ul li:nth-child(n+2) {
  margin-top: 1.8rem;
}
@media print, screen and (min-width: 768px) {
  #company #company-prof ul li:nth-child(n+2) {
    margin: 0 0 0 6.0rem;
  }
}
#company #company-prof ul li:nth-child(n+2) dt, #company #company-prof ul li:nth-child(n+2) dd {
  font-size: 1.1rem;
}
@media print, screen and (min-width: 768px) {
  #company #company-prof ul li:nth-child(n+2) dt, #company #company-prof ul li:nth-child(n+2) dd {
    font-size: 1.5rem;
  }
}
#company #company-prof ul li:nth-child(n+2) dt {
  line-height: 2.2666666667;
}
#company #company-prof ul li .company-prof-title {
  margin-bottom: 1.3rem;
}
@media print, screen and (min-width: 768px) {
  #company #company-prof ul li .company-prof-title {
    margin-bottom: 3.0rem;
  }
}
#company #company-prof ul li dl {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
#company #company-prof ul li dl dt {
  width: 7em;
}
#company #company-prof ul li dl dd {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  text-indent: -1em;
  padding-left: 1em;
}

/*---------------------------------------------------------
business
---------------------------------------------------------*/
#business {
  margin-top: 3.0rem;
}
@media print, screen and (min-width: 768px) {
  #business {
    margin-top: 8.0rem;
  }
}
#business .sec-title {
  position: relative;
}
#business .sec-title:before {
  position: absolute;
  display: block;
  content: " ";
  background-color: #231815;
  width: calc( 100% + (50vw - 50%) );
  height: 1px;
  bottom: 0;
  left: calc(50% - 50vw);
}
@media print, screen and (min-width: 768px) {
  #business .sec-title:before {
    width: calc( 48.0rem + (50vw - 50%) );
  }
}
#business .sec-title > span {
  width: 7.0rem;
  padding-top: 0.3rem;
  padding-bottom: 0.9rem;
}
@media print, screen and (min-width: 768px) {
  #business .sec-title > span {
    width: 14.1rem;
    padding-bottom: 2.5rem;
  }
}
@media print, screen and (min-width: 768px) {
  #business #business-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }
}
#business #business-box figure {
  display: none;
}
@media print, screen and (min-width: 768px) {
  #business #business-box figure {
    display: block;
  }
}
#business #business-list {
  margin-top: 2.0rem;
}
@media print, screen and (min-width: 768px) {
  #business #business-list {
    margin-top: 4.0rem;
  }
}
#business #business-list dl:nth-of-type(2) {
  margin-top: 2.0rem;
}
@media print, screen and (min-width: 768px) {
  #business #business-list dl:nth-of-type(2) {
    margin-top: 4.5rem;
  }
}
#business #business-list dl:nth-of-type(2) dd {
  font-size: 1.2rem;
}
@media print, screen and (min-width: 768px) {
  #business #business-list dl:nth-of-type(2) dd {
    font-size: 1.5rem;
  }
}
#business #business-list dl dt {
  font-weight: bold;
}
#business #business-list dl dd {
  padding-left: 1em;
}
#business #business-list dl dd ul li > span {
  display: block;
  float: left;
  margin-left: -1em;
}

/*---------------------------------------------------------
development
---------------------------------------------------------*/
#development {
  margin-top: 10.8vw;
  padding-top: 7.8666666667vw;
  color: #fff;
}
@media print, screen and (min-width: 768px) {
  #development {
    margin-top: 15.6rem;
    padding-top: 10.4rem;
  }
}
#development #development-box {
  background-color: #252626;
  padding-bottom: 4.5rem;
}
@media print, screen and (min-width: 768px) {
  #development #development-box {
    padding-bottom: 7.5rem;
  }
}
#development .inner {
  position: relative;
}
#development .inner:before {
  position: absolute;
  display: block;
  content: " ";
  background: url(../img/development-en.svg) no-repeat center center/contain;
  width: 68.8vw;
  height: 10.4vw;
  top: -7.8666666667vw;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}
@media print, screen and (min-width: 768px) {
  #development .inner:before {
    width: 81.1rem;
    height: 13.7rem;
    top: -10.4rem;
    left: 1.1rem;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
@media print, screen and (min-width: 768px) {
  #development .sec-title {
    margin-left: -2.0rem;
  }
}
#development .sec-title > span {
  width: 7.0rem;
  padding-top: 1.5rem;
  border-color: #fff;
}
@media print, screen and (min-width: 768px) {
  #development .sec-title > span {
    width: 14.1rem;
    padding-bottom: 2.5rem;
  }
}
#development #dev-nav {
  margin-top: 2.5rem;
}
@media print, screen and (min-width: 768px) {
  #development #dev-nav {
    margin-top: 4.6rem;
  }
}
#development #dev-nav ol {
  margin-bottom: -0.5em;
}
@media print, screen and (min-width: 768px) {
  #development #dev-nav ol {
    -webkit-column-count: 2;
    column-count: 2;
  }
}
#development #dev-nav ol li {
  margin-bottom: 0.5em;
}
@media print, screen and (min-width: 768px) {
  #development #dev-nav ol li {
    margin-bottom: 1.0rem;
  }
}
#development #dev-nav ol li a {
  display: inline-block;
  color: #fff;
  padding-left: 2.0em;
}
@media print, screen and (min-width: 768px) {
  #development #dev-nav ol li a {
    font-size: 1.5rem;
  }
}
#development #dev-nav ol li a .num {
  float: left;
  margin-left: -2.0em;
}
#development #dev-nav ol li a .num:after {
  content: ".";
}
#development #dev-nav ol li a .num img {
  width: auto;
  height: 1.1rem;
  vertical-align: baseline;
}
@media print, screen and (min-width: 768px) {
  #development #dev-nav ol li a .num img {
    height: 1.4rem;
  }
}
#development #dev-nav ol li a small {
  display: block;
  margin-left: 0.2em;
}
@media print, screen and (min-width: 768px) {
  #development #dev-nav ol li a small {
    font-size: 1.2rem;
  }
}
#development #dev-contents {
  margin-top: 3.75rem;
}
@media print, screen and (min-width: 768px) {
  #development #dev-contents {
    margin-top: 9.0rem;
  }
}
#development .dev-sec {
  position: relative;
}
#development .dev-sec:nth-of-type(n+2) {
  margin-top: 5.0rem;
}
@media print, screen and (min-width: 768px) {
  #development .dev-sec:nth-of-type(n+2) {
    margin-top: 7.0rem;
  }
}
#development .dev-sec .num {
  position: absolute;
  top: 0;
  right: 0;
}
#development .dev-sec .num img {
  width: auto;
  height: 3.0rem;
}
@media print, screen and (min-width: 768px) {
  #development .dev-sec .num img {
    height: 3.4rem;
  }
}
@media print, screen and (min-width: 768px) {
  #development .dev-sec .dev-flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }
}
#development .dev-sec .dev-img {
  width: 15.0rem;
  margin: 0 auto;
}
@media print, screen and (min-width: 768px) {
  #development .dev-sec .dev-img {
    width: 30.0rem;
    margin: 0 2.4rem 0 0;
  }
}
@media print, screen and (min-width: 768px) {
  #development .dev-sec .dev-img > div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}
#development .dev-sec .dev-txt {
  margin-top: 2.0rem;
}
@media print, screen and (min-width: 768px) {
  #development .dev-sec .dev-txt {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin: -0.3em 0;
  }
}
#development .dev-sec .title {
  font-size: 1.5rem;
  font-weight: normal;
  text-align: center;
}
@media print, screen and (min-width: 768px) {
  #development .dev-sec .title {
    font-size: 1.8rem;
    text-align: left;
  }
}
#development .dev-sec .txt {
  margin-top: 0.5em;
}
@media print, screen and (min-width: 768px) {
  #development .dev-sec .txt {
    font-size: 1.3rem;
  }
}
@media only screen and (max-width: 767px) {
  #development .dev-sec .txt br {
    display: none;
  }
}
#development .dev-sec .txt p {
  margin-top: 1em;
}
#development .dev-sec .txt p br {
  display: block;
}
#development .dev-sec .dev-txt-en {
  margin-top: 1.5em;
  font-family: 'Noto Serif JP', serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
@media print, screen and (min-width: 768px) {
  #development .dev-sec .dev-txt-en {
    margin-top: 1em;
    letter-spacing: -0.025em;
  }
}
#development .dev-sec .dev-txt-en .title {
  font-size: 1.5rem;
}
@media print, screen and (min-width: 768px) {
  #development .dev-sec .dev-txt-en .title {
    font-size: 1.6rem;
  }
}
@media print, screen and (min-width: 768px) {
  #development .dev-sec .dev-txt-en .txt {
    font-size: 1.1rem;
  }
}
@media print, screen and (min-width: 768px) {
  #development .dev-sec-reverse .num {
    right: auto;
    left: 0;
  }
  #development .dev-sec-reverse .dev-flex {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
  }
  #development .dev-sec-reverse .dev-img {
    margin: 0 0 0 2.4rem;
  }
  #development .dev-sec-reverse .dev-txt {
    margin-left: 8.0rem;
  }
}
@media print, screen and (min-width: 768px) {
  #development #dev-sec-01 .num {
    right: 8.0rem;
  }
}
@media print, screen and (min-width: 768px) {
  #development #dev-sec-02 .num {
    left: 16.8rem;
  }
  #development #dev-sec-02 .dev-txt {
    margin-left: 24.5rem;
  }
}
@media print, screen and (min-width: 768px) {
  #development #dev-sec-03 .dev-flex .dev-img {
    width: auto;
    width: 43rem;
  }
  #development #dev-sec-03 .dev-flex .dev-img #dev-03-img-03 {
    display: block !important;
    width: 30.0rem;
    margin-left: auto;
    margin-top: 2.0rem;
  }
}
@media print, screen and (min-width: 768px) {
  #development #dev-sec-04 .dev-txt {
    margin-right: -1em;
  }
}
@media only screen and (max-width: 767px) {
  #development #dev-sec-05 .dev-img {
    width: 12.3rem;
  }
}
@media print, screen and (min-width: 768px) {
  #development #dev-sec-05 .dev-img {
    width: 24.0rem;
    margin-left: 5.6rem;
  }
}
@media only screen and (max-width: 767px) {
  #development #dev-sec-06 .dev-flex {
    padding-top: 5.0rem;
  }
  #development #dev-sec-06 .dev-img {
    width: 100%;
  }
}
@media print, screen and (min-width: 768px) {
  #development #dev-sec-06 {
    margin-left: 33.0rem;
  }
  #development #dev-sec-06 .dev-flex {
    display: block;
    margin-left: 8.15rem;
  }
  #development #dev-sec-06 .dev-flex .dev-img {
    margin-left: 0;
    width: 100%;
  }
  #development #dev-sec-06 .dev-flex .dev-txt {
    margin-left: 0;
    margin-top: 2.5rem;
  }
}
@media print, screen and (min-width: 768px) {
  #development #dev-sec-07 .num {
    right: auto;
    left: 32.8rem;
    top: 5.4rem;
  }
  #development #dev-sec-07 .dev-txt {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
  }
}
@media only screen and (max-width: 767px) {
  #development #dev-sec-08 .dev-img {
    width: 20.0rem;
  }
}
@media print, screen and (min-width: 768px) {
  #development #dev-sec-08 {
    margin-left: 8.0rem;
  }
  #development #dev-sec-08 .dev-img {
    width: 30.0rem;
  }
}
@media only screen and (max-width: 767px) {
  #development #dev-sec-09 .dev-img {
    width: 11.5rem;
  }
}
@media print, screen and (min-width: 768px) {
  #development #dev-sec-09 {
    margin-left: 8.0rem;
  }
  #development #dev-sec-09 .dev-flex {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    margin-left: 8.0rem;
  }
  #development #dev-sec-09 .dev-img {
    width: 22.1rem;
    margin: 0;
  }
  #development #dev-sec-09 .dev-txt {
    margin-left: 2.4rem;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
  }
  #development #dev-sec-09 .dev-txt .dev-txt-en {
    margin: 0 0 0 2.4rem;
  }
}
@media only screen and (max-width: 767px) {
  #development #dev-sec-10 .dev-img {
    width: 16.5rem;
  }
}
@media print, screen and (min-width: 768px) {
  #development #dev-sec-11 .num {
    right: 6.0rem;
  }
}
@media only screen and (max-width: 767px) {
  #development #dev-sec-12 .dev-flex,
  #development #dev-sec-13 .dev-flex {
    padding-top: 5.0rem;
  }
  #development #dev-sec-12 .dev-img,
  #development #dev-sec-13 .dev-img {
    width: 100%;
  }
}
@media print, screen and (min-width: 768px) {
  #development #dev-sec-12,
  #development #dev-sec-13 {
    width: 56.6666666667%;
  }
  #development #dev-sec-12 .dev-flex,
  #development #dev-sec-13 .dev-flex {
    display: block;
  }
  #development #dev-sec-12 .dev-flex .dev-img,
  #development #dev-sec-13 .dev-flex .dev-img {
    width: 100%;
  }
  #development #dev-sec-12 .dev-flex .dev-txt,
  #development #dev-sec-13 .dev-flex .dev-txt {
    margin-top: 3.4rem;
  }
}
@media print, screen and (min-width: 768px) {
  #development #dev-sec-12 .num {
    top: 18.0rem;
  }
}
@media print, screen and (min-width: 768px) {
  #development #dev-sec-13 .num {
    top: 21.8rem;
  }
}
@media print, screen and (min-width: 768px) {
  #development #dev-sec-14 {
    width: 31.25%;
    margin: -43.0rem 0 0 auto;
  }
  #development #dev-sec-14 .num {
    top: auto;
    bottom: -7.4rem;
  }
  #development #dev-sec-14 .dev-flex {
    display: block;
  }
  #development #dev-sec-14 .dev-flex .dev-img {
    width: 100%;
  }
  #development #dev-sec-14 .dev-flex .dev-txt {
    margin-top: 3.4rem;
  }
}
@media print, screen and (min-width: 768px) {
  #development .pagetop {
    margin-top: 15.0rem;
    margin-bottom: -7.5rem;
  }
}
#development #dev-logo {
  width: 15.0rem;
  margin: 4.5rem auto 0;
}
@media print, screen and (min-width: 768px) {
  #development #dev-logo {
    width: 30.0rem;
    margin: -1.0rem 0 0 0;
  }
}