@media screen and (max-width: 640px) {
  

  
  #crossfade > img { 
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    color: transparent;
    opacity: 0;
    z-index: 0;
    -webkit-backface-visibility: hidden;
    -webkit-animation: imageAnimation 30s linear infinite 0s;
    -moz-animation: imageAnimation 30s linear infinite 0s;
    -o-animation: imageAnimation 30s linear infinite 0s;
    -ms-animation: imageAnimation 30s linear infinite 0s;
    animation: imageAnimation 30s linear infinite 0s; 
}
#crossfade > img:nth-child(2)  { 

    -webkit-animation-delay: 6s;
    -moz-animation-delay: 6s;
    -o-animation-delay: 6s;
    -ms-animation-delay: 6s;
    animation-delay: 6s; 
}
#crossfade > img:nth-child(3) { 

    -webkit-animation-delay: 12s;
    -moz-animation-delay: 12s;
    -o-animation-delay: 12s;
    -ms-animation-delay: 12s;
    animation-delay: 12s; 
}
#crossfade > img:nth-child(4) { 

    -webkit-animation-delay: 18s;
    -moz-animation-delay: 18s;
    -o-animation-delay: 18s;
    -ms-animation-delay: 18s;
    animation-delay: 18s; 
}
#crossfade > img:nth-child(5) { 

    -webkit-animation-delay: 24s;
    -moz-animation-delay: 24s;
    -o-animation-delay: 24s;
    -ms-animation-delay: 24s;
    animation-delay: 24s; 
}

@-webkit-keyframes imageAnimation { 
    0% { opacity: 0;
    -webkit-animation-timing-function: ease-in; }
    8% { opacity: 1;
         -webkit-animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}

@-moz-keyframes imageAnimation { 
    0% { opacity: 0;
    -moz-animation-timing-function: ease-in; }
    8% { opacity: 1;
         -moz-animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}

@-o-keyframes imageAnimation { 
    0% { opacity: 0;
    -o-animation-timing-function: ease-in; }
    8% { opacity: 1;
         -o-animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}

@-ms-keyframes imageAnimation { 
    0% { opacity: 0;
    -ms-animation-timing-function: ease-in; }
    8% { opacity: 1;
         -ms-animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}

@keyframes imageAnimation { 
    0% { opacity: 0;
    animation-timing-function: ease-in; }
    8% { opacity: 1;
         animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
  }
  
  
  




  section.concept figure:nth-of-type(1) {
    display: block;
    height: 46.93333333vw;
    width: 46.93333333vw;
  background-image: url(../images/facebook/1.jpg);
    background-size: cover;
    background-position: left top;
    background-repeat: no-repeat;
    position: absolute;
    left: -4.26666667vw;
    top: 23.86666667vw;
    z-index: 1;
  }
  section.concept figure:nth-of-type(2) {
    display: block;
    height: 46.93333333vw;
    width: 46.93333333vw;
  background-image: url(../images/facebook/2.jpg);
    background-size: cover;
    background-position: left top;
    background-repeat: no-repeat;
    position: absolute;
    left: 47.33333333vw;
    top: 16.93333333vw;
    z-index: 1;
  }
  section.concept figure:nth-of-type(3) {
    display: block;
    height: 46.93333333vw;
    width: 46.93333333vw;
  background-image: url(../images/facebook/3.jpg);
    background-size: cover;
    background-position: left top;
    background-repeat: no-repeat;
    position: absolute;
    left: -13.46666667vw;
    top: 84.13333333vw;
    z-index: 1;
  }
  section.concept figure:nth-of-type(4) {
    display: block;
    height: 46.93333333vw;
    width: 46.93333333vw;
  background-image: url(../images/facebook/4.jpg);
    background-size: cover;
    background-position: left top;
    background-repeat: no-repeat;
    position: absolute;
    left: 72.93333333vw;
    top: 74.4vw;
    z-index: 1;
  }
  section.concept figure:nth-of-type(5) {
    display: block;
    height: 46.93333333vw;
    width: 46.93333333vw;
       background-image: url(../images/facebook/5.jpg);
    background-size: cover;
    background-position: left top;
    background-repeat: no-repeat;
    position: absolute;
    left: -7.73333333vw;
    top: 143.33333333vw;
    z-index: 1;
  }
  section.concept figure:nth-of-type(6) {
    display: block;
    height: 46.93333333vw;
    width: 46.93333333vw;
  background-image: url(../images/facebook/6.jpg);
    background-size: cover;
    background-position: left top;
    background-repeat: no-repeat;
    position: absolute;
    left: 74.53333333vw;
    top: 136.8vw;
    z-index: 1;
  }
  section.concept figure:nth-of-type(7) {
    display: block;
    height: 46.93333333vw;
    width: 46.93333333vw;
  background-image: url(../images/facebook/7.jpg);
    background-size: cover;
    background-position: left top;
    background-repeat: no-repeat;
    position: absolute;
    left: -13.46666667vw;
    top: 203.33333333vw;
    z-index: 1;
  }
  section.concept figure:nth-of-type(8) {
    display: block;
    height: 46.93333333vw;
    width: 46.93333333vw;
  background-image: url(../images/facebook/8.jpg);
    background-size: cover;
    background-position: left top;
    background-repeat: no-repeat;
    position: absolute;
    left: 81.06666667vw;
    top: 194.8vw;
    z-index: 1;
  }
  section.concept figure:nth-of-type(9) {
    display: block;
    height: 46.93333333vw;
    width: 46.93333333vw;
   background-image: url(../images/facebook/9.jpg);
    background-size: cover;
    background-position: left top;
    background-repeat: no-repeat;
    position: absolute;
    left: 5.2vw;
    top: 244.8vw;
    z-index: 1;
  }
  section.concept figure:nth-of-type(10) {
    display: block;
    height: 46.93333333vw;
    width: 46.93333333vw;
   background-image: url(../images/facebook/10.jpg);
    background-size: cover;
    background-position: left top;
    background-repeat: no-repeat;
    position: absolute;
    left: 58.53333333vw;
    top: 250.13333333vw;
    z-index: 1;
  }
  
  
  
  
  
  
  
  
  section.space .col{
	      margin-left: -855px;

  }
  .googlemap {
    height: 10%;
	width: 10%;
}
  .googlemap iframe{
    height: 475px;
    width: 380px;
}

section.experiment {
    width: 100%;
    padding-left: 6.66666667vw;
    padding-right: 6.66666667vw;
    padding-top: 13.33333333vw;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
  section.concept {
width: 100%;
    height: 320vw;
    position: relative;
    overflow: hidden;
  }
  section.title {
    width: 100%;
    padding-left: 6.66666667vw;
    padding-right: 6.66666667vw;
    padding-top: 18.333333vw;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
section.title ul.nav {
width: 109%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    height: 37.666667vw;
    font-size: 3.2vw;
    margin-left: -3vw;
    letter-spacing: 0.2em;
    color: #ffffff;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-bottom: 1px solid #ffffff;
}
section.title ul.nav li {
height: 100%;
    width: 100%;
    position: relative;
    cursor: pointer;
}
   section.title ul.nav li.logoOtava figure:nth-of-type(1) {

    background-image: url(../images/about/SofiaLogoFinal.png);
       height: 27vw;
    padding-top: 0vw;
    width: 100%;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: left;
    position: relative;
    left: 7vw;
  }
    section.title ul.nav li.logoSofia figure:nth-of-type(1) {

    background-image: url(../images/about/OtavaLogoFinal.jpg);
width: 100%;
    height: 26vw;
    margin-top: 0vw;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: left;
    position: relative;
  }
  section.title h2 {
    font-size: 5.86666667vw;
    letter-spacing: 0.2em;
    text-align: center;
    padding-top: 10.66666667vw;
    margin-bottom: 8vw;
}
  #crossfade > img { 
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    color: transparent;
    opacity: 0;
    z-index: 0;
    -webkit-backface-visibility: hidden;
    -webkit-animation: imageAnimation 30s linear infinite 0s;
    -moz-animation: imageAnimation 30s linear infinite 0s;
    -o-animation: imageAnimation 30s linear infinite 0s;
    -ms-animation: imageAnimation 30s linear infinite 0s;
    animation: imageAnimation 30s linear infinite 0s; 
}
  section.concept h2 {
    font-size: 8.866667vw;
    letter-spacing: 0.2em;
    text-align: center;
    position: absolute;
    left: 30vw;
    top: 24vw;
    color: #333333;
}
  
  section.concept .text-wrap {
    width: 74.66666667vw;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding-top: 20vw;
    padding-left: 3.33333333vw;
    padding-right: 3.33333333vw;
    padding-bottom: 20vw;
    background-color: #ffffff;
    text-align: center;
    position: absolute;
    left: 12.66666667vw;
    top: 84vw;
    z-index: 3;
    color: #000000;
  }
  
  section.concept .text-wrap .en {
    margin-bottom: 6.66666667vw;
  }
  section.concept .text-wrap .en p.title {
 font-size: 3.46666667vw;
    line-height: 5.86666667vw;
    letter-spacing: 0.05em;
    margin-bottom: 5.33333333vw;
    position: relative;
  }
  section.concept .text-wrap .en p.title:after {
    display: block;
    content: "";
    width: 8vw;
    height: 0.26666667vw;
    background-color: #bcae5c;
    margin-top: 5.33333333vw;
    margin-left: auto;
    margin-right: auto;
  }
  section.concept .text-wrap .en p.text {
    font-size: 3.2vw;
    line-height: 5.86666667vw;
    letter-spacing: 0.04em;
  }
  section.concept .text-wrap .ja p.title {
    font-size: 3.73333333vw;
    line-height: 5.86666667vw;
    letter-spacing: 0.05em;
    margin-bottom: 5.33333333vw;
    position: relative;
  }
  section.concept .text-wrap .ja p.title:after {
    display: block;
    content: "";
    width: 8vw;
    height: 0.26666667vw;
    background-color: #bcae5c;
    margin-top: 5.33333333vw;
    margin-left: auto;
    margin-right: auto;
  }
  section.concept .text-wrap .ja p.text {
    font-size: 3.2vw;
    line-height: 5.86666667vw;
    letter-spacing: 0.04em;
  }

  section.service {
    width: 100%;
    padding-bottom: 16vw;
    background-color: #d3dcdd;
  }
  section.service .inner {
    width: 100%;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    padding-left: 6.66666667vw;
    padding-right: 6.66666667vw;
  }
  section.service .inner h2 {
    border-top: 1px solid #ffffff;
    font-size: 5.86666667vw;
    letter-spacing: 0.2em;
    text-align: center;
    color: #333333;
    padding-top: 9.33333333vw;
    margin-bottom: 10.66666667vw;
  }
  section.service .inner .row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
            flex-direction: column-reverse;
  }
  section.service .inner .row .col:nth-of-type(2) {
    width: 100%;
    height: 86.66666667vw;
    margin-bottom: 8vw;
  }
  section.service .inner .row .col:nth-of-type(2) figure {
    width: 100%;
    height: 100%;
    background-image: url("../images/facebook/26.jpg");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: left top;
  }
  section.service .inner .row .col:nth-of-type(1) .en {
    margin-bottom: 9.33333333vw;
  }
  section.service .inner .row .col:nth-of-type(1) .en h3 {
    font-size: 4vw;
    line-height: 5.86666667vw;
    letter-spacing: 0.03em;
    color: #333333;
    margin-bottom: 3.33333333vw;
  }
  section.service .inner .row .col:nth-of-type(1) .en p {
    font-size: 3.2vw;
    line-height: 5.86666667vw;
    letter-spacing: 0.04em;
    color: #666666;
  }
  section.service .inner .row .col:nth-of-type(1) .ja h3 {
    font-size: 3.73333333vw;
    line-height: 5.86666667vw;
    letter-spacing: 0.05em;
    color: #333333;
    margin-bottom: 4vw;
  }
  section.service .inner .row .col:nth-of-type(1) .ja p {
    font-size: 3.2vw;
    line-height: 5.86666667vw;
    letter-spacing: 0.04em;
    color: #666666;
    margin-top: -9px;
    margin-bottom: -9px;
  }
  section.space {
    width: 100%;
    padding-bottom: 16vw;
    background-color: #d3dcdd;
  }
  section.space .inner {
    width: 100%;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    padding-left: 6.66666667vw;
    padding-right: 6.66666667vw;
  }
  section.space .inner h2 {
    border-top: 1px solid #ffffff;
    font-size: 5.86666667vw;
    letter-spacing: 0.2em;
    text-align: center;
    color: #333333;
    padding-top: 9.33333333vw;
    margin-bottom: 12vw;
  }
  section.space .inner .row:nth-of-type(1) {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
            flex-direction: column-reverse;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    margin-bottom: 9.33333333vw;
  }
  section.space .inner .row:nth-of-type(1) .col:nth-of-type(2) {
    width: 86.66666667vw;
    height: 72.8vw;
    margin-bottom: 9.33333333vw;
  }
  section.space .inner .row:nth-of-type(1) .col:nth-of-type(2) figure {
    width: 100%;
    height: 100%;
    background-image: url("../images/lg/about_space119ce.png?1564208591907");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: left top;
  }
  section.space .inner .row:nth-of-type(1) .col:nth-of-type(1) .en {
    margin-bottom: 8vw;
  }
  section.space .inner .row:nth-of-type(1) .col:nth-of-type(1) .en h3 {
    font-size: 4vw;
    line-height: 5.86666667vw;
    letter-spacing: 0.03em;
    color: #333333;
    margin-bottom: 2.66666667vw;
  }
  section.space .inner .row:nth-of-type(1) .col:nth-of-type(1) .en p {
    font-size: 3.2vw;
    line-height: 5.86666667vw;
    letter-spacing: 0.04em;
    color: #666666;
  }
  section.space .inner .row:nth-of-type(1) .col:nth-of-type(1) .ja h3 {
    font-size: 3.73333333vw;
    line-height: 5.86666667vw;
    letter-spacing: 0.05em;
    color: #333333;
    margin-bottom: 2.66666667vw;
  }
  section.space .inner .row:nth-of-type(1) .col:nth-of-type(1) .ja p {
    font-size: 3.2vw;
    line-height: 5.86666667vw;
    letter-spacing: 0.04em;
    color: #666666;
  }

  section.space .inner .row:nth-of-type(2) .col .en {
    margin-bottom: 6.66666667vw;
  }
  section.space .inner .row:nth-of-type(2) .col .en h3 {
    font-size: 4.53333333vw;
    letter-spacing: 0.05em;
    color: #333333;
    margin-bottom: 2.66666667vw;
  }
  section.space .inner .row:nth-of-type(2) .col .en ul {
    font-size: 3.46666667vw;
    line-height: 4.53333333vw;
    color: #666666;
  }
  section.space .inner .row:nth-of-type(2) .col .en ul li {
    margin-bottom: 1.33333333vw;
  }
  section.space .inner .row:nth-of-type(2) .col .ja h3 {
    font-size: 4vw;
    letter-spacing: 0.05em;
    color: #333333;
    margin-bottom: 2.66666667vw;
  }
  section.space .inner .row:nth-of-type(2) .col .ja ul {
    font-size: 3.46666667vw;
    line-height: 4.53333333vw;
    letter-spacing: 0.05em;
    color: #666666;
  }
  section.space .inner .row:nth-of-type(2) .col .ja ul li {
    margin-bottom: 1.33333333vw;
  }
  section.space .inner .row:nth-of-type(2) .col:nth-of-type(1) {
    margin-bottom: 8vw;
  }
  
  section.space .inner .row:nth-of-type(2) .col:nth-of-type(2) figure {
    background-image: url("../images/sm/about_space319ce.jpg?1564208591907");
  }
  section.space .inner .row:nth-of-type(2) .col:nth-of-type(2) li span {
    display: block;
    margin-top: 1.33333333vw;
    font-size: 3.2vw;
    line-height: 4.66666667vw;
    padding-left: 1.5em;
    text-indent: -1em;
  }
}


@media screen and (min-width: 641px) {
	
	
	
	 section.title {
    width: 100%;
    padding-left: 1px;
    padding-right: 1px;
    padding-top: 95px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
section.title ul.nav {
width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    height: 140px;
    font-size: 1px;
    margin-left: 1px;
    letter-spacing: 0.2px;
    color: #ffffff;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-bottom: 1px solid #231815;
}
section.title ul.nav li {
height: 100%;
    width: 19%;
    position: relative;
    cursor: pointer;
}
   section.title ul.nav li.logoOtava figure:nth-of-type(1) {
    background-image: url(../images/about/OtavaLogoFinal.jpg);
	background-repeat:no-repeat;
width: 100%;
    height: 110px;
    margin-top: 28px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: left;
    position: relative;
    left: -69px;
  }
    section.title ul.nav li.logoSofia figure:nth-of-type(1) {
    background-image: url(../images/about/SofiaLogoFinal.png);
    height: 144px;
    padding-top: 1px;
    margin-right: 226px;
    width: 100%;
    margin-top: 28px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: right;
    position: relative;
    left: 60px;
  }
  section.title h2 {
font-size: 46px;
    letter-spacing: 1.1px;
    text-align: center;
    padding-top: 24px;
    margin-bottom: -69px;
}
	
	
	
	
	.googlemap {
    
    width: 100%;
    height: 100%;

}
  section.concept {
width: 100%;
    height: 1044px;
    background-color: #d3dcdd;
    padding-top: 100px;
  }
  section.concept .inner {
    width: 100%;
    height: 100%;
    margin-left: auto;
    margin-right: auto;
    position: relative;
  }
  section.concept .inner h2 {
    font-size: 40px;
    letter-spacing: 0.2em;
    color: #333333;
    text-align: center;
    position: absolute;
    font-family: 'EB Garamond';
    top: 100px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
  }
  section.concept .inner .text-wrap {
width: 709px;
    position: absolute;
    left: 0;
    right: 0;
    top: 137px;
    margin-left: auto;
    margin-right: auto;
    background-color: #ffffff;
    text-align: center;
    padding-left: 50px;
    padding-right: 50px;
    padding-top: 70px;
    padding-bottom: 70px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    z-index: 46;
  }
  section.concept .inner .text-wrap .en {
    margin-bottom: 35px;
  }
  section.concept .inner .text-wrap .en p.title {
    font-size: 24px;
    line-height: 40px;
    letter-spacing: 0.03em;
    margin-bottom: 20px;
    position: relative;
    color: #333333;
  }
  section.concept .inner .text-wrap .en p.title:after {
    display: block;
    content: "";
    width: 35px;
    height: 1px;
    background-color: #bcae5c;
    margin-top: 20px;
    margin-left: auto;
    margin-right: auto;
  }
  section.concept .inner .text-wrap .en p.text {
    font-size: 17px;
    line-height: 32px;
    color: #333333;
  }
  section.concept .inner .text-wrap .ja p.title {
    font-size: 20px;
    line-height: 34px;
    letter-spacing: 0.15em;
    margin-bottom: 20px;
    position: relative;
  }
  section.concept .inner .text-wrap .ja p.title:after {
    display: block;
    content: "";
    width: 35px;
    height: 1px;
    background-color: #bcae5c;
    margin-top: 20px;
    margin-left: auto;
    margin-right: auto;
  }
  section.concept .inner .text-wrap .ja p.text {
    font-size: 14px;
    line-height: 32px;
    letter-spacing: 0.08em;
    color: #666666;
	
  }
 section.concept .inner figure:nth-of-type(1) {
    display: block;
    width: 368px;
    height: 368px;
    background-image: url(../images/facebook/1.jpg);
    position: absolute;
    left: 75%;
    top: -23px;
    z-index: 10;
    background-repeat: no-repeat;
  }
  section.concept .inner figure:nth-of-type(2) {
    display: block;
    width: 368px;
    height: 368px;
    background-image: url(../images/facebook/2.jpg);
    position: absolute;
    left: 35%;
    top: -17px;
    z-index: 12;
    background-repeat: no-repeat;
  }
  section.concept .inner figure:nth-of-type(3) {
    display: block;
    width: 368px;
    height: 368px;
    background-image: url(../images/facebook/3.jpg);
position: absolute;
    left: 76%;
    top: 249px;
    z-index: 9;
    background-repeat: no-repeat;
  }
  section.concept .inner figure:nth-of-type(4) {
    display: block;
    width: 368px;
    height: 368px;
    background-image: url(../images/facebook/4.jpg);
    position: absolute;
    left: 56%;
    top: -6px;
    z-index: 11;
    background-repeat: no-repeat;
  }
  section.concept .inner figure:nth-of-type(5) {
display: block;
    width: 368px;
    height: 368px;
    background-image: url(../images/facebook/5.jpg);
position: absolute;
    left: 81%;
    top: 443px;
    z-index: 8;
    background-repeat: no-repeat;
  }
  section.concept .inner figure:nth-of-type(6) {
 display: block;
    width: 368px;
    height: 368px;
    background-image: url(../images/facebook/6.jpg);
    position: absolute;
    left: 67%;
    top: 617px;
    z-index: 7;
    background-repeat: no-repeat;
  }
  section.concept .inner figure:nth-of-type(7) {
    display: block;
    width: 368px;
    height: 368px;
    background-image: url(../images/facebook/12.jpg);
    position: absolute;
    left: 51%;
    top: 717px;
    z-index: 6;
    background-repeat: no-repeat;
}
  
  section.concept .inner figure:nth-of-type(8) {
    display: block;
    width: 368px;
    height: 368px;
    background-image: url(../images/facebook/8.jpg);
position: absolute;
    left: 35%;
    top: 781px;
    z-index: 5;
    background-repeat: no-repeat;
  }
  section.concept .inner figure:nth-of-type(9) {
    display: block;
    width: 368px;
    height: 368px;
    background-image: url(../images/facebook/9.jpg);
 position: absolute;
    left: 16%;
    top: 677px;
    z-index: 4;
    background-repeat: no-repeat;
  }
  section.concept .inner figure:nth-of-type(10) {
    display: block;
    width: 368px;
    height: 368px;
    background-image: url(../images/facebook/10.jpg);
  position: absolute;
    left: -1%;
    top: 462px;
    z-index: 2;
    background-repeat: no-repeat;
  }
  section.concept .inner figure:nth-of-type(11) {
    display: block;
    width: 368px;
    height: 368px;
    background-image: url(../images/facebook/11.jpg);
 position: absolute;
    left: 6%;
    top: 230px;
    z-index: 1;
    background-repeat: no-repeat;
  }
  section.concept .inner figure:nth-of-type(12) {
    display: block;
    width: 368px;
    height: 368px;
    background-image: url(../images/facebook/7.jpg);
    position: absolute;
    left: 14%;
    top: -28px;
    z-index: 12;
    background-repeat: no-repeat;
  }

   section.experiment {
    width: 100%;
    height: 150px;
    background-color: #d3dcdd;
    padding-bottom: 0px;
  }
  section.service {
    width: 100%;
    height: 122px;
    background-color: #ffffff;
    padding-bottom: 0px;
  }
  section.service .inner {
    width: 1200px;
    margin-left: auto;
    margin-right: auto;
  }
  section.service .inner h2 {
    font-size: 40px;
    letter-spacing: 0.2em;
    text-align: center;
    color: #333333;
    border-top: 1px solid #ffffff;
    padding-top: 75px;
    margin-bottom: 100px;
  }
  section.service .inner .row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
  }
    section.service .inner .link1 figure:nth-of-type(1) {
    display: block;
    width: 300px;
    height: 150px;
    background-image: url(../../assets/images/logo/logo2.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: left;
    position: relative;
    position: absolute;
    left: 515px;
    top: 136px;
    z-index: 5;
  }
      section.service .inner .link2 figure:nth-of-type(1) {
display: block;
    width: 215px;
    height: 150px;
    background-image: url(../../assets/images/logo/logo.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: left;
    position: relative;
    position: absolute;
    left: 125px;
    top: 134px;
    z-index: 3;
  }
        section.service .inner .link3 figure:nth-of-type(1) {
display: block;
    width: 200px;
    height: 150px;
    background-image: url(../images/facebook/102.jpg);
    position: absolute;
    left: 833px;
    top: 212px;
    z-index: 5;
  }
  
  section.space {
    width: 100%;
    background-color: #d3dcdd;
    padding-bottom: 100px;
  }
  section.space .inner {
    width: 1200px;
    margin-left: auto;
    margin-right: auto;
  }
  section.space .inner h2 {
    font-size: 40px;
    letter-spacing: 0.2em;
    text-align: center;
    color: #333333;
    border-top: 1px solid #ffffff;
    padding-top: 75px;
    margin-bottom: 100px;
  }
  section.space .inner .row:nth-of-type(1) {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    margin-bottom: 65px;
  }



  section.space .inner .row:nth-of-type(1) .col:nth-of-type(1) .en {
    margin-bottom: 80px;
  }
  section.space .inner .row:nth-of-type(1) .col:nth-of-type(1) .en h3 {
    font-size: 24px;
    letter-spacing: 0.03em;
    line-height: 40px;
    color: #333333;
    margin-top: -8px;
    margin-bottom: 42px;
  }
  section.space .inner .row:nth-of-type(1) .col:nth-of-type(1) .en p {
    font-size: 17px;
    color: #666666;
    line-height: 32px;
    margin-top: -8px;
    margin-bottom: -8px;
  }
  section.space .inner .row:nth-of-type(1) .col:nth-of-type(1) .ja h3 {
    font-size: 20px;
    letter-spacing: 0.15em;
    color: #333333;
    margin-bottom: 45px;
  }
  section.space .inner .row:nth-of-type(1) .col:nth-of-type(1) .ja p {
    font-size: 14px;
    line-height: 32px;
    letter-spacing: 0.08em;
    color: #666666;
    margin-top: -9px;
    margin-bottom: -9px;
  }
  section.space .inner .row:nth-of-type(1) .col:nth-of-type(2) {
    width: 635px;
    height: 533px;
    margin-left: 50px;
    -ms-flex-negative: 0;
        flex-shrink: 0;
  }
  section.space .inner .row:nth-of-type(1) .col:nth-of-type(2) figure {
    width: 100%;
    height: 100%;
    background-image: url("../images/lg/about_space119ce.png?1564208591907");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: left top;
  }
  
#crossfade > img { 
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    color: transparent;
    opacity: 0;
    z-index: 0;
    -webkit-backface-visibility: hidden;
    -webkit-animation: imageAnimation 30s linear infinite 0s;
    -moz-animation: imageAnimation 30s linear infinite 0s;
    -o-animation: imageAnimation 30s linear infinite 0s;
    -ms-animation: imageAnimation 30s linear infinite 0s;
    animation: imageAnimation 30s linear infinite 0s; 
}
#crossfade > img:nth-child(2)  { 

    -webkit-animation-delay: 6s;
    -moz-animation-delay: 6s;
    -o-animation-delay: 6s;
    -ms-animation-delay: 6s;
    animation-delay: 6s; 
}
#crossfade > img:nth-child(3) { 

    -webkit-animation-delay: 12s;
    -moz-animation-delay: 12s;
    -o-animation-delay: 12s;
    -ms-animation-delay: 12s;
    animation-delay: 12s; 
}
#crossfade > img:nth-child(4) { 

    -webkit-animation-delay: 18s;
    -moz-animation-delay: 18s;
    -o-animation-delay: 18s;
    -ms-animation-delay: 18s;
    animation-delay: 18s; 
}
#crossfade > img:nth-child(5) { 

    -webkit-animation-delay: 24s;
    -moz-animation-delay: 24s;
    -o-animation-delay: 24s;
    -ms-animation-delay: 24s;
    animation-delay: 24s; 
}

@-webkit-keyframes imageAnimation { 
    0% { opacity: 0;
    -webkit-animation-timing-function: ease-in; }
    8% { opacity: 1;
         -webkit-animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}

@-moz-keyframes imageAnimation { 
    0% { opacity: 0;
    -moz-animation-timing-function: ease-in; }
    8% { opacity: 1;
         -moz-animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}

@-o-keyframes imageAnimation { 
    0% { opacity: 0;
    -o-animation-timing-function: ease-in; }
    8% { opacity: 1;
         -o-animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}

@-ms-keyframes imageAnimation { 
    0% { opacity: 0;
    -ms-animation-timing-function: ease-in; }
    8% { opacity: 1;
         -ms-animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}

@keyframes imageAnimation { 
    0% { opacity: 0;
    animation-timing-function: ease-in; }
    8% { opacity: 1;
         animation-timing-function: ease-out; }
    17% { opacity: 1 }
    25% { opacity: 0 }
    100% { opacity: 0 }
}

 

  
  
  
  
  
  
  section.space .inner .row:nth-of-type(2) {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  section.space .inner .row:nth-of-type(2) .col {
    width: 580px;
  }
  section.space .inner .row:nth-of-type(2) .col figure {
    width: 100%;
    height: 0px;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: left top;
    margin-bottom: 40px;
  }
  section.space .inner .row:nth-of-type(2) .col .en {
    margin-bottom: 40px;
  }
  section.space .inner .row:nth-of-type(2) .col .en h3 {
    font-size: 24px;
    letter-spacing: 0.05em;
    color: #333333;
    margin-bottom: 30px;
  }
  section.space .inner .row:nth-of-type(2) .col .en ul {
    color: #666666;
    font-size: 16px;
    line-height: 27px;
    margin-top: -6px;
    margin-bottom: -6px;
  }
  section.space .inner .row:nth-of-type(2) .col .ja h3 {
    font-size: 22px;
    letter-spacing: 0.05em;
    color: #333333;
    margin-bottom: 30px;
  }
  section.space .inner .row:nth-of-type(2) .col .ja ul {
    color: #666666;
    font-size: 14px;
    line-height: 27px;
    letter-spacing: 0.05em;
    margin-top: -7px;
    margin-bottom: -7px;
  }
  section.space .inner .row:nth-of-type(2) .col:nth-of-type(1) figure {
    background-image: url("../images/lg/about_space219ce.jpg?1564208591907");
  }
  section.space .inner .row:nth-of-type(2) .col:nth-of-type(1) .en {
    margin-bottom: 40px;
  }
  section.space .inner .row:nth-of-type(2) .col:nth-of-type(1) .en h3 {
    font-size: 24px;
    letter-spacing: 0.05em;
    color: #333333;
    margin-bottom: 30px;
  }
  section.space .inner .row:nth-of-type(2) .col:nth-of-type(1) .en ul {
    color: #666666;
    font-size: 16px;
    line-height: 27px;
    margin-top: -6px;
    margin-bottom: -6px;
  }
  section.space .inner .row:nth-of-type(2) .col:nth-of-type(1) .ja h3 {
    font-size: 22px;
    letter-spacing: 0.05em;
    color: #333333;
    margin-bottom: 30px;
  }
  section.space .inner .row:nth-of-type(2) .col:nth-of-type(1) .ja ul {
    color: #666666;
    font-size: 14px;
    line-height: 27px;
    letter-spacing: 0.05em;
    margin-top: -7px;
    margin-bottom: -7px;
  }
  section.space .inner .row:nth-of-type(2) .col:nth-of-type(2) figure {
    background-image: url("../images/lg/about_space319ce.jpg?1564208591907");
  }
  section.space .inner .row:nth-of-type(2) .col:nth-of-type(2) li span {
    font-size: 12px;
  }
}