pg_founding_story_002.css
p {
font-size:1.1em;
}
.prof {
border:solid 1px #ddd;
padding:30px;
margin-bottom:40px;
}
.prof li {
width: 100%;
}
.prof span.text {
width:380px;
float: left;
}
.prof span.image {
display: block;
width:300px;
margin-left: 410px;
}
.youtube {
position: relative;
padding-bottom: 56.25%;
height: 0;
overflow: hidden;
clear:both;
}
.youtube iframe{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.table{
display: flex;
background-color:#efefef;
padding:30px;
margin-top:40px;
margin-bottom:100px;
}
.list-row {
width:50%;
}
.table div ul{
display: table;
table-layout: fixed;
margin: 10px 0;
padding: 0;
border: 0;
outline: 0;
vertical-align: baseline;
}
.table li{
flex-direction: column;
padding: 5px 15px 5px 2px;
margin-right: 0;
}
.sogyo-h3 {
font-family: Noto Sans CJK JP Regular;
font-style: italic;
font-size:2.0em;
margin-bottom:30px;
}
.sogyo-h4 {
font-family: Noto Sans CJK JP Regular;
font-size:1.4em;
font-weight: 300;
letter-spacing: 0.1em;
margin-bottom:50px;
}
.sogyo-textbox {
margin-bottom:50px;
}
.sogyo-textbox ul {
margin:20px 0px;
font-size:1.1em;
}
.sogyo-textbox li {
width: 100%;
}
.sogyo-textbox span.name {
float: left;
padding: 5px 0px;
}
.sogyo-textbox span.koe {
display: block;
margin-left: 90px;
padding: 5px 0px;
}
.sogyo-textbox span.koe2 {
display: block;
margin-left: 30px;
padding: 5px 0px;
}
.sogyo-textbox span.koe3 {
display: block;
margin-left: 60px;
padding: 5px 0px;
}
@media screen and (min-width: 680px){
.pc { display:block; }
.sp { display:none; }
}
@media screen and (max-width: 680px){
.pc { display:none; }
.sp {display: block; }
.table{
display: block;
padding:20px;
margin-bottom:100px;
}
.list-row {
display: block;
width:100% !important;
}
.sogyo-h3 {
font-size:1.8em;
font-weight:700;
margin-bottom:20px;
}
.sogyo-h4 {
font-size:1.2em;
font-weight:700;
}
.sogyo-textbox ul {
-webkit-align-items: flex-start;
align-items: flex-start;
-webkit-flex-direction: column;
flex-direction: column;
}
.sogyo-textbox li {
padding-bottom:20px;
}
.sogyo-textbox span.name {
display: block;
float: none;
padding: 0px 0px 5px;
}
.sogyo-textbox span.koe {
margin-left: 0px;
padding: 0px;
}
.sogyo-textbox span.koe2 {
margin-left: 0px;
padding: 0px;
}
.sogyo-textbox span.koe3 {
margin-left: 0px;
padding: 0px;
}
}