#contents { width: 100%; } .about #contents .content-inner { padding: 192px 0 0; } .about #contents h1 { font-size: 3rem; width: 1140px; margin: 0 auto; text-align: left; color: #145d8c; } .content-top { width: 100%; height: 180px; background-color: #f3f4f5; text-align: center; vertical-align: middle; margin-top: 12.2rem; } .content-top img { width: 1200px; position: relative; bottom: 5.1rem; vertical-align: middle; } .link_tokyo { width: 1200px; height: 100px; display: flex; align-items: center; justify-content: center; position: relative; bottom: 5.1rem; margin: 0 auto; background-color: #145d8c; } .content-top .link_tokyo p, .content-top .link_tokyo a, .content-top .link_tokyo a:hover, .content-top .link_tokyo a:visited { color: #fff; font-size: 1.4rem; text-decoration: none; } .content-top .link_tokyo a { margin-left: 3.6rem; border: solid 1px #fff; border-radius: 25px; padding: 10px 36px; } .sp_only { display: none; } .about-wrap { width: 1140px; margin: 0 auto; } .about-sapporo { margin-top: 12.2rem; } #about-company #contents h2 { margin-top: 3rem; margin-bottom: 3.6rem; font-size: 2.4rem; color: #145d8c; } #about-company #contents .about-wrap p { font-size: 1.6rem; margin-bottom: 3.6rem; } #about-company #contents #map, #about-company #contents #map-cc { margin-bottom: 3.6rem; width: 1140px; height: 400px; } .branch-info { display: flex; margin-bottom: 8rem; } .branch-info dl { font-size: 1.4rem; margin-right: 3.6rem; } .branch-info .phonenumber { margin-right: 20.6rem; } .about-sapporocc .branch-info .phonenumber { margin-right: 26.2rem; } .branch-info dl dt { font-size: 1.8rem; color: #145d8c; margin-bottom: 2.2rem; } .branch-info .address dd, .branch-info .phonenumber dd { margin-bottom: 1rem; } .branch-info .access dd { display: flex; align-items: center; margin-bottom: 1.6rem; } .branch-info dl dd img { margin-right: 1.4rem; } .jr { margin-left: 0.2rem; } @media only screen and (max-width: 750px) { body { overflow-x: hidden; } .about #contents { width: 100%; } .about #contents .content-inner { padding: 60px 0 0; } .about #contents h1 { width: calc(100% - 40px); margin: 38px 20px; font-size: 1.8rem; text-align: left; } .content-top { width: 100%; height: auto; text-align: center; margin-top: 3.8rem; background-color: #145d8c; } .content-top img { width: 100%; position: relative; bottom: 0rem; } .link_tokyo { width: 100%; height: 145px; display: flex; flex-direction: column; align-items: center; justify-content: space-evenly; position: relative; bottom: 0rem; margin: 0 auto; background-color: #145d8c; } .sp_only { display: inline; } .content-top .link_tokyo a { margin: 0rem; } .about-wrap { width: 100%; } .about-sapporo { width: 100%; margin: 3.8rem 0 0; } #about-company #contents #sapporo { margin: 0 2rem 2rem; font-size: 1.6rem; } #about-company #contents #sapporocc { margin: 2.6rem 2rem 2rem; font-size: 1.6rem; } #about-company #contents .about-wrap p { font-size: 1.2rem; margin: 0 2rem 2rem; } #about-company #contents #map, #about-company #contents #map-cc { width: 100% !important; height: 300px !important; margin-bottom: 3.6rem; } .branch-info { flex-direction: column; margin: 0 2rem; } .branch-info dl dt { font-size: 1.5rem; } .branch-info dl { font-size: 1.2rem; width: 100%; margin: 0 0 3rem; } #about-company #contents .about-sapporocc dl.access, #about-company #contents .about-sapporocc dl.access dd { margin: 0; } }