* {
    margin: 0;
    padding: 0;
}

@font-face {
    font-family: "SourceHanSans-Light";
    src: url("../font/sourcehansans/sourcehansans-light.otf") format("opentype");
}

@font-face {
    font-family: "SourceHanSans-Medium";
    src: url("../font/sourcehansans/sourcehansans-medium.otf") format("opentype");

}

@font-face {
    font-family: "FuturaBT-Light";
    src: url("../font/futura/0/futuralight-regular.otf") format("opentype");
}

@font-face {
    font-family: "Futura-Medium";
    src: url("../font/futura/1/futuramedium.otf") format("opentype");
}

html {
    font-size: 10px;
    height: 100%;
}

#footer {
    background-color: rgba(255, 255, 255, 0);
    color: #141823;
    height: 45px;
    margin-top: auto;

}

#footer p {
    text-align: center;
    padding-top: 9px !important;
    line-height: 2.1rem;
}

#footer img {
    opacity: 0.7;
    width: 12px;
    margin-right: 0.2%;
}

body #wrapper {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

body {
    background-color: #ffffff;
    font-family: 'FuturaBT-Light', "SourceHanSans-Light";
    color: #141823;
    width: 100%;
    height: 100%;
}

nav {
    background-color: #ffffff;
}

#tabcontrol,
#tabcontrol_e {
    display: flex;
    overflow: hidden;
    background-color: #ffffff;
    width: 100%;
    margin: 0 auto;
    padding: 40px 0;
    position: fixed;
    top: 0;
    left: 0;
    transition: .4s;
    z-index: 100;

}

.is-animation {
    padding: 7px 0 !important;
    background-color: rgba(0, 0, 0, 0.7) !important;
    /*    background-color: rgba(255,255,255,0.7) !important;*/
    transition: .4s;

}

.is-animation a {
    color: #ffffff !important;
    transition: .4s;
}

.is-animation img {
    width: 11% !important;
    transition: .4s;
}

#tabcontrol li a {

    text-decoration: none;
    font-size: 1.8rem;
    margin-left: 30px;
    padding: 5px 10px;
    display: block;
    color: #444444;
    border-bottom: solid thin transparent;
}

#tabcontrol_e li a {

    text-decoration: none;
    font-size: 1.6rem;
    margin-left: 8px;
    padding: 5px 8px;
    display: block;
    color: #444444;
    border-bottom: solid thin transparent;
}


#tabcontrol .border a:hover,
#tabcontrol_e .border a:hover {
    border-bottom: solid thin #64bae9;
    transition: 1s;
}

#tabcontrol li,
#tabcontrol_e li {
    list-style: none;
}

#tabcontrol .logo,
#tabcontrol_e .logo {
    width: 12%;
    margin: 0;
    padding: 0;
    margin-right: 2.2%;

}

#tabcontrol li img,
#tabcontrol_e li img {
    position: absolute;
    top: 16%;
    left: 1%;
    width: 15%;
}

h1 {
    font-weight: normal;
    font-size: 2rem;
    margin-bottom: 15px;
    border-bottom: solid thin #64bae9;
}

h2 {
    font-weight: normal;
    font-size: 1.8rem;
    padding-left: 5px;
    margin-bottom: 15px;
    border-left: solid thick #64bae9;
}

h3 {
    font-weight: normal;
    font-size: 1.8rem;

}

h4 {
    font-weight: normal;
    font-size: 1.8rem;
    border-bottom: solid thin #555555;
}

h5 {
    font-weight: normal;
    font-size: 1.6rem;
}

p {
    margin-bottom: 36px;
    font-size: 1.6rem;
    line-height: 3rem;
}

.emp {
    font-size: 2rem;
    /*    color: #64bae9;*/
    color: #1b7dc2;
}

.emp2 {
    font-size: 1.8rem;
    color: #1b7dc2;
    margin-bottom: 10px;
}

.emp3 {
    font-family: "Futura-Medium", "SourceHanSans-Medium";
    font-size: 1.8rem;
}

.it{
    font-style: italic;
}

.refer {
    font-size: 1.3rem;
    line-height: 2.3rem;
}

.refer a,
.japan10 a,
.gisman1 a,
.america_p1 a {
    color: #f0862e;
    text-decoration: none;
}

.arrow {
    margin-bottom: 15%;
}

.next {
    position: absolute;
    left: 80%;
}

.back {
    position: absolute;

}

.next li,
.back li {
    list-style: none;
    float: left;
}


.next a,
.back a {
    font-size: 2.5rem;
    text-decoration: none;
    color: #141823;
}

.next img {
    padding-left: 3px;
}

.back img {
    padding-right: 3px;
}

.langa {
    position: absolute;
    right: 2%;
    top: 0;
    z-index: 999;
    display: inline-block;
    padding: 0.5%;
    background-color: #444444;
    color: #ffffff;
    font-size: 1.8rem;
    text-decoration: none;
    text-align: center;
    border: solid thin #444444;
    transition: 0.4s;
}

.langa:hover {
    background-color: #ffffff;
    color: #444444;
    border: solid thin #444444;
}

.langa:before,
.langa:after {
    width: 100%;
    height: 100%;
    z-index: 1000;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    box-sizing: border-box;
    transform: scale(0);
    transition: 0.8s;
}

.langa:before {
    border-bottom: solid thin #444444;
    border-left: solid thin #444444;
    transform-origin: 100% 0%;
}

.langa:after {
    border-top: solid thin #444444;
    border-right: solid thin #444444;
    transform-origin: 0% 100%;
}

.langa:hover:after,
.langa:hover:before {
    transform: scale(1);
}


.sticky {
    position: -webkit-sticky;
    position: sticky;
    top: 10%;
    background-color: rgba(33, 33, 33, 0.8);
    list-style: none;
}

.sticky p {
    color: #ffffff;
    font-size: 1.5rem;
    margin: 12% 0 10% 3%;
    padding: 0;
    line-height: 1.4;
}

.sticky li,
.stickyw li {
    margin-bottom: 10%;
    margin-left: 3%;
}

.stickyw li {
    margin-top: 7%;
}

.sticky a {
    font-size: 1.4rem;
    text-decoration: none;
    text-decoration: none;
    color: #ffffff;
}

.sticky a:hover {
    transition: 0.2s;
    color: #cccccc;
}

.stickyw a {
    font-size: 1.4rem;
    text-decoration: none;
    text-decoration: none;
    color: #141823;
}

.stickyw {
    position: -webkit-sticky;
    position: sticky;
    top: 10%;
    background-color: rgba(66, 66, 66, 0.1);
    list-style: none;
    grid-column: 4;
    grid-row: 1/3;
    height: 170px;
}

.stickyc {
    position: -webkit-sticky;
    position: sticky;
    top: 10%;
    grid-column: 4;
    grid-row: 1/3;
    list-style: none;
    background-color: rgba(66, 66, 66, 0.05);
    height: 320px;
    font-size: 1.3rem;
    text-decoration: none;
    color: #141823;
}

.stickyc li:hover {
    transition: 0.2s;
    color: #666666;
}

.stickyc label {
    margin-left: 5%;
}

.sticky_h {
    font-size: 1.4rem;
    margin-top: 6px;
}

#page_top {
    width: 50px;
    height: 50px;
    position: fixed;
    left: 3%;
    bottom: 5%;
    background: #64bae9;
    opacity: 0.6;
    border-radius: 50%;
}

.page_topcon {
    position: relative;
    width: 50px;
    height: 50px;
}

#page_top img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);

}


.tips {
    position: absolute;
    top: 0;
    left: 2%;
    width: 10%;
    transform: translateY(-60%);
    background-color: #ffffff;
    padding-left: 0.6%;
    padding-right: 0.6%;

}

.tipsbox {
    border: solid medium #888888;
    border-radius: 23px;
    position: relative;
}

p.tips_p {
    padding: 2%;
    margin: 0;
}

#douki {
    display: grid;
    grid-gap: 50px;
    grid-template-columns: 10% 1fr 2fr 1fr 10%;
    grid-template-rows: auto auto;
    margin-top: 20px;
}

.doukibox1 {
    grid-column: 2/4;
    grid-row: 1;
}

.doukibox2 {
    margin-top: 60%;
    grid-column: 4;
    grid-row: 1;
    width: 100%;
}

.doukibox3 {
    margin-top: 10%;
    grid-column: 2;
    grid-row: 2;
    width: 100%;
}

.doukibox4 {
    grid-column: 3/5;
    grid-row: 2;
}

#douki .arrow {
    grid-column: 2/5;
    grid-row: 3;
}

#kiso,
#research {
    height: 100%;
    width: 80%;
    margin: 0 auto;
    margin-top: 2%;
    margin-left: 15%;
}

#kiso h1,
#research h1 {
    margin-bottom: 3%;
}

#kiso .arrow {
    grid-row: 2;
}

.kisocon {
    display: grid;
    grid-template-columns: 0 1fr 1fr 1fr 10%;
    grid-gap: 5px;
    height: 40%;
    text-align: center;


}

.kiso1 {
    grid-column: 2;
}

.kiso2 {
    grid-column: 3;
}

.kiso3 {
    grid-column: 4;
}

#kiso li,
#research li,
#gisintro li,
#matomeintro li {
    list-style: none;
}

#kiso li a,
#research li a,
#gisintro li a,
#matomeintro li a {
    display: block;
    color: #141823;
    font-size: 1.8rem;
    text-decoration: none;
    position: relative;
}

#kiso li a:hover,
#research li a:hover,
#gisintro li a:hover,
#matomeintro li a:hover,
#activity li a:hover {
    color: #666666;
}

#jijo {
    display: grid;
    grid-gap: 50px;
    grid-template-columns: 10% 1fr 14fr 1fr 10%;
    grid-template-rows: auto;
    margin-top: 20px;
}

.jijos {
    grid-column: 5;
    grid-row: 1/3;
    height: 230px;
    width: 100%;
}

.jijo0 {
    grid-column: 2/5;
    grid-row: 1;
}

.jijo1 {
    grid-column: 3;
    grid-row: 2;
}

.jijo2 {
    list-style: none;
    grid-column: 3;
    grid-row: 2;
}

.jijo3 {
    grid-column: 2/5;
    grid-row: 3;
}

.jijo4 {
    grid-column: 2/5;
    grid-row: 4;
}


#jijo .arrow {
    grid-column: 2/5;
    grid-row: 5;
}

#junkan {
    display: grid;
    grid-gap: 50px;
    grid-template-columns: 10% 2fr 1fr 2fr 10%;
    grid-template-rows: auto auto auto;
    margin-top: 20px;
}

.junkans {
    grid-column: 5;
    grid-row: 1;
    height: 230px;
    width: 100%;
}

.junkan1 {
    grid-column: 2/4;
    grid-row: 1;
}

.junkan2 {
    grid-column: 4;
    grid-row: 1;
    margin-top: 20%;
}

.junkan3 {
    grid-column: 2;
    grid-row: 2;
}

.junkan4 {
    grid-column: 3/5;
    grid-row: 2;
}

.junkan5 {
    grid-column: 2/5;
    grid-row: 3;
}

#junkan .arrow {
    grid-column: 2/5;
    grid-row: 4;
}

#virtual {
    display: grid;
    grid-gap: 50px;
    grid-template-columns: 10% 3fr 2fr 10%;
    grid-template-rows: auto auto;
    margin-top: 20px;
}

.virtuals {
    grid-column: 4;
    grid-row: 1;
    width: 100%;
    height: 230px;
}

.virtual1 {
    grid-column: 2/4;
    grid-row: 1;
}

.virtual2 {
    grid-column: 2;
    grid-row: 2;
}

.virtual3 {
    grid-column: 3;
    grid-row: 2;
}

#virtual .arrow {
    grid-column: 2/4;
    grid-row: 3;
}

#research {
    height: 100%;
    margin: 0 auto;
}

.ress {
    grid-column: 5;
    grid-row: 1/3;
    height: 480px;
    width: 100%;
}

.ress_e {
    height: 500px!important;
}

.wpress {
    height: 480px;
    width: 100%;
    grid-row: 1/3;
    grid-column: 4;
    grid-row: 2;
    top: 50%;
}

.rescon {
    display: grid;
    grid-template-columns: 0 1fr 1fr 1fr;
    grid-template-rows: auto;
    height: 50%;
    grid-gap: 5px;
    text-align: center;
}

.res1 {
    grid-column: 2;
    grid-row: 1;

}

.res2 {
    grid-column: 3;
    grid-row: 1;

}

.res2-5 {
    grid-column: 4;
    grid-row: 1;

}

.res3 {
    grid-column: 2;
    grid-row: 2;

}

.res4 {
    grid-column: 3;
    grid-row: 2;

}

.res5 {
    grid-column: 4;
    grid-row: 2;

}

.res6 {
    grid-column: 2;
    grid-row: 3;

}

.res7 {
    grid-column: 3;
    grid-row: 3;

}



.rescon .arrow {
    grid-column: 2/5;
    grid-row: 4;
}


#japan {
    display: grid;
    grid-gap: 50px;
    grid-template-columns: 10% 2fr 1fr 2fr 10%;
    grid-template-rows: auto;
    margin-top: 20px;
}

.japan0 {
    grid-column: 2/5;
    grid-row: 1;
}

.japan1 {
    grid-column: 2/4;
    grid-row: 2;
}

.japan2 {
    grid-column: 4;
    grid-row: 2;
    margin-top: 15%;
}

.japan3 {
    grid-column: 2/5;
    grid-row: 3;
}

.japan4 {
    grid-column: 2/4;
    grid-row: 4;
}

.japan5 {
    grid-column: 4;
    grid-row: 4;
    width: 100%;
}

.japan6 {
    grid-column: 2;
    grid-row: 5;
    height: 100%;
    margin-left: 20%;
}

.japan7 {
    grid-column: 3/5;
    grid-row: 5;
}

.japan8 {
    grid-column: 2;
    grid-row: 6;
    width: 100%;
}

.japan9 {
    grid-column: 3/5;
    grid-row: 6;
}

.japan10 {
    grid-column: 2/5;
    grid-row: 7;
}

.japan11 {
    grid-column: 2/4;
    grid-row: 8;
}

.japan12 {
    grid-column: 4;
    grid-row: 8;
    margin-top: 10%;
}

.japan13 {
    grid-column: 2/4;
    grid-row: 9;
}

.japan14 {
    grid-column: 4;
    grid-row: 9;
    list-style: none;
    margin-top: 5%;
}

#japan .arrow {
    grid-column: 2/5;
    grid-row: 10;
}

#wholeworld {
    display: grid;
    grid-gap: 20px 50px;
    grid-template-columns: 10% 1fr 10%;
    grid-template-rows: auto;
    margin-top: 20px;

}

.whole1 {
    grid-column: 2;
    grid-row: 0;
}

.slider {
    grid-column: 2;
}

.whole2 {
    grid-column: 2;
    grid-row: 5;
    list-style: none;
}

#wholeworld .bx-wrapper:nth-of-type(4) {
    grid-column: 2;
    grid-row: 2;
    width: 100%;

}

#wholeworld .bx-wrapper:nth-of-type(5) {
    grid-column: 2;
    grid-row: 3;
}

#wholeworld .bx-wrapper:nth-of-type(6) {
    grid-column: 2;
    grid-row: 4;
}

.bx-pager {
    text-align: center;
    font-size: .85em;
    font-family: Arial;
    font-weight: 700;
    color: #666;
    padding-top: 20px;
}

.bx-pager-item {
    font-size: 0;
    line-height: 0;
}

.bx-pager.bx-default-pager a.active,
.bx-wrapper .bx-pager.bx-default-pager a:focus,
.bx-wrapper .bx-pager.bx-default-pager a:hover {
    background: #000;
}

#wholeworld .arrow {
    grid-column: 2;
    grid-row: 6;
}

#wholeworld .wpress {
    top: 10%;
    grid-column: 3;
    grid-row: 1/4;
}

#worldmap {
    display: grid;
    grid-gap: 50px;
    grid-template-columns: 10% 2fr 2.5fr 10%;
    grid-template-rows: auto;
    margin-top: 20px;
}

.world1 {
    grid-column: 2/4;
    grid-row: 1;
}

.world1 li {
    list-style: none;
}

.world2 {
    grid-column: 2/4;
    grid-row: 2;
}

#worldmap .bx-wrapper {
    grid-column: 2/4;
    grid-row: 2;
}

.worldbox {
    grid-column: 2/4;
    grid-row: 2;
}

.worldbox {
    margin: 2em 0;
    padding: 0;
}

.introworld label {
    border-bottom: double medium #888888;
    display: block;
    margin: 1.5px 0;
    padding: 11px 12px;
    color: #141823;
    cursor: pointer;
    transition: all 0.5s;
    font-size: 1.8rem;
}

.worldbox label {
    border-bottom: solid thin #888888;
    display: block;
    margin: 1.5px 0;
    padding: 11px 12px;
    color: #141823;
    cursor: pointer;
    transition: all 0.5s;
    font-size: 1.8rem;
}

.worldbox input,
.introworld input {
    opacity: 0;
}

.worldbox .accshow,
.introworld .accshow {
    height: 0;
    padding: 0;
    overflow: hidden;
    opacity: 0;
    transition: 0.3s;
}


.cssacc:checked + .accshow {
    height: auto;
    padding: 5px;
    opacity: 1;
}

#worldmap .arrow {
    grid-column: 2/4;
    grid-row: 3;
}

#america,
#brazil,
#singa,
#india,
#saudi,
#mexico,
#france,
#italy,
#congo {
    display: grid;
    grid-template-columns: 2fr 1fr 2fr 3fr;
    grid-template-rows: auto;
    grid-gap: 30px;
}



.h {
    grid-column: 1/5;
    grid-row: 2;
}

.worldbox .mandara {
    grid-column: 1/5;
    grid-row: 1;
}

.flag {
    grid-column: 1;
    grid-row: 3;
    width: 100%;
}

.data {
    grid-column: 1;
    grid-row: 4;
}

.america_p1,
.brazil_p1,
.singa_p1,
.india_p1,
.saudi_p1,
.mexico_p1,
.france_p1,
.italy_p1,
.congo_p1 {
    grid-column: 2/5;
    grid-row: 3;
}

.america_p1 img,
.mexico_p1 img,
.brazil_p1 img,
    {
    padding-left: 40px;
    padding-right: 40px;
    padding-bottom: 15px;
}

.america_p2,
.saudi_p2 {
    grid-column: 1/4;
    grid-row: 4;
}

.singa_p2,
.india_p2,
.france_p2,
.italy_p2,
.congo_p2 {
    grid-column: 1/5;
    grid-row: 4;
}

.brazil_p2 {
    grid-column: 1/5;
    grid-row: 5;
}

.mexico_p2 {
    grid-column: 1/5;
    grid-row: 4;
}

.america_p2-2 {
    grid-column: 4;
    grid-row: 4;
    margin-top: 13%;
}

#worldmap .refer {
    margin-top: 2%;
}

#america .mandara,
#brazil .mandara,
#singa .mandara,
#france .mandara,
#congo .mandara {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
}



.nameman1 {
    grid-column: 1;
    width: 90%;
}

.nameman2 {
    grid-column: 2;
    width: 90%;
    margin-top: 7%;
}

.nameman3 {
    grid-column: 3;
    width: 90%;
    margin-top: 3%;
}

.asman1 {
    grid-column: 1;
    width: 95%;
    margin-top: 4%;
}

.asman2 {
    grid-column: 2;
    width: 95%;
    margin-top: 1.3%;
}

.asman3 {
    grid-column: 3;
    width: 95%;
}

.euman1 {
    grid-column: 1;
    width: 90%;
    margin-top: 5%;
}

.euman2 {
    grid-column: 2;
    width: 90%;
    margin-top: 3.5%;
}

.euman3 {
    grid-column: 3;
    width: 90%;
}

.afman1 {
    grid-column: 1;
    width: 90%;
}

.afman2 {
    grid-column: 2;
    width: 90%;
    margin-top: 1.5%;
}

.afman3 {
    grid-column: 3;
    width: 90%;
}

.america_p3 {
    grid-column: 1/3;
    grid-row:
}

.america4 {
    grid-column: 3/5;
}

.america_p6 {
    grid-column: 1/5;
}

.sameman1 {
    grid-column: 2;
    width: 90%;
}

.brazil_p15 {
    grid-column: 1/4;
    grid-row: 4;
}

.brazil_p16 {
    grid-column: 4;
    grid-row: 4;
}

.brazil_3 {
    grid-column: 1/5;
    grid-row: 6;

}

.brazil4 {
    grid-column: 1/5;
    grid-row: 7;
}

.brazil_3 {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
}

.bra1 {
    grid-column: 1;
    width: 84%;
}

.bra2 {
    grid-column: 2;
    width: 86%;
}

.bra3 {
    grid-column: 3;
    width: 100%;
}

.sin1 {
    width: 65%;
    margin-bottom: 15px;
}

.sin2 {
    margin-left: 4%;
    width: 28%;
    margin-bottom: 15px;
    display: inline-block;

}

.sin3 {
    margin-bottom: 5%;
}


.saudi3 {
    grid-column: 4;
    grid-row: 4;
}

.saudi4 {
    grid-column: 4;
    grid-row: 5;
}

.saudi25 {
    grid-column: 1/4;
    grid-row: 5;
}

.italy_p3 {
    grid-column: 1/4;
    grid-row: 5;
}

.italy4 {
    grid-column: 4;
    grid-row: 5;
}

#maphajime {
    display: grid;
    grid-template-columns: 10% 1fr 1fr 1fr 10%;
    grid-template-rows: auto;
    grid-gap: 30px;

}

.map0 {
    grid-column: 2/5;
    grid-row: 1;
}

.map1 {
    grid-column: 2;
    grid-row: 2;
}

.map2 {
    grid-column: 3;
    grid-row: 2;
}

.mapen {
    grid-column: 4;
    grid-row: 2/4;
    width: 100%;
}

.map3 {
    grid-column: 2;
    grid-row: 3;
    width: 100%;
}

.map4 {
    grid-column: 3;
    grid-row: 3;
    width: 96%;
}

.map5 {
    grid-column: 2;
    grid-row: 4;
    width: 100%;
}

.map6 {
    grid-column: 3/5;
    grid-row: 4;
}

.map7 {
    grid-column: 2/5;
    grid-row: 5;
}

.map6 a {
    text-decoration: none;
    color: #f0862e;
    font-size: 1.6rem;
}

#maphajime .arrow {
    grid-column: 2/5;
    grid-row: 6;
}

#interview {
    display: grid;
    grid-template-columns: 10% 3fr 2fr 10%;
    grid-template-rows: auto;
    grid-gap: 50px;
}

#interview .wpress,
#menu .wpress,
#term .wpress {
    top: 10%;
    grid-row: 1/3;
}

#term .wpress a {
    color: #ffffff;
}

.int1 {
    grid-column: 2/4;
    grid-row: 1;
}

.int2 {
    grid-column: 2;
    grid-row: 2;
}

.int3 {
    grid-column: 3;
    grid-row: 2;
    width: 100%;
}

.int4 {
    grid-column: 2/4;
    grid-row: 3;
}

.int5 {
    grid-column: 2/4;
    grid-row: 4;
}

.int6 {
    grid-column: 2/4;
    grid-row: 5;
}

.int7 {
    grid-column: 2/4;
    grid-row: 6;
}

.int8 {
    grid-column: 2/4;
    grid-row: 7;
}

.int9 {
    grid-column: 2/4;
    grid-row: 8;
}

.int10 {
    grid-column: 2/4;
    grid-row: 9;
}

.int6 a {
    text-decoration: none;
    color: #f0862e;
    font-size: 1.6rem;
}

.int7 span {
    border-bottom: solid thin #141823;
}

#interview .arrow {
    grid-column: 2/4;
    grid-row: 10;
}

#menu {
    display: grid;
    grid-template-columns: 10% 1fr 1fr 10%;
    grid-template-rows: auto;
    grid-gap: 50px;
}

.menu1 {
    grid-column: 2/4;
    grid-row: 1;
}

.menu2 {
    grid-column: 2/4;
    grid-row: 2;
    width: 100%;
}

.menu3 {
    grid-column: 2/4;
    grid-row: 3;
}

.menu4 {
    grid-column: 2;
    grid-row: 4;
}

.menu5 {
    grid-column: 3;
    grid-row: 4;
}

#menu .arrow {
    grid-column: 2/4;
    grid-row: 5;
}

#question {
    display: grid;
    grid-gap: 50px;
    grid-template-columns: 10% 3fr 2fr 10%;
    grid-template-rows: auto;
}

.ques0 {
    grid-column: 2/4;
    grid-row: 1;
}

.ques1 {
    grid-column: 3;
    grid-row: 2;
    width: 100%;
}

.ques2 {
    grid-column: 2;
    grid-row: 2;
}

.ques3 {
    grid-column: 2/4;
    grid-row: 3;
    margin-top: -5%;
}

.ques4 {
    grid-column: 3;
    grid-row: 4;
    width: 100%;
}

.ques5 {
    grid-column: 2;
    grid-row: 4;
}

.ques5-2 {
    grid-column: 2/4;
    grid-row: 5;
    margin-top: -5%;
}

.ques6 {
    grid-column: 3;
    grid-row: 6;
    width: 100%;
}

.ques7 {
    grid-column: 2;
    grid-row: 6;
}

.ques7-2 {
    grid-column: 2/4;
    grid-row: 7;
    margin-top: -5%;
}

.ques8 {
    grid-column: 2/4;
    grid-row: 8;
}

#question .arrow {
    grid-column: 2/4;
    grid-row: 9;
}

#question .ress {
    grid-column: 4;
    grid-row: 1/3;
    top: 10%;
}

#term a {
    text-decoration: none;
    color: #f0862e;
    font-size: 1.4rem;

}

#term {
    display: grid;
    grid-gap: 50px;
    grid-template-columns: 10% 1fr 1fr 10%;
    grid-template-rows: auto;
}


.term0 {
    grid-column: 2/4;
    grid-row: 1;
}

.term1 {
    grid-column: 2;
    grid-row: 2;
}

.term2 {
    grid-column: 3;
    grid-row: 2;
}

.term3 {
    grid-column: 2;
    grid-row: 3;
}

.term4 {
    grid-column: 3;
    grid-row: 3;
}

.term5 {
    grid-column: 2;
    grid-row: 4;
}

.term6 {
    grid-column: 3;
    grid-row: 4;
}

.term7 {
    grid-column: 2;
    grid-row: 5;
}

.term8 {
    grid-column: 3;
    grid-row: 5;
}

.term9 {
    grid-column: 2;
    grid-row: 6;
}

.term10 {
    grid-column: 3;
    grid-row: 6;
}

.term11 {
    grid-column: 2;
    grid-row: 7;
}

.term12 {
    grid-column: 3;
    grid-row: 7;
}

.term13 {
    grid-column: 2;
    grid-row: 8;
}

#term .arrow a {
    font-size: 2.5rem;
    text-decoration: none;
    color: #141823;
}

#term .arrow {
    grid-column: 2/4;
    grid-row: 9;
}

#gisintro {
    display: grid;
    grid-template-columns: 10% 1fr 10%;
    grid-template-rows: auto;
    grid-gap: 50px;
}

.gisin0 {
    grid-column: 2;
    grid-row: 1;
}

.giscon {
    grid-column: 2;
    grid-row: 2;
}

#gisintro .arrow {
    grid-column: 2;
    grid-row: 3;
}

.giscon {
    display: grid;
    grid-template-columns: 10% 1fr 1fr 10%;
    grid-gap: 5px;
    height: 40%;
    text-align: center;
}

.gisin1 {
    grid-column: 2;
    width: 100%;
}

.gisin2 {
    grid-column: 3;
    width: 100%;
}

.giss {
    grid-column: 8;
    grid-row: 1/3;
    height: 160px;
    width: 100%;
}

#gismandara .giss {
    grid-column: 6;
}

#gishand {
    display: grid;
    grid-template-columns: 10% 1fr 0.3fr 0.2fr 0.2fr 0.3fr 1fr 10%;
    grid-template-rows: auto;
    grid-gap: 50px;
}

.hand1 {
    grid-column: 2/6;
    grid-row: 1;
}

.hand2 {
    grid-column: 6/8;
    grid-row: 1;
    width: 100%;
    margin-top: 10%;
}

.hand3 {
    grid-column: 2/8;
    grid-row: 2;
}

.hand4 {
    grid-column: 2/5;
    grid-row: 3;
}

.hand5 {
    grid-column: 5/8;
    grid-row: 3;
}

.hand6 {
    grid-column: 2/8;
    grid-row: 4;
}

.hand7 {
    grid-column: 2/6;
    grid-row: 5;
}

.hand8 {
    grid-column: 6/8;
    grid-row: 5;
    width: 100%;
}

.hand9 {
    grid-column: 2/8;
    grid-row: 6;
}

.hand10 {
    grid-column: 2/8;
    grid-row: 7;
}

.hand10 {
    display: grid;
    grid-template-columns: 2fr 1fr;
    grid-template-rows: auto;
    grid-gap: 10px;
}

.hand10-1,
.hand13-5 {
    grid-column: 1;
    grid-row: 1;
}

.hand10-2,
.hand13-6 {
    grid-column: 1;
    grid-row: 2;
}

.hand10-3,
.hand13-7 {
    grid-column: 1;
    grid-row: 3;
}

.hand13-8 {
    grid-column: 1;
    grid-row: 4;
}

.hand10-4,
.hand13-1 {
    grid-column: 2;
    grid-row: 1;
}


.hand10-5,
.hand13-2 {
    grid-column: 2;
    grid-row: 2;
}

.hand10-6,
.hand13-3 {
    grid-column: 2;
    grid-row: 3;
}

.hand13-4 {
    grid-column: 2;
    grid-row: 4;
}

.hand13 {
    grid-column: 2/8;
    grid-row: 8;
}

.hand13 {
    display: grid;
    grid-template-columns: 1fr 2fr;
    grid-template-rows: auto;
    grid-gap: 10px;
}

.hand14 {
    grid-column: 2/6;
    grid-row: 9;
}

.hand15 {
    grid-column: 6/8;
    grid-row: 9;
    width: 100%;
    margin-top: 10%;
}

#gishand .arrow {
    grid-column: 2/8;
    grid-row: 10;
}

#gismandara {
    display: grid;
    grid-template-columns: 10% 1fr 0.5fr 0.5fr 1fr 10%;
    grid-template-rows: auto;
    grid-gap: 30px;
}

.gisman1 {
    grid-column: 2/5;
    grid-row: 1;
}

.gisman2 {
    grid-column: 5;
    grid-row: 1;
    width: 100%;
    margin-top: 18%;
}

.gisman3 {
    grid-column: 2/4;
    grid-row: 2;
}

.gisman4 {
    grid-column: 4/6;
    grid-row: 2;
    width: 100%;
    margin-top: 14%;
}

.gisman5 {
    grid-column: 2/4;
    grid-row: 3;
    width: 100%;
}

.gisman6 {
    grid-column: 4/6;
    grid-row: 3;
    width: 100%;
}

.gisman7 {
    grid-column: 2/6;
    grid-row: 4;
}

.gisman8 {
    grid-column: 2/5;
    grid-row: 5;
}

.gisman9 {
    grid-column: 5;
    grid-row: 5;
    width: 100%;
}

.gisman10 {
    grid-column: 2/6;
    grid-row: 6;
}

.gisman11 {
    grid-column: 2/6;
    grid-row: 7;
}

#gismandara .arrow {
    grid-column: 2/6;
    grid-row: 8;
}

#matome {
    display: grid;
    grid-template-columns: 10% 1fr 2fr 1fr 10%;
    grid-template-rows: auto;
    grid-gap: 50px;
}

.matomes {
    grid-column: 5;
    grid-row: 1/3;
    height: 280px;
}

#future .matomes {
    grid-column: 3;
}

.matome1 {
    grid-column: 2/5;
    grid-row: 1;
}

.matome1-1 {
    grid-column: 2/4;
    grid-row: 2;
}

.matome1-1img {
    grid-column: 4;
    grid-row: 2;
    width: 100%;
    margin-top: 30%;
}

.matome1-2 {
    grid-column: 3/5;
    grid-row: 3;
}

.matome1-2img {
    grid-column: 2;
    grid-row: 3;
    width: 100%;
    margin-top: 30%;
}

.matome1-3 {
    grid-column: 2/4;
    grid-row: 4;
}

.matome1-3img {
    grid-column: 4;
    grid-row: 4;
    width: 100%;
    margin-top: 30%;
}

#matome .arrow {
    grid-column: 2/5;
    grid-row: 5;
}

#future {
    display: grid;
    grid-template-columns: 10% 1fr 10%;
    grid-template-rows: auto;
    grid-gap: 50px;
}

.future1 {
    grid-column: 2;
    grid-row: 1;
}


.future2 {
    grid-column: 2;
    grid-row: 2;
}

/*
.future3 {
    grid-column: 2;
    grid-row: 3;
}
*/

#future .arrow {
    grid-column: 2;
    grid-row: 4;
}

#project {
    display: grid;
    grid-template-columns: 10% 1fr 2fr 1.3fr 10%;
    grid-template-rows: auto;
    grid-gap: 50px;
}

.project0 {
    grid-column: 2/5;
    grid-row: 1;
}

.project1 {
    grid-column: 2/5;
    grid-row: 2;

}

.project1,
.project2 {
    display: grid;
    grid-template-columns: 1fr 2fr 1fr;
    grid-template-rows: auto;
    grid-gap: 50px;
}

.pro1-1 {
    grid-column: 1/4;
    grid-row: 1;
}

.pro1-2 {
    grid-column: 1/3;
    grid-row: 2;
}

.pro1img {
    grid-column: 3;
    grid-row: 2;
    width: 100%;
}

.pro1-3 {
    grid-column: 1/4;
    grid-row: 3;
}

.project2 {
    grid-column: 2/5;
    grid-row: 3;
}

.pro2-1 {
    grid-column: 1/4;
    grid-row: 1;
}

.pro2-2 {
    grid-column: 2/4;
    grid-row: 2;
}

.pro2img {
    grid-column: 1;
    grid-row: 2;
    width: 100%;
}

.project3 {
    grid-column: 2/4;
    grid-row: 4;
}

.pro3img {
    grid-column: 4;
    grid-row: 4;
    width: 100%;
}

.project4 {
    grid-column: 2/5;
    grid-row: 5;
}

#project .arrow {
    grid-column: 2/5;
    grid-row: 6;
}



#matomeintro {
    display: grid;
    grid-template-columns: 10% 1fr 10%;
    grid-template-rows: auto;
    grid-gap: 50px;
}

.matin0 {
    grid-column: 2;
    grid-row: 1;
}

.matcon {
    grid-column: 2;
    grid-row: 2;
}

#matomeintro .arrow {
    grid-column: 2;
    grid-row: 3;
}

.matcon {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: auto;
    grid-gap: 5px;
    text-align: center;
}

.matin1 {
    grid-column: 2;
    grid-row: 1;
}

.matin2 {
    grid-column: 1;
    grid-row: 1;
}

.matin2 a {
    font-size: 1.69rem!important;
}

.matin3 {
    grid-column: 3;
    grid-row: 1;
}

.last {
    text-align: center;
}

.accon a {
    text-decoration: none;
    font-size: 1.8rem;
    color: #141823;

}

.accon li {
    list-style: none;
    text-align: center;
}

#activity {
    display: grid;
    grid-template-columns: 10% 1fr 10%;
    grid-template-rows: auto;
    grid-gap: 50px;
}


.ac0 {
    grid-column: 2;
    grid-row: 1;
}

.accon {
    grid-column: 2;
    grid-row: 2;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: auto;
    grid-gap: 5px;
}

.ac2 {
    grid-column: 1;
}

.ac3 {
    grid-column: 2;
}

.ac4 {
    grid-column: 3;
}

#log {
    display: grid;
    grid-template-columns: 10% 1fr 1fr 10%;
    grid-template-rows: auto;
    grid-gap: 50px;
}

.log0 {
    grid-column: 2/4;
    grid-row: 1;
}

.log1 {
    grid-column: 2/4;
    grid-row: 2;
}

.log2 {
    grid-column: 2/4;
    grid-row: 3;
}

.log2-2 {
    grid-column: 2/4;
    grid-row: 4;
}

.log3 {
    grid-column: 2/4;
    grid-row: 5;
}

.log4 {
    grid-column: 2/4;
    grid-row: 6;
}

.log5 {
    grid-column: 2/4;
    grid-row: 7;
}

.log6 {
    grid-column: 2/4;
    grid-row: 8;
}

.log7 {
    grid-column: 2/4;
    grid-row: 9;
}

.log8 {
    grid-column: 2/4;
    grid-row: 10;
}

.log9 {
    grid-column: 2/4;
    grid-row: 11;
    display: grid;
    grid-template-columns: 3fr 1.4fr;
    grid-template-rows: auto;
    grid-gap: 10px;
}

.log9-1 {
    grid-column: 1/3;
    grid-template-rows: 1;
}

.log9-2 {
    grid-column: 1;
    grid-template-rows: 2;
}

.log9-3 {
    grid-column: 2;
    grid-template-rows: 3;
}

.log10 {
    grid-column: 2/4;
    grid-row: 12;
}

.award {
    grid-column: 2/4;
    grid-row: 13;
}

#log .arrow {
    grid-column: 2/4;
    grid-row: 14;
}

#reference {
    display: grid;
    grid-template-columns: 10% 1fr 10%;
    grid-template-rows: auto;
    grid-gap: 50px;
}

.reference0 {
    grid-column: 2;
    grid-row: 1;
}

.reference1 {
    grid-column: 2;
    grid-row: 2;
}

.reference2 {
    grid-column: 2;
    grid-row: 3;
}

#reference .arrow {
    grid-column: 2;
    grid-row: 4;
}

#reference li {
    list-style: none;
}

.reference1 {
    font-size: 1.6rem;
}

.reference2 a,
.reference1 a {
    color: #1d61ad;
    text-decoration: none;
    font-size: 1.6rem;
}

#reference li {
    margin-bottom: 1%;
}

.indent {
    text-indent: -1rem;
    padding-left: 1rem;
}