@charset "utf-8";

/*==============================================
h2
================================================*/
h2 {
font-size: 24px;
margin-top: 150px;
}

/*==============================================
company
================================================*/
.company {
width: 90%;
margin: 0 auto 50px;
}

.company dt {
font-size: 18px;
}

.company dd {
font-size: 14px;
}

/*==============================================
ceo
================================================*/
.ceo {
width: 90%;
margin: 0 auto 50px;
}

.ceo h3 {
font-size: 18px;
}


/*==============================================
roll
================================================*/
.wrap {
width: 94%;
height: 100vh;
}

.roll {
text-align: left;
}

.roll .text1 {
font-size: 14px;
font-weight: bold;
margin-bottom: 5px;
}

.roll .text2 {
font-size: 16px;
padding-left: 5px;
}

.roll .text3 {
font-size: 12px;
padding-left: 5px;
}

.roll span {
font-size: 14px;
}

@-webkit-keyframes roll_text {
0%   { top: 100%; }
100% { top: -200%; }
}

@keyframes roll_text {
0%   { top: 100%; }
100% { top: -200%; }
}

@media screen and (max-width: 400px) {
.wrap {
height: 120vh;
margin-top: -50vh;
}
}

/*==============================================
philosophy
================================================*/
.rinen p {
font-size: 18px;
margin: 5% 0 20%;
}

.rinen p span {
display: block;
}

.about {
width: 90%;
padding: 2%;
}

.title {
position: absolute;
left: 20px;
top: -15px;
font-size: 16px;
}

.about ul li {
font-size: 12px;
}

/*==============================================
SDGs
================================================*/
.sdgs {
width: 90%;
margin: 0 auto 10%;
}

.sdgs img {
width: 100%;
}