@charset "UTF-8";
 .page_title_white {
background: url(//www.kahokusmile.com/img/kids/page_title.jpg) no-repeat center center;
}
main .bg_green .bg_green_in {
padding-top: 90px;
padding-bottom: 100px;
background: url(//www.kahokusmile.com/img/common/dot_line.svg) repeat-x center bottom;
}
main .comment01 {
position: relative;
display: flex;
margin-bottom: 2.5em;
}
main .comment01 p {
width: calc(100% - 460px);
}
main .comment01 p span {
color: #69ba46;
}
main .comment01 ul {
position: absolute;
top: -140px;
right: 0;
width: 410px;
}
main .comment01 ul li:first-of-type {
padding-left: 110px;
margin-bottom: 20px;
}
main .comment01 ul li:last-of-type {
padding-right: 110px;
}
main .comment01 ul li span {
display: block;
overflow: hidden;
border-radius: 10px;
}
main .about > section:not(:last-of-type) {
margin-bottom: 80px;
}
main .about > section > .box {
display: flex;
}
main .about > section > .box > .comment {
width: 550px;
margin-right: 20px;
}
main .about > section > .box > .comment p:not(:last-of-type) {
margin-bottom: 1.2em;
}
main .about > section > .box .img {
margin-left: auto;
width: 340px;
}
main .about > section > .box .img span {
display: block;
overflow: hidden;
border-radius: 50%;
}
@media screen and (max-width: 767px) {
main .bg_green .bg_green_in {
padding-top: 10vw;
padding-bottom: 20vw;
background: url(//www.kahokusmile.com/img/common/dot_line.svg) repeat-x center bottom;
}
main .comment01 {
position: relative;
display: flex;
flex-direction: column;
margin-bottom: 2.5em;
}
main .comment01 p {
width: 100%;
margin-bottom: 5vw;
}
main .comment01 ul {
position: relative;
top: inherit;
right: inherit;
width: 100%;
margin-bottom: 5vw;
}
main .comment01 ul li:first-of-type {
padding-left: 0;
margin-bottom: 5vw;
}
main .comment01 ul li:last-of-type {
padding-right: 0;
}
main .comment01 ul li span {
display: block;
overflow: hidden;
border-radius: 10px;
}
main .about > section:not(:last-of-type) {
margin-bottom: 10vw;
}
main .about > section > .box {
display: flex;
flex-direction: column;
}
main .about > section > .box > .comment {
order: 2;
width: 100%;
margin-right: 0;
}
main .about > section > .box > .comment p:not(:last-of-type) {
margin-bottom: 1.2em;
}
main .about > section > .box .img {
order: 1;
margin-bottom: 5vw;
margin-left: 0;
width: 100%;
}
main .about > section > .box .img span {
display: block;
overflow: hidden;
border-radius: 0;
}
}