@charset "UTF-8";
 .page_title {
background: url(//www.kahokusmile.com/img/denture/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 .about > p {
margin-bottom: 2.5em;
}
main .about .box {
display: flex;
align-items: flex-start;
}
main .about .box .img {
width: 325px;
border-radius: 10px;
overflow: hidden;
margin-left: auto;
}
main .about .box .box_l {
width: calc(100% - (325px + 20px));
margin-right: 20px;
}
main .about .box .box_l p:not(:last-of-type) {
margin-bottom: 1.2em;
}
main .about .box .box_l p:last-of-type {
display: flex;
}
main .about .box .box_l p:last-of-type a {
position: relative;
display: flex;
text-decoration: none;
background: #FFF;
border: solid 1px #69ba46;
font-size: 2.0rem;
font-weight: 700;
padding: .4em 4.5em;
color: #69ba46;
border-radius: 1.5em;
}
main .about .box .box_l p:last-of-type a::before {
position: absolute;
top: 50%;
transform: translateY(-50%);
left: 1em;
width: 1.25em;
height: 1.25em;
background: url(//www.kahokusmile.com/img/common/arrow_green.svg) no-repeat center center;
background-size: cover;
content: '';
}
main .about .box .box_l p:last-of-type a:hover {
background: #69ba46;
border: solid 1px #69ba46;
color: #FFF;
}
main .about .box .box_l p:last-of-type a:hover::before {
background: url(//www.kahokusmile.com/img/common/arrow_white_green.svg) no-repeat center center;
background-size: cover;
content: '';
}
@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 .about > p {
margin-bottom: 2.5em;
}
main .about .box {
display: flex;
align-items: flex-start;
flex-direction: column;
}
main .about .box .img {
order: 1;
width: 100%;
border-radius: 10px;
overflow: hidden;
margin-left: 0;
margin-bottom: 5vw;
}
main .about .box .box_l {
order: 2;
width: 100%;
margin-right: 0;
}
main .about .box .box_l p:not(:last-of-type) {
margin-bottom: 1.2em;
}
main .about .box .box_l p:last-of-type {
display: flex;
}
main .about .box .box_l p:last-of-type a {
font-size: 1.6rem;
padding: .8em 2.5em;
border-radius: 1.5em;
}
}