@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,100..900;1,100..900&display=swap');
@font-face {
    font-family: "Gmarket Sans";
    font-style: normal;
    font-weight: 700;
    src: local("Gmarket Sans Bold"),local("GmarketSans-Bold"),url("../fonts/GmarketSansBold.woff2") format("woff2"),url("../fonts/GmarketSansBold.woff") format("woff");
    font-display: swap
}
@font-face {
    font-family: "Gmarket Sans";
    font-style: normal;
    font-weight: 500;
    src: local("Gmarket Sans Medium"),local("GmarketSans-Medium"),url("../fonts/GmarketSansMedium.woff2") format("woff2"),url("../fonts/GmarketSansMedium.woff") format("woff");
    font-display: swap
}
@font-face {
    font-family: "Gmarket Sans";
    font-style: normal;
    font-weight: 400;
    src: local("Gmarket Sans Light"),local("GmarketSans-Light"),url("../fonts/GmarketSansLight.woff2") format("woff2"),url("../fonts/GmarketSansLight.woff") format("woff");
    font-display: swap
}
html, body { font-family: 'Raleway', 'Gmarket Sans', sans-serif; font-size: 16px; color: #333; background-color: #F6F6F6; font-weight: 400; line-height: 1.3; word-break: keep-all; word-wrap: break-word; height: 100vh;}
* { padding: 0; margin: 0; box-sizing: border-box; }
ul, ol, li { list-style: none; }
a { text-decoration: none; color: inherit; }
address, em, i { font-style: normal; }
h1, h2, h3, h4, h5, h6, strong, th { font-size: inherit; font-weight: inherit; }
input, button, select { color: inherit; font-family: inherit; font-size: inherit; }
button { background-color: transparent; border: 0; color: inherit; font-family: inherit; font-size: inherit; cursor: pointer; }
table { border-collapse: collapse; border: 0; }
table caption { display: none; }
fieldset { border: 0; }
legend { display: none; }
#wrap { 
    width: 100%; 
    overflow: hidden; 
    position: relative;
}
.wrapper {
    width: 90vw;
    margin: 0 auto;
}
@media screen and (max-width:768px) {
    .wrapper {
        width: auto;
        margin: 0 20px;
    }
}
section {
    overflow: hidden;
}
header {
    position: absolute;
    left: 50%;
    top: 0;
    transform: translate(-50%, 0);
    width: 100%;
    height: 150px;
    content: "";
    z-index: 100;
}
header ul {
    display: flex;
    justify-content: center;
}
header ul li a {
    display: inline-block;
    font-size: 20px;
    font-weight: 700;
    border: 3px solid #F6F6F6;
    border-radius: 30px;
    padding: 10px 20px;
    margin: 49px 7px;
    transition-duration: 100ms;
    transition-timing-function: ease-in-out;
}
header ul li.on a,
header ul li a:hover {
    color: #f69530;
}
header ul li.on a {
    background-color: #f69530;
    color: #FFF;
}
@media screen and (max-width:768px) {
    header {
        height: 100px;
    }
    header ul li a {
        font-size: 15px;
        border-radius: 30px;
        padding: 5px 13px;
        margin: 32px 5px;
    }
}
@media screen and (max-width:450px) {
    header ul li a {
        font-size: 13px;
        border-radius: 30px;
        padding: 5px 10px;
        margin: 32px 0;
    }
}
.container {
    margin-top: 150px;
    height: calc(100vh - 150px);
}
@media screen and (max-width:768px) {
    .container {
        margin-top: 100px;
        height: calc(100vh - 100px);
    }
}
.home {
    position: relative;
}
.home .visual {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.home .visual .scroll {
    width: 15%;
    display: flex;
    align-items: center;
    animation-name: scroll_ani;
    animation-duration: 5s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}
@keyframes scroll_ani {
    0% { transform: translate(0, 0); }
    50% { transform: translate(15px, 0); }
    100% { transform: translate(0, 0); }
}
.home .visual .scroll a {
    position: relative;
    display: block;
    color: #777;
    font-size: 20px;
    font-weight: 700;
    padding-right: 45px;
    opacity: 1;
    cursor: pointer;
}
.home .visual .scroll:hover a {
    opacity: 0.5;
}
.home .visual .scroll a::before {
    position: absolute;
    right: 0;
    top: -4px;
    content: "";
    background-color: #888;
    border-radius: 100%;
    padding: 17px;
}
.home .visual .scroll a::after {
    position: absolute;
    right: 5px;
    top: 1px;
    width: 24px;
    height: 24px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23FFFFFF'%3E%3Cpath d='M633.85-434.5H197.37q-19.15 0-32.33-13.17-13.17-13.18-13.17-32.33t13.17-32.33q13.18-13.17 32.33-13.17h436.48L447.17-712.17q-13.67-13.68-13.29-32.07.38-18.39 14.05-32.06 13.68-12.68 32.07-13.06 18.39-.38 32.07 13.29l264 264q6.71 6.72 9.81 14.92 3.1 8.19 3.1 17.15 0 8.96-3.1 17.15-3.1 8.2-9.81 14.92L511.83-183.7q-12.92 12.92-31.57 12.92t-32.33-12.92q-13.67-13.67-13.67-32.44 0-18.77 13.67-32.45L633.85-434.5Z'/%3E%3C/svg%3E");
    content: "";
}

.home .visual .main {
    position: relative;
    text-align: center;
    width: 70%;
    height: calc(100vh - 150px);
    margin: 0 auto;
    background-color: #EFE7DB;
    border-radius: 30px 30px 0 0;
}
.home .visual .main .main_inner {
    position: absolute;
    top: 40%;
    left: 50%;
    transform: translate(-50%, -47%);
}
.home .visual .main .main_inner img {
    width: 40vw;
    transition-duration: 200ms;
    transition-timing-function: ease-in-out;
}
.home .visual .main .main_inner img:hover {
    transform: scale3d(1.03, 1.03, 1);
}
.home .visual .main .main_inner h2{
    font-size: 20px;
    font-weight: 700;
    color: #555;
    line-height: 1.7;
    white-space: nowrap;
} 


.home .visual .main .main_inner h2 span:hover {
    background-color: #f69530;
    box-shadow: 0 3px 7px rgba(0, 0, 0, 0.2);
}
.home .visual .subtxt {
    position: relative;
    width: 15%;
}
.home .visual .subtxt strong {
    font-size: 0;
    line-height: 0;
}
.swiper .pagination {
    position: absolute;
    text-align: center;
    left: 0;
    bottom: 10vh;
    z-index: 10;
}
.swiper-pagination-bullet-active {
    opacity: 1;
    background-color: #333;
}
@media screen and (max-width:1200px) {
    .home .visual .scroll a {
        font-size: 14px;
        padding-right: 30px;
    }
    .home .visual .scroll a::before {
        padding: 11px;
        right: 1px;
        top: -3px;
    }
    .home .visual .scroll a::after {
        right: 4px;
        top: 1px;
        width: 15px;
        height: 15px;
    }
    .home .visual .main .main_inner h2 {
        font-size: 15px;
    }
}
@media screen and (max-width:768px) {
    .home .visual .main {
        height: calc(100vh - 100px);
    }
    .home .visual .scroll a {
        font-size: 11px;
        padding-right: 20px;
    }
    .home .visual .scroll a::before {
        padding: 7px;
        right: 3px;
        top: 0;
    }
    .home .visual .scroll a::after {
        right: 4px;
        top: 1px;
        width: 12px;
        height: 12px;
    }
    .home .visual .main .main_inner img {
        width: 50vw;
    }
    .home .visual .main .main_inner h2 {
        font-size: 13px;
    }
    @keyframes scroll_ani {
        0% { transform: translate(0, 0); }
        50% { transform: translate(3px, 0); }
        100% { transform: translate(0, 0); }
    }
    .home .visual .main .main_inner h2 span {
        padding: 3px 10px;
    }
}
@media screen and (max-width:450px) {
    .home .visual .scroll a {
        font-size: 0;
        padding-right: 0;
        line-height: 0;
    }
    .home .visual .scroll a::before {
        display: none;
    }
    .home .visual .scroll a::after {
        display: none;
    }
    .home .visual .main .main_inner img {
        width: 63vw;
    }
}

.profile {
    position: relative;
    height: calc(100vh - 150px);
}
.profile .inner {
    position: absolute;
    backdrop-filter: blur(10px) saturate(100%) contrast(60%) brightness(130%);
    border-radius: 30px;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 80vw;
    height: 70vh;
    content: "";
    display: flex;
    justify-content: space-evenly;
    align-items: center;
}

.profile .profile_left {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.profile .profile_left h2 {
    font-size: 0;
    line-height: 0;
}
.profile .profile_left h2::before {
    position: absolute;
    left: -30px;
    top: -10px;
    width: 17vw;
    height: 13vh;
    content: "";
    background: url(../images/profile03.png) no-repeat center center / contain;
    transform: rotate(348deg);
}
.profile .profile_left .poto_inner {
    text-align: center;
    border-radius: 100%;
    overflow: hidden;  
    width: 23vh;
    font-size: 0;
    line-height: 0;
    border: 7px solid #f6f6f6;
    transition-duration: 200ms;
    transition-timing-function: ease-in-out;
}
.profile .profile_left .poto_inner img {
    width: 100%;
}
.profile .profile_left .poto_inner:hover {
    transition-duration: 0.3s;
    box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.1);
    border: 7px solid #ffcaa4;
}
.profile .profile_left .poto .sub_poto img {
    position: absolute;
    content: "";

}
.profile .profile_left .poto .sub_poto img.deco01 {
    left: 9vw;
    top: 10vh;
    width: 38px;
}
img.deco01 { 
    animation-name:animate_deco01; 
    animation-duration:2s; 
    animation-iteration-count:infinite; 
    animation-timing-function:linear 
}
@keyframes animate_deco01 {
    0% { opacity: 1; }
    80% { opacity: 1; }
    90% { opacity: 0; }
    100% { opacity: 1; }
}
.profile .profile_left .poto .sub_poto img.deco02 {
    left: 5vw;
    top: 27vh;
    width: 57px;
}
img.deco02 { 
    animation-name:animate_deco02; 
    animation-duration:3s; 
    animation-iteration-count:infinite; 
    animation-timing-function:linear 
}
@keyframes animate_deco02 {
    0% { opacity: 1; }
    10% { opacity: 0; }
    25% { opacity: 1; }
    100% { opacity: 1; }
}
.profile .profile_left .poto .sub_poto img.deco03 {
    left: 23vw;
    top: 25vh;
    width: 30px;
}
img.deco03 { 
    animation-name:animate_deco03; 
    animation-duration:4s; 
    animation-iteration-count:infinite; 
    animation-timing-function:linear 
}
@keyframes animate_deco03 {
    0% { opacity: 1; }
    50% { opacity: 1; }
    80% { opacity: 0; }
    100% { opacity: 1; }
}
.profile .profile_left .main_txt {
    margin: 10px 0 8vh 0;
    position: relative;
}
.profile .profile_left .main_txt::before {
    position: absolute;
    left: 50%;
    bottom: -7.5vh;
    content: "";
    width: 1px;
    height: 6vh;
    background-color: #b3b3b3;
}
.profile .profile_left .main_txt strong {
    font-size: 2vw;
    color: #333;
    font-weight: 700;
    display: block;
}
.profile .profile_left .main_txt em {
    color: #777;
    font-size: 1vw;
    display: block;
}
.profile .profile_left .sub_txt {
    font-size: 1.3vw;
    font-weight: 500;
    color: #333;
    line-height: 4vh;
}
.profile .profile_left .sub_txt li:hover {
    font-weight: 700;
}
.profile .profile_right .txt_top .education,
.profile .profile_right .txt_bottom .certificate {
    display: flex;
    justify-content: flex-start;
}
.profile .profile_right .txt_top,
.profile .profile_right .txt_bottom {
    margin-bottom: 2vh;
    padding: 3vh 4vw;
    background-color: #f6f6f6;
    border-radius: 30px;
    position: relative;
    transition-duration: 200ms;
    transition-timing-function: ease-in-out;
}
.profile .profile_right .txt_top:hover,
.profile .profile_right .txt_bottom:hover {
    box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.1);
}
.profile .profile_right h3 {
    font-size: 1.3vw;
    font-weight: 500;
}
.profile .profile_right .txt {
    margin-left: 5vw;
}
.profile .profile_right .sub_txt {
    margin-bottom: 1vh;
}
.profile .profile_right .sub_txt p {
    font-size: 1vw;
}
.profile .profile_right .sub_txt span {
    font-size: 1vw;
    font-weight: 500;
}
@media screen and (max-width:768px) {
    .profile .profile_left .poto .sub_poto img.deco03 {
        left: 30vw;
        top: 29vh;
        width: 22px;
    }
    .profile .profile_left .poto .sub_poto img.deco02 {
        left: 4vw;
        top: 31vh;
        width: 42px;
    }
    .profile .profile_left .poto .sub_poto img.deco01 {
        left: 9vw;
        top: 12vh;
        width: 30px;
    }
    .profile {
        height: calc(100vh - 100px);
    }
    .profile .inner {
        width: 90vw;
        height: 77vh;
    }
    .profile .profile_left h2::before {
        left: -10px;
        top: -27px;
        width: 20vw;
        height: 13vh;
    }
    .profile .profile_left .poto {
        width: 20vh;
    }
    .profile .profile_left .main_txt strong {
        font-size: 20px;
    }
    .profile .profile_left .main_txt em {
        font-size: 15px;
    }
    .profile .profile_left .sub_txt {
        font-size: 15px;
    }
    .profile .profile_right h3 {
        font-size: 15px;
        margin-bottom: 3vh;
        color: #cb955c;
        font-weight: 700;
    }
    .profile .profile_right .sub_txt p {
        font-size: 13px;
    }
    .profile .profile_right .sub_txt span {
        font-size: 15px;
    }
    .profile .profile_right .txt {
        margin-left: 0;
    }
    .profile .profile_right .txt_top, .profile .profile_right .txt_bottom {
        padding: 3vh 3vw;
    }
    .profile .profile_right .txt_top::before, .profile .profile_right .txt_bottom::before {
        left: -2.3vh;
        top: 32px;
        width: 4vh;
        height: 4vh;
    }
    .profile .profile_right .txt_top .education, .profile .profile_right .txt_bottom .certificate {
        display: flex;
        justify-content: flex-start;
        flex-direction: column;
        align-items: flex-start;
    }
    .profile .profile_left {
        margin-left: 20px;
        margin-right: 20px;
    }
    .profile .profile_right {
        margin-right: 20px;
    }
}
@media screen and (max-width:450px) {
    .profile .inner {
        width: 90vw;
        height: 80vh;
    }
    .profile .profile_left {
        margin-left: 10px;
        margin-right: 10px;
    }
    .profile .profile_left .poto {
        width: 16vh;
    }
    .profile .profile_left .main_txt strong {
        font-size: 17px;
    }
    .profile .profile_left .main_txt em {
        font-size: 13px;
    }
    .profile .profile_left .sub_txt {
        font-size: 13px;
    }
    .profile .profile_right .sub_txt p {
        font-size: 11px;
    }
    .profile .profile_right .sub_txt span {
        font-size: 13px;
    }
    .profile .profile_right h3 {
        font-size: 13px;
        margin-bottom: 2vh;
    }
    .profile .profile_right {
        margin-right: 10px;
    }
    .profile .profile_right .txt_top, .profile .profile_right .txt_bottom {
        padding: 11px 15px 6px 15px;
        border-radius: 20px;
    }
}
.project1 .bus {
    display: flex;
    justify-content: space-evenly;
    margin: 5vh 0;
    align-items: center;
    height: 66vh;
}
.project1 .bus .bus_txt {
    margin-right: 20px;
}
.project1 .bus .bus_txt h2 {
    font-size: 6vw;
    color: #7DA432;
    font-weight: 700;
    margin-bottom: 2vh;
}
.menu {
    display: flex;
}
.menu li {
    margin-right: 15px;
}
.menu a {
    color: #FFF;
    font-size: 15px;
    font-weight: 500;
    padding: 10px 15px;
    position: relative;
    display: block;
    text-decoration: none;
    text-transform: uppercase;
    background: #555;
    border-radius: 0 20px 20px 20px;
}
.menu a:before {
    content: "";
    position: absolute;
    top: -15px;
    left: -15px;
    bottom: -15px;
    right: -15px;
    background: #555;
    border-radius: 0 20px 20px 20px;
    padding: 10px 15px;
    z-index: -1;
    opacity: 1;
    transform: scale3d(0.8, 0.5, 1);
}
.bus_txt .menu .gr a:hover {
    background-color: #818181;
}
.bus_txt .menu .or a:hover {
    background-color: #7ba526;
}
.menu a:hover::before {
    animation: anim-moema-2 0.3s 0.3s forwards;
}
.bus_txt .menu .gr a:hover {
    transition: background-color 0.1s 0.3s, color 0.1s 0.3s;
    background-color: #818181;
    animation: anim-moema-1 0.3s forwards;
}
.bus_txt .menu .or a:hover {
    transition: background-color 0.1s 0.3s, color 0.1s 0.3s;
    background-color: #7ba526;
    animation: anim-moema-1 0.3s forwards;
}
  

@keyframes anim-moema-2 {
    to {opacity: 0; transform: scale3d(1, 1, 1);}
}
@keyframes anim-moema-1 {
    60% {transform: scale3d(0.8, 0.8, 1);}
    85% {transform: scale3d(1.1, 1.1, 1);}
    100% {transform: scale3d(1, 1, 1);}
}
  
.project1 .bus .bus_txt > strong {
    font-size: 1.6vw;
    display: block;
    margin: 45px 0 10px 0;
    color: #777;
}
.project1 .bus .bus_txt > span {
    font-size: 1.6vw;
    font-weight: 500;
    display: block;
    line-height: 2;
}
.project1 .bus .bus_txt > p {
    font-size: 17px;
    margin-bottom: 30px;
    width: 30vw;
}
.project1 .bus .bus_txt .box {
    display: flex;
    align-items: baseline;
    line-height: 1.8;
}
.project1 .bus .bus_txt .box span {
    font-weight: 500;
    width: 180px;
}
.bus .bus_mockup {
    position: relative;
}
.bus .bus_mockup img {
    display: block;
}
.bus .bus_mockup .device_img {
    position: relative;
    padding: 5vh 3vw;
    z-index: 2;
    width: 40vw;
}
.bus .bus_mockup .bus_img {
    position: absolute;
    left: 4vw;
    bottom: -1vw;
    width: 13vw;
    z-index: 5;
}
.bus_img { 
    animation-name:animate_bus; 
    animation-duration:10s; 
    animation-iteration-count:infinite; 
    animation-timing-function:linear 
}
@keyframes animate_bus {
    0% { transform:translate(0, 0)  }
    50% { transform:translate(20px, 10px)  }
    100% { transform:translate(0, 0)  }
}
.bus .bus_mockup .tree_img {
    position: absolute;
    left: -1vw;
    bottom: 2vw;
    width: 7.5vw;
    z-index: 3;
}
.bus .bus_mockup .cloud1_img {
    position: absolute;
    left: 0;
    top: -6px;
    width: 13vw;
    z-index: 1;
}
.cloud1_img { 
    animation-name:animate_cloud1; 
    animation-duration:10s; 
    animation-iteration-count:infinite; 
    animation-timing-function:linear 
}
@keyframes animate_cloud1 {
    0% { transform:translate(0, 0); opacity: 0; }
    10% { transform:translate(50px, 0); opacity: 1; }
    90% { transform:translate(550px, 0); opacity: 1; }
    100% { transform:translate(600px, 0); opacity: 0; }
}
.bus .bus_mockup .cloud2_img {
    position: absolute;
    left: 5vw;
    top: 18vw;
    width: 5vw;
    z-index: 4;
}
.cloud2_img { 
    animation-name:animate_cloud2; 
    animation-duration:15s; 
    animation-iteration-count:infinite; 
    animation-timing-function:linear 
}
@keyframes animate_cloud2 {
0% { transform:translate(0, 0) }
50% { transform:translate(50px, 0) }
100% { transform:translate(0, 0) }
}
.bus .bus_mockup .shadow {
    position: absolute;
    left: 0;
    bottom: 69px;
    width: 105%;
    height: 7px;
    filter: blur(20px);
    opacity: 0.5;
    z-index: 1;
}
@media screen and (max-width:1440px) {
    .project1 .bus .bus_txt > strong {
        margin: 33px 0 7px 0;
    }
    .project1 .bus .bus_txt > p {
        margin-bottom: 20px;
    }
    .project1 .bus .bus_txt .box span {
        width: 145px;
    }
}
@media screen and (max-width:1000px) {
    .project1 .bus {
        margin: 0;
    }
    
    .project1 .bus .bus_txt h2 {
        font-size: 4vw;
        margin-bottom: 1vh;
    }
    .menu li {
        margin-right: 5px;
    }
    .menu a {
        font-size: 13px;
    }
    .project1 .bus .bus_txt > strong {
        margin: 25px 0 5px 0;
    }
    .project1 .bus .bus_txt > p {
        font-size: 13px;
        margin-bottom: 15px;
        width: 33vw;
    }
    .project1 .bus .bus_txt .box {
        display: flex;
        align-items: baseline;
        line-height: 1.8;
        font-size: 15px;
    }
    .project1 .bus .bus_txt .box span {
        font-weight: 500;
        width: 133px;
    }
    .bus .bus_mockup .device_img {
        padding: 2vw;
    }
}
@media screen and (max-width:768px) {
    .project1 .bus .bus_txt h2 {
        font-size: 5vw;
        margin-bottom: 1vh;
        text-align: center;
    }
    .project1 .bus {
        display: flex;
        justify-content: space-between;
        margin: 0;
        align-items: center;
        height: 100%;
        flex-direction: column;
    }
    .project1 .bus .bus_txt > strong {
        font-size: 15px;
        text-align: center;
    }
    .project1 .bus .bus_txt > span {
        font-size: 15px;
        text-align: center;
    }
    .project1 .bus .bus_txt > p {
        width: 100%;
        text-align: center;
    }
    .project1 .bus .bus_txt .box {
        font-size: 13px;
    }
    .project1 .bus .bus_txt .box span {
        width: 100px;
    }
    .menu {
        display: flex;
        justify-content: center;
    }
    .menu a {
        padding: 8px 12px;
        border-radius: 20px;
    }
    .menu a:before {
        border-radius: 20px;
        padding: 8px 12px;
    }
    .bus .bus_mockup .device_img {
        padding: 3vw;
        width: 50vw;
    }
    .bus .bus_mockup .tree_img {
        left: -3vw;
        bottom: 2vw;
        width: 9vw;
    }
    .project1 .bus .bus_txt {
        margin-bottom: 30px;
    }
}

.wj_link {
    cursor: url("data:image/svg+xml,%3Csvg width='70' height='70' viewBox='0 0 70 70' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg filter='url(%23filter0_b_0_1)'%3E%3Ccircle cx='35' cy='35' r='35' transform='matrix(-1 0 0 1 70 0)' fill='%2367BC5A'/%3E%3C/g%3E%3Cpath d='M19.3576 22.08V23.775H7.35758V22.08H12.0676V21.24H14.6476V22.08H19.3576ZM14.6176 28.245H19.8376V29.985H6.87758V28.245H12.0976V27.765C9.50258 27.645 7.71758 27.12 7.71758 25.935C7.71758 24.57 10.0876 24.075 13.3576 24.075C16.6276 24.075 18.9976 24.57 18.9976 25.935C18.9976 27.12 17.2126 27.645 14.6176 27.765V28.245ZM10.2526 25.935C10.2526 26.205 11.5576 26.295 13.3576 26.295C15.1576 26.295 16.4626 26.205 16.4626 25.935C16.4626 25.665 15.1576 25.575 13.3576 25.575C11.5576 25.575 10.2526 25.665 10.2526 25.935ZM7.62758 34.56V30.48H19.0876V34.56H7.62758ZM10.1026 32.16V32.88H16.6126V32.16H10.1026ZM31.7613 21.75H34.0563V34.56H31.7613V21.75ZM28.7163 26.46V21.81H30.9813V34.335H28.7163V28.86H27.7863V26.46H28.7163ZM27.1863 24.27V31.56C27.5463 31.485 27.8613 31.395 28.1313 31.29V33.48C27.3663 33.825 26.1513 33.96 25.0263 33.96H21.2163V31.74H21.9213V24.27H21.3213V22.05H27.8163V24.27H27.1863ZM24.1413 24.27V31.74H24.9663V24.27H24.1413ZM48.125 21.75V34.56H45.59V21.75H48.125ZM40.145 21.9C42.56 21.9 44.165 23.79 44.165 28.005C44.165 32.22 42.56 34.11 40.145 34.11C37.73 34.11 36.11 32.22 36.11 28.005C36.11 23.79 37.73 21.9 40.145 21.9ZM40.145 24.225C39.29 24.225 38.615 25.14 38.615 28.005C38.615 30.885 39.29 31.785 40.145 31.785C40.985 31.785 41.66 30.885 41.66 28.005C41.66 25.14 40.985 24.225 40.145 24.225ZM60.0187 21.75H62.5537V34.56H60.0187V21.75ZM56.1937 24.375C56.1637 25.53 56.0587 26.595 55.8787 27.57L59.5987 32.4L57.5887 33.9L55.0087 30.39C53.9737 32.67 52.3387 33.945 50.3887 33.96V31.41C52.2637 31.2 53.5537 28.485 53.6437 24.375H50.7487V22.05H58.9387V24.375H56.1937ZM20.4076 41.43V43.89H18.9076V49.56H16.3726V36.75H18.9076V41.43H20.4076ZM12.2776 40.815V37.05H14.7676V48.96H7.31258V37.05H9.80258V40.815H12.2776ZM9.80258 46.635H12.2776V43.125H9.80258V46.635ZM29.0763 46.8H34.2663V49.11H21.3063V46.8H26.4963V45.36H22.0263V40.14H31.0563V39.27H21.9963V37.05H33.5613V42.255H24.5313V43.14H33.7113V45.36H29.0763V46.8ZM49.265 41.43V43.89H47.765V49.56H45.23V36.75H47.765V41.43H49.265ZM36.095 39.36V37.05H43.34V40.515C43.34 45.72 40.535 48.96 36.095 48.96V46.56C39.17 46.53 40.76 44.265 40.76 40.515V39.36H36.095ZM62.5537 36.75V49.56H60.0187V36.75H62.5537ZM58.0387 37.05V40.515C58.0387 45.72 55.1437 48.96 50.6587 48.96V46.56C53.7637 46.53 55.4437 44.22 55.4437 40.515V39.36H50.6587V37.05H58.0387Z' fill='white'/%3E%3Cdefs%3E%3Cfilter id='filter0_b_0_1' x='-12' y='-12' width='94' height='94' filterUnits='userSpaceOnUse' color-interpolation-filters='sRGB'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeGaussianBlur in='BackgroundImageFix' stdDeviation='6'/%3E%3CfeComposite in2='SourceAlpha' operator='in' result='effect1_backgroundBlur_0_1'/%3E%3CfeBlend mode='normal' in='SourceGraphic' in2='effect1_backgroundBlur_0_1' result='shape'/%3E%3C/filter%3E%3C/defs%3E%3C/svg%3E%0A"), auto;
}
.kid_link {
    cursor: url("data:image/svg+xml,%3Csvg width='70' height='70' viewBox='0 0 70 70' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg filter='url(%23filter0_b_0_1)'%3E%3Ccircle cx='35' cy='35' r='35' transform='matrix(-1 0 0 1 70 0)' fill='%23F4BA22'/%3E%3C/g%3E%3Cpath d='M19.3576 22.08V23.775H7.35758V22.08H12.0676V21.24H14.6476V22.08H19.3576ZM14.6176 28.245H19.8376V29.985H6.87758V28.245H12.0976V27.765C9.50258 27.645 7.71758 27.12 7.71758 25.935C7.71758 24.57 10.0876 24.075 13.3576 24.075C16.6276 24.075 18.9976 24.57 18.9976 25.935C18.9976 27.12 17.2126 27.645 14.6176 27.765V28.245ZM10.2526 25.935C10.2526 26.205 11.5576 26.295 13.3576 26.295C15.1576 26.295 16.4626 26.205 16.4626 25.935C16.4626 25.665 15.1576 25.575 13.3576 25.575C11.5576 25.575 10.2526 25.665 10.2526 25.935ZM7.62758 34.56V30.48H19.0876V34.56H7.62758ZM10.1026 32.16V32.88H16.6126V32.16H10.1026ZM31.7613 21.75H34.0563V34.56H31.7613V21.75ZM28.7163 26.46V21.81H30.9813V34.335H28.7163V28.86H27.7863V26.46H28.7163ZM27.1863 24.27V31.56C27.5463 31.485 27.8613 31.395 28.1313 31.29V33.48C27.3663 33.825 26.1513 33.96 25.0263 33.96H21.2163V31.74H21.9213V24.27H21.3213V22.05H27.8163V24.27H27.1863ZM24.1413 24.27V31.74H24.9663V24.27H24.1413ZM48.125 21.75V34.56H45.59V21.75H48.125ZM40.145 21.9C42.56 21.9 44.165 23.79 44.165 28.005C44.165 32.22 42.56 34.11 40.145 34.11C37.73 34.11 36.11 32.22 36.11 28.005C36.11 23.79 37.73 21.9 40.145 21.9ZM40.145 24.225C39.29 24.225 38.615 25.14 38.615 28.005C38.615 30.885 39.29 31.785 40.145 31.785C40.985 31.785 41.66 30.885 41.66 28.005C41.66 25.14 40.985 24.225 40.145 24.225ZM60.0187 21.75H62.5537V34.56H60.0187V21.75ZM56.1937 24.375C56.1637 25.53 56.0587 26.595 55.8787 27.57L59.5987 32.4L57.5887 33.9L55.0087 30.39C53.9737 32.67 52.3387 33.945 50.3887 33.96V31.41C52.2637 31.2 53.5537 28.485 53.6437 24.375H50.7487V22.05H58.9387V24.375H56.1937ZM20.4076 41.43V43.89H18.9076V49.56H16.3726V36.75H18.9076V41.43H20.4076ZM12.2776 40.815V37.05H14.7676V48.96H7.31258V37.05H9.80258V40.815H12.2776ZM9.80258 46.635H12.2776V43.125H9.80258V46.635ZM29.0763 46.8H34.2663V49.11H21.3063V46.8H26.4963V45.36H22.0263V40.14H31.0563V39.27H21.9963V37.05H33.5613V42.255H24.5313V43.14H33.7113V45.36H29.0763V46.8ZM49.265 41.43V43.89H47.765V49.56H45.23V36.75H47.765V41.43H49.265ZM36.095 39.36V37.05H43.34V40.515C43.34 45.72 40.535 48.96 36.095 48.96V46.56C39.17 46.53 40.76 44.265 40.76 40.515V39.36H36.095ZM62.5537 36.75V49.56H60.0187V36.75H62.5537ZM58.0387 37.05V40.515C58.0387 45.72 55.1437 48.96 50.6587 48.96V46.56C53.7637 46.53 55.4437 44.22 55.4437 40.515V39.36H50.6587V37.05H58.0387Z' fill='white'/%3E%3Cdefs%3E%3Cfilter id='filter0_b_0_1' x='-12' y='-12' width='94' height='94' filterUnits='userSpaceOnUse' color-interpolation-filters='sRGB'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeGaussianBlur in='BackgroundImageFix' stdDeviation='6'/%3E%3CfeComposite in2='SourceAlpha' operator='in' result='effect1_backgroundBlur_0_1'/%3E%3CfeBlend mode='normal' in='SourceGraphic' in2='effect1_backgroundBlur_0_1' result='shape'/%3E%3C/filter%3E%3C/defs%3E%3C/svg%3E%0A"), auto;
}
.eleven_link {
    cursor: url("data:image/svg+xml,%3Csvg width='70' height='70' viewBox='0 0 70 70' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg filter='url(%23filter0_b_0_1)'%3E%3Ccircle cx='35' cy='35' r='35' transform='matrix(-1 0 0 1 70 0)' fill='%2331A15D'/%3E%3C/g%3E%3Cpath d='M19.3576 22.08V23.775H7.35758V22.08H12.0676V21.24H14.6476V22.08H19.3576ZM14.6176 28.245H19.8376V29.985H6.87758V28.245H12.0976V27.765C9.50258 27.645 7.71758 27.12 7.71758 25.935C7.71758 24.57 10.0876 24.075 13.3576 24.075C16.6276 24.075 18.9976 24.57 18.9976 25.935C18.9976 27.12 17.2126 27.645 14.6176 27.765V28.245ZM10.2526 25.935C10.2526 26.205 11.5576 26.295 13.3576 26.295C15.1576 26.295 16.4626 26.205 16.4626 25.935C16.4626 25.665 15.1576 25.575 13.3576 25.575C11.5576 25.575 10.2526 25.665 10.2526 25.935ZM7.62758 34.56V30.48H19.0876V34.56H7.62758ZM10.1026 32.16V32.88H16.6126V32.16H10.1026ZM31.7613 21.75H34.0563V34.56H31.7613V21.75ZM28.7163 26.46V21.81H30.9813V34.335H28.7163V28.86H27.7863V26.46H28.7163ZM27.1863 24.27V31.56C27.5463 31.485 27.8613 31.395 28.1313 31.29V33.48C27.3663 33.825 26.1513 33.96 25.0263 33.96H21.2163V31.74H21.9213V24.27H21.3213V22.05H27.8163V24.27H27.1863ZM24.1413 24.27V31.74H24.9663V24.27H24.1413ZM48.125 21.75V34.56H45.59V21.75H48.125ZM40.145 21.9C42.56 21.9 44.165 23.79 44.165 28.005C44.165 32.22 42.56 34.11 40.145 34.11C37.73 34.11 36.11 32.22 36.11 28.005C36.11 23.79 37.73 21.9 40.145 21.9ZM40.145 24.225C39.29 24.225 38.615 25.14 38.615 28.005C38.615 30.885 39.29 31.785 40.145 31.785C40.985 31.785 41.66 30.885 41.66 28.005C41.66 25.14 40.985 24.225 40.145 24.225ZM60.0187 21.75H62.5537V34.56H60.0187V21.75ZM56.1937 24.375C56.1637 25.53 56.0587 26.595 55.8787 27.57L59.5987 32.4L57.5887 33.9L55.0087 30.39C53.9737 32.67 52.3387 33.945 50.3887 33.96V31.41C52.2637 31.2 53.5537 28.485 53.6437 24.375H50.7487V22.05H58.9387V24.375H56.1937ZM20.4076 41.43V43.89H18.9076V49.56H16.3726V36.75H18.9076V41.43H20.4076ZM12.2776 40.815V37.05H14.7676V48.96H7.31258V37.05H9.80258V40.815H12.2776ZM9.80258 46.635H12.2776V43.125H9.80258V46.635ZM29.0763 46.8H34.2663V49.11H21.3063V46.8H26.4963V45.36H22.0263V40.14H31.0563V39.27H21.9963V37.05H33.5613V42.255H24.5313V43.14H33.7113V45.36H29.0763V46.8ZM49.265 41.43V43.89H47.765V49.56H45.23V36.75H47.765V41.43H49.265ZM36.095 39.36V37.05H43.34V40.515C43.34 45.72 40.535 48.96 36.095 48.96V46.56C39.17 46.53 40.76 44.265 40.76 40.515V39.36H36.095ZM62.5537 36.75V49.56H60.0187V36.75H62.5537ZM58.0387 37.05V40.515C58.0387 45.72 55.1437 48.96 50.6587 48.96V46.56C53.7637 46.53 55.4437 44.22 55.4437 40.515V39.36H50.6587V37.05H58.0387Z' fill='white'/%3E%3Cdefs%3E%3Cfilter id='filter0_b_0_1' x='-12' y='-12' width='94' height='94' filterUnits='userSpaceOnUse' color-interpolation-filters='sRGB'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeGaussianBlur in='BackgroundImageFix' stdDeviation='6'/%3E%3CfeComposite in2='SourceAlpha' operator='in' result='effect1_backgroundBlur_0_1'/%3E%3CfeBlend mode='normal' in='SourceGraphic' in2='effect1_backgroundBlur_0_1' result='shape'/%3E%3C/filter%3E%3C/defs%3E%3C/svg%3E%0A"), auto;
}
.project2 .kid {
    display: flex;
    justify-content: space-around;
    margin: 5vh 0;
    align-items: center;
    height: 66vh;
}
.project2 .kid .kid_txt {
    margin-right: 20px;
}
.project2 .kid .kid_txt h2 {
    font-size: 4vw;
    color: #e3ab4e;
    font-weight: 700;
    margin-bottom: 3vh;
    line-height: 1;
}
.kid_txt .menu .gr a:hover {
    background-color: #92959b;
}
.kid_txt .menu .or a:hover {
    background-color: #7b97e6;
}
.kid_txt .menu .gr a:hover {
    transition: background-color 0.1s 0.3s, color 0.1s 0.3s;
    background-color: #92959b;
    animation: anim-moema-1 0.3s forwards;
}
.kid_txt .menu .or a:hover {
    transition: background-color 0.1s 0.3s, color 0.1s 0.3s;
    background-color: #7b97e6;
    animation: anim-moema-1 0.3s forwards;
}
.project2 .kid .kid_txt > strong {
    font-size: 1.6vw;
    display: block;
    color: #777;
    margin: 45px 0 10px 0;
}
.project2 .kid .kid_txt > span {
    font-size: 1.6vw;
    font-weight: 500;
    display: block;
    line-height: 2;
}
.project2 .kid .kid_txt > p {
    font-size: 17px;
    margin-bottom: 30px;
    width: 30vw;
}
.project2 .kid .kid_txt .box {
    display: flex;
    line-height: 1.8;
    align-items: baseline;
}
.project2 .kid .kid_txt .box span {
    font-weight: 500;
    width: 180px;
}
.project2 .kid .kid_txt .box .line {
    line-height: 1.5;
}
.kid .kid_mockup {
    position: relative; 
}
.kid .kid_mockup img {
    display: block;
}
.kid .kid_mockup .device_img {
    position: relative;
    width: 40vw;
    z-index: 2;
}
.kid .kid_mockup .pink_img {
    position: absolute;
    left: -5vw;
    bottom: -1vw;
    width: 8vw;
    z-index: 3;
}
.kid .kid_mockup .pink_balloon2_img {
    position: absolute;
    left: -7.7vw;
    bottom: 0.8vw;
    width: 6vw;
    z-index: 5;
}
.kid .kid_mockup .pink_balloon2_img { 
    animation-name:animate_pink_balloon; 
    animation-duration:3s; 
    animation-iteration-count:infinite; 
    animation-timing-function:linear 
}
@keyframes animate_pink_balloon {
    0% { transform:translate(0, 0)  }
    50% { transform:translate(0, 3px)  }
    100% { transform:translate(0, 0)  }
}
.kid .kid_mockup .pink_letter_img {
    position: absolute;
    left: -3vw;
    top: 13vw;
    width: 2.3vw;
    z-index: 7;
}
.kid .kid_mockup .pink_letter_img { 
    animation-name:animate_blue_balloon; 
    animation-duration:2s; 
    animation-iteration-count:infinite; 
    animation-timing-function:linear 
}
@keyframes animate_pink_letter {
    0% { transform:translate(0, 0)  }
    50% { transform:translate(0, 5px)  }
    100% { transform:translate(0, 0)  }
}
.kid .kid_mockup .pink_letterWings_img {
    position: absolute;
    left: -4vw;
    top: 13vw;
    width: 4vw;
    z-index: 6;
}
.kid .kid_mockup .pink_letterWings_img { 
    animation-name:animate_pink_letterWings; 
    animation-duration:2s; 
    animation-iteration-count:infinite; 
    animation-timing-function:linear 
}
@keyframes animate_pink_letterWings {
    0% { transform:translate(0, 0)  }
    50% { transform:translate(0, 5px)  }
    100% { transform:translate(0, 0)  }
}
.kid .kid_mockup .blue_img {
    position: absolute;
    right: -1vw;
    bottom: -1vw;
    width: 11vw;
    z-index: 5;
}
.kid .kid_mockup .blue_balloon2_img {
    position: absolute;
    right: -4vw;
    bottom: 3.7vw;
    width: 6vw;
    z-index: 5;
}
.kid .kid_mockup .blue_balloon2_img { 
    animation-name:animate_blue_balloon; 
    animation-duration:3s; 
    animation-iteration-count:infinite; 
    animation-timing-function:linear 
}
@keyframes animate_blue_balloon {
    0% { transform:translate(0, 0)  }
    50% { transform:translate(0, 3px)  }
    100% { transform:translate(0, 0)  }
}
.kid .kid_mockup .blue_balloon1_img {
    position: absolute;
    right: -1.9vw;
    bottom: 1vw;
    width: 4vw;
    z-index: 4;
}
.kid .kid_mockup .blue_balloon1_img { 
    animation-name:animate_blue_balloon1; 
    animation-duration:7s; 
    animation-iteration-count:infinite; 
    animation-timing-function:linear;
    animation-delay: 2s;
}
@keyframes animate_blue_balloon1 {
    0% { transform:translate(0, 0); opacity: 0; }
    10% { transform:translate(0, -30px); opacity: 1; }
    90% { transform:translate(0, -50px,); opacity: 1; }
    100% { transform:translate(0, -90px); opacity: 0; }
}
.kid .kid_mockup .blue_letter { 
    animation-name:animate_blue_letters; 
    animation-duration:7s; 
    animation-iteration-count:infinite; 
    animation-timing-function:linear;
    z-index: 100;
    position: absolute;
    top: 0;
    right: 0;
}
@keyframes animate_blue_letters {
    0% { transform:translate(0, 0)  }
    50% { transform:translate(15px, 0)  }
    100% { transform:translate(0, 0)  }
}
.kid .kid_mockup .blue_letter_img {
    position: absolute;
    right: 6vw;
    top: -1vw;
    width: 3vw;
    z-index: 7;
}
.kid .kid_mockup .blue_letter_img { 
    animation-name:animate_blue_letter; 
    animation-duration:4s; 
    animation-iteration-count:infinite; 
    animation-timing-function:linear;
}
@keyframes animate_blue_letter {
    0% { transform:translate(0, 0)  }
    50% { transform:translate(0, 3px)  }
    100% { transform:translate(0, 0)  }
}
.kid .kid_mockup .blue_letterWings_img {
    position: absolute;
    right: 5vw;
    top: -1vw;
    width: 5vw;
    z-index: 6;
}
.kid .kid_mockup .blue_letterWings_img { 
    animation-name:animate_blue_letterWings; 
    animation-duration:2s; 
    animation-iteration-count:infinite; 
    animation-timing-function:linear 
}
@keyframes animate_blue_letterWings {
    0% { transform:translate(0, 0)  }
    50% { transform:translate(0, 4px)  }
    100% { transform:translate(0, 0)  }
}
@media screen and (max-width:1440px) {
    .project2 .kid .kid_txt .box span {
        font-weight: 500;
        width: 140px;
    }
    .project2 .kid .kid_txt > p {
        font-size: 15px;
    }
}
@media screen and (max-width:1200px) {
    .project2 .kid {
        margin: 0;
    }
    .kid .kid_mockup {
        margin-left: 3vw;
    }
    .project2 .kid .kid_txt h2 {
        margin-bottom: 2vh;
    }
    .project2 .kid .kid_txt > strong {
        margin: 25px 0 5px 0;
    }
    .project2 .kid .kid_txt > p {
        font-size: 13px;
        margin-bottom: 15px;
        width: 40vw;
    }
    .project2 .kid .kid_txt .box {
        display: flex;
        line-height: 1.8;
        font-size: 13px;
        align-items: baseline;
    }
    .project2 .kid .kid_txt .box span {
        width: 100px;
    }
}
@media screen and (max-width:768px) {
    .project2 .kid {
        display: flex;
        margin: 5vh 0;
        align-items: center;
        height: 90vh;
        flex-direction: column;
        justify-content: flex-start;
    }
    .project2 .kid .kid_txt {
        text-align: center;
        margin: 0 0 30px 0;
    }.project2 .kid .kid_txt h2 {
        font-size: 5vw;
    }
    .project2 .kid .kid_txt > strong {
        margin: 20px 0 3px 0;
        font-size: 15px;
    }
    .project2 .kid .kid_txt > span {
        font-size: 15px;
    }
    .project2 .kid .kid_txt > p {
        font-size: 13px;
        margin-bottom: 13px;
        width: 80vw;
    }
    .project2 .kid .kid_txt .box {
        display: flex;
        line-height: 1.8;
        font-size: 13px;
        align-items: baseline;
        justify-content: center;
    }
    .project2 .kid .kid_txt .box span {
        text-align: right;
        width: 50%;
        margin-right: 20px;
    }
    .project2 .kid .kid_txt .box strong {
        width: 50%;
        text-align: left;
    }
    .kid .kid_mockup .device_img {
        width: 58vw;
    }
}
.project3 .eleven {
    display: flex;
    justify-content: space-around;
    margin: 2vh 0 5vh 0;
    align-items: center;
    height: 66vh;
}
.project3 .eleven .eleven_txt {
    margin: 0 3vw 0 5vw;
}
.project3 .eleven .eleven_txt h2 {
    font-size: 4vw;
    color: #008c37;;
    font-weight: 700;
    margin-bottom: 30px;
    line-height: 1;
}
.eleven_txt .menu .gr a:hover {
    background-color: #46aa6e;
}
.eleven_txt .menu .or a:hover {
    background-color: #f2761d;
}
.eleven_txt .menu .gr a:hover {
    transition: background-color 0.1s 0.3s, color 0.1s 0.3s;
    background-color: #46aa6e;
    animation: anim-moema-1 0.3s forwards;
}
.eleven_txt .menu .or a:hover {
    transition: background-color 0.1s 0.3s, color 0.1s 0.3s;
    background-color: #f2761d;
    animation: anim-moema-1 0.3s forwards;
}

.project3 .eleven .eleven_txt .eleven_btn {
    display: flex;
}
.project3 .eleven .eleven_txt > strong {
    font-size: 23px;
    display: block;
    margin: 45px 0 10px 0;
    color: #777;
}
.project3 .eleven .eleven_txt > span {
    font-size: 25px;
    font-weight: 500;
    display: block;
    line-height: 2;
}
.project3 .eleven .eleven_txt > p {
    font-size: 18px;
    margin-bottom: 30px;
    width: 30vw;
}
.project3 .eleven .eleven_txt .box {
    display: flex;
    align-items: baseline;
    line-height: 1.8;
}
.project3 .eleven .eleven_txt .box span {
    font-weight: 500;
    width: 180px;
}
.project3 .eleven .eleven_txt .box .line {
    line-height: 1.5;
}
.eleven .eleven_mockup {
    margin-top: 100px;
}
.eleven .eleven_mockup a {
    display: block;
    width: 80vw;
    padding: 2vw;
}
.eleven .eleven_mockup a img{
    width: 100%;
}
@media screen and (max-width:1440px)  {
    .project3 .eleven .eleven_txt {
        margin: 0 2vw 0 3vw;
    }
    .project3 .eleven .eleven_txt h2 {
        margin-bottom: 20px;

    }
    .project3 .eleven .eleven_txt > strong {
        margin: 35px 0 7px 0;
        font-size: 20px;
    }
    .project3 .eleven .eleven_txt > p {
        font-size: 15px;
        margin-bottom: 10px;
        width: 35vw;
    }
    .project3 .eleven .eleven_txt .box span  {
        width: 135px;
    }
    .project3 .eleven .eleven_txt .box strong {
        width: 232px;
    }
    .project3 .eleven .eleven_txt > span {
        font-size: 21px;
    }
}
@media screen and (max-width:1000px) {
    .project3 .eleven .eleven_txt > strong {
        margin: 30px 0 0 0;
        font-size: 18px;
    }
    .project3 .eleven .eleven_txt > span {
        font-size: 18px;
    }
    .project3 .eleven .eleven_txt > p {
        font-size: 13px;
        margin-bottom: 10px;
    }
    .project3 .eleven .eleven_txt .box {
        font-size: 15px;
    }
    .eleven .eleven_mockup a {
        width: 86vw;
    }
    .project3 .eleven .eleven_txt {
        margin: 0;
    }
}
@media screen and (max-width:768px) {
    .project3 .eleven {
        display: flex;
        justify-content: flex-start;
        margin: 0 0 5vh 0;
        align-items: center;
        height: 90vh;
        flex-direction: column;
    }
    .project3 .eleven .eleven_txt {
        text-align: center;
        margin: 0 0 3vh 0;
    }
    .project3 .eleven .eleven_txt h2 {
        font-size: 5vw;
        color: #008c37;
        font-weight: 700;
        margin-bottom: 15px;
        line-height: 1;
    }
    .project3 .eleven .eleven_txt > strong {
        margin: 20px 0 0 0;
        font-size: 15px;
    }
    .project3 .eleven .eleven_txt > span {
        font-size: 16px;
    }
    .project3 .eleven .eleven_txt > p {
        font-size: 13px;
        margin-bottom: 15px;
        width: 80vw;
    }
    .project3 .eleven .eleven_txt .box {
        justify-content: center;
    }
    .project3 .eleven .eleven_txt .box span {
        width: 50%;
        text-align: right;
        margin-right: 10px;
    }
    .project3 .eleven .eleven_txt .box strong {
        width: 50%;
        text-align: left;
    }
    .eleven .eleven_mockup a img {
        width: 100%;
        margin-left: 21vw;
    }
    .eleven .eleven_mockup a {
        width: 100vw;
    }
}
.end {
    position: relative;
}
.end .end_inner {
    position: relative;
    text-align: center;
    width: 80%;
    height: calc(100vh - 150px);
    margin: 0 auto;
    background-color: #EFE7DB;
}
.end .end_inner img {
    max-width: 900px;
    width: 70vw;
    margin: 150px 0 0 0;
}
.end .end_inner img.main2_scroll{
    animation-name:animate_ex2; 
    animation-duration:5s; 
    animation-iteration-count:infinite; 
    animation-timing-function:linear; 
}
@keyframes animate_ex2{
0% {transform:translate(0, 0);}
50% {transform:translate(0, -20px);}
100% {transform:translate(0, 0);}
}
.end .end_inner h2 {
    font-size: 23px;
    font-weight: 700;
    color: #333;
}
@media screen and (max-width:1000px)  {

}




