@charset "UTF-8";

@media only screen and (min-width: 1001px) {
.less-1000 {
display: none !important;
}
}





@media only screen and (max-width: 1000px) {
span.inline-block {
display: inline-block;
}
.featurea li:nth-child(2) .chiryo {
white-space: nowrap;
}
.featurea li:nth-child(2) .markinfo {
display: flex;
justify-content: flex-start;
align-items: center;
flex-wrap: wrap;
gap: 0;
}
.advantage {
padding-top: 3em;
overflow-x: hidden;
width: 100%;
}

*:has(>wbr) {
white-space: pre-wrap;
word-break: keep-all;
}
.more-1000 {
display: none !important;
}
html,body {
width: 100%;
}
body {
padding-inline: 2.5%;
box-sizing: border-box;
padding-top: 120px;
}
header, footer, .contents {
width: 100%;
}
img {
max-width: 100%;
height: auto;
}
header.less-1000,
header.less-1000 * {
box-sizing: border-box;
}
header.less-1000 {
padding: 0;
position: fixed;
z-index: 10;
inset: 0;
bottom: auto;
width: 100%;
height: 100px;
background: white;
display: flex;
justify-content: space-between;
align-items: center;
gap: 1em;
padding-inline: 1em;
}
header.less-1000 h1 {
width: min(calc(65% - 1em),370px);
max-height: 80px;
aspect-ratio: 5/1;
display: block;
flex-shrink: 1;
}
header.less-1000 h1 a {
display: block;
width: 100%;
height: 100%;
background: url(https://www.toda-dentalclinic.com/wp-content/themes/humanity/images/common/group_logo.png) center / contain no-repeat;
font-size: 0;
}
header.less-1000 .btns {
display: grid;
grid-template: auto / 1fr 1fr;
gap: .7em;
width: min(35%,215px);
place-items: center center;
}
@media only screen and (max-width: 400px) {
header.less-1000 h1 {
width: 59%;
max-height: 80px;
aspect-ratio: 5/1;
display: block;
flex-shrink: 1;
}
header.less-1000 .btns {
width: 40%;
gap: .5em;
}
}
header.less-1000 .btns a {
margin: 0;
}
header.less-1000 .btns a span {
white-space: pre-wrap;
word-break: keep-all;
}
@media only screen and (max-width: 640px) {
header.less-1000 .btns p.contact_btn>*:is(a,span) {
font-size: 90% !important;
}
}
header.less-1000 .btns p.contact_btn {
width: 100%;
height: 65px;
box-sizing: border-box;
font-size: 13px;
line-height: 1.5;
transition: all .2s ease-in-out;
cursor: pointer;
}
header.less-1000 .btns p.contact_btn:hover {
opacity: .8;
}
header.less-1000 .btns p.contact_btn > a {
width: 100%;
height: 100%;
}
header.less-1000 .btns p.contact_btn > *:is(a,span) {
font: inherit;
}
header.less-1000 .btns p.trigger {
border: 1px solid #F29701;
background: #F29701;
color: white;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
gap: 4px;
text-align: center;
border-radius: 6px;
letter-spacing: .05em;
transition: all .2s ease-in-out;
}
body.nav-active header.less-1000 .btns p.trigger {
background: white;
color: #F29701;
}
header.less-1000 .btns p.trigger span.svg {
width: 30%;
aspect-ratio: 1/1;
display: block;
position: relative;
transition: all .2s ease-in-out;
}
header.less-1000 .btns p.trigger span.svg::before,
header.less-1000 .btns p.trigger span.svg::after {
content: "";
display: block;
inset: 0;
width: 100%;
height: 100%;
position: absolute;
-webkit-mask-image: url(images/menu.svg);
mask-image: url(images/menu.svg);
-webkit-mask-position: center;
-webkit-mask-size: contain;
-webkit-mask-repeat: no-repeat;
mask-position: center;
mask-size: contain;
mask-repeat: no-repeat;
background: white;
transform: scale(2,1);
transition: all .2s ease-in-out;
pointer-events: none;
}
header.less-1000 .btns p.trigger span.svg::after {
-webkit-mask-image: url(images/close.svg);
mask-image: url(images/close.svg);
background: #F29701;
opacity: 0;
}
body.nav-active header.less-1000 .btns p.trigger span.svg::before {
opacity: 0;
}
body.nav-active header.less-1000 .btns p.trigger span.svg::after {
opacity: 1;
}
body:not(.nav-active) header.less-1000 .btns p.trigger span.close {
display: none !important;
}
body.nav-active header.less-1000 .btns p.trigger span.open {
display: none;
}
header.less-1000 nav {
opacity: 0;
pointer-events: none;
z-index: -1;
position: fixed;
width: 100%;
height: calc(100dvh - 100px);
top: 100px;
left: 0;
right: 0;
bottom: 0;
overflow-y: auto;
background: white;
transition: opacity .2s ease-in-out;
}
body.nav-active header.less-1000 nav {
opacity: 1;
pointer-events: auto;
z-index: calc(infinity);
padding: 2em;
box-sizing: border-box;
background: #FEF4EB;
}
body.nav-active header.less-1000 nav ul + ul {
margin-bottom: 2em;
}
body.nav-active header.less-1000 nav ul:first-of-type {
margin-bottom: 1em;
}
body.nav-active header.less-1000 nav ul {
display: grid;
grid-template: auto / repeat(3,1fr);
gap: 1em;
}
@media only screen and (max-width: 640px) {
body.nav-active header.less-1000 nav ul {
grid-template: auto / repeat(2,1fr);
}
}
body.nav-active header.less-1000 nav ul.two {
grid-template: auto / repeat(2,1fr);
}
body.nav-active header.less-1000 nav ul a {
text-align: center;
height: 100%;
background: white;
border: 1px solid #F29701;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
line-height: 1;
font-weight: bold;
gap: 2px;
font-size: 13px;
padding: 1.5em .6em;
box-sizing: border-box;
border-radius: 8px;
transition: all .2s ease-in-out;
}
body.nav-active header.less-1000 nav ul a:hover {
opacity: .8;
}
body.nav-active header.less-1000 nav ul a:has(>wbr),
body.nav-active header.less-1000 nav ul a *:has(>wbr) {
white-space: pre-wrap;
word-break: keep-all;
}
body.nav-active header.less-1000 nav ul.two a {
background: #F29701;
color: white;
}
body.nav-active header.less-1000 nav ul.blue a {
border-color: #1ABAFD;
}
body.nav-active header.less-1000 nav ul.gray a {
border-color: #DFDFDC;
}
body.nav-active header.less-1000 nav ul a span {
font: inherit;
}
header.less-1000 .reserve {
width: 100%;
margin-bottom: 2em;
display: grid;
grid-template: auto / 1fr 1fr;
gap: 2em;
}
@media only screen and (max-width: 400px) {
header.less-1000 .reserve {
grid-template: auto / 100%;
place-items: center;
}
}
header.less-1000 .reserve .tel {
float: none;
border: 0;
margin: 0;
padding: 0 20%;
width: fit-content;
position: relative;
font-weight: bold;
}
header.less-1000 .reserve .tel * {
font-weight: bold;
}
@media only screen and (min-width: 401px) {
header.less-1000 .reserve .tel:first-of-type::after {
content: "";
display: block;
width: 2px;
height: 100%;
background: #DFDFDC;
position: absolute;
top: 0;
right: calc(-1 * (1em + 1px));
bottom: 0;
pointer-events: none;
}
header.less-1000 .reserve .tel {
width: 100%;
padding: 0;
}
}
@media only screen and (max-width: 400px) {
header.less-1000 .reserve .tel:first-of-type::after {
content: "";
display: block;
width: 100%;
height: 2px;
right: 0;
left: 0;
top: auto;
background: #DFDFDC;
position: absolute;
bottom: calc(-1 * (1em + 1px));
}
}
header.less-1000 .reserve .tel .tel-time {
justify-content: flex-start;
align-items: center;
margin-top: 1em;
gap: 8px;
}
header.less-1000 .reserve .tel .web {
margin-left: 0;
padding: 1em;
margin-top: 1em;
width: min(100%,240px);
}
.featurea li,
.featurea li:nth-child(2) .chiryo,
.featurea li * {
line-height: 1.5 !important;
}
.featurea li img {
width: 10%;
}
body.p-home .otonakodomoshika {
grid-row: 1 / 2;
grid-column: 1 / 2;
position: static;
padding-top: 0 !important;
margin-bottom: 0 !important;
}
body.p-home .mainPhoto {
grid-row: 2 / 3;
grid-column: 1 / 2;
position: static;
margin-bottom: 0 !important;
}
.featurea ul {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
padding: 2em;
}
.featurea li {
width: min(95%,400px) !important;
border-left: 0 !important;
border-right: 0 !important;
padding: 0;
float: none !important;
display: flex;
justify-content: flex-start;
align-items: center;
gap: 1em;
}
.featurea li span {
position: static !important;
}
.featurea li:not(:first-of-type) {
margin-top: .7em;
padding-top: .7em;
border-top: 1px dashed #DFDFDC;
}

/*---- Needs ----*/
.needs ul.cf {
display: grid;
grid-template: auto / 1fr 1fr;
gap: 1em;
}
.needs ul.cf::after {
display: none;
}
.needs ul.cf li,
.needs ul.cf li a,
.needs ul.cf li a img {
float: none;
width: 100%;
height: auto;
position: static;
display: block;
}
.needs li img {
position: static !important;
}

/*---- Pickup ----*/
.pickup .concept {
padding-top: 25em;
background-position: center top;
}
.pickup .concept p:nth-of-type(1),
.pickup .concept p:nth-of-type(2) {
width: 100%;
box-sizing: border-box;
margin-inline: 0;
}
.pickup .concept h3 {
text-align: center;
}
.pickup .concept h3 img {
margin-inline: auto;
}

.ministry {
background-position: center top;
padding-top: 8em;
padding-inline: .8em;
box-sizing: border-box;
}
.ministry p {
width: 100% !important;
padding-inline: 0 !important;
margin-inline: 0 !important;
}

.risk,
.lipkun {
width: 100%;
flex-direction: column;
gap: 1.6em;
}
.risk .risk-left ul {
width: 100%;
height: auto;
}
.lipkun {
gap: 1.2em;
flex-direction: column-reverse;
}
*:is(.lipkun,.risk) *:is(.risk-right,.risk-left,.txt) {
float: none;
margin-inline: 0;
width: 100%;
}
.lipkun p br {
display: none;
}
.risk .risk-right iframe {
width: 100%;
aspect-ratio: 16/9;
height: auto;
}

section.award {
width: 100%;
}

.pickup .one-box h3 {
background: url(../images/top/minilogo.png) no-repeat 220px center, url(../images/top/minilogo.png) no-repeat right 220px center;
background-size: 40px auto;
font-size: 22px;
border: 1px solid #ffae00;
margin-bottom: 15px;
padding: 8px 0 6px;
text-align: center;
border-radius: 10px;
}
.pickup .one-box h3 {
padding-inline: 3em;
box-sizing: border-box;
background-position: left 3% center, right 3% center;
}
.one-box div h4 {
	margin-bottom: 1em;
    font-size: 20px;
    text-indent: -6px;
}

.pickup .one-box a {
width: 100%;
height: auto;
}
.img-left {
margin-inline: 0;
width: 100%;
}
.one-box::after {
content: "";
display: block;
width: 0;
height: 0;
clear: both;
}
.one-box div {
padding-top:  0;
padding-bottom: 3em;
}
.one-box div.mincho,
.pickup .box .rightCnt {
width: 100%;
max-width: 600px;
margin-inline: calc((100% - min(100%,600px)) / 2);
}
.one-box div.mincho div,
.pickup .box .rightCnt div {
width: 100%;
float: none;
}
.one-box div.mincho,
.pickup .box .rightCnt {
display: flex;
justify-content: center;
align-items: center;
gap: 1em;
flex-direction: row-reverse;
}
.pickup .box .rightCnt {
flex-direction: column-reverse;
}
.one-box div dl {
z-index: 2;
}
.img-left {
margin-bottom: 3em;
}

@media only screen and (max-width: 480px) {
/* .one-box div.mincho,
.pickup .box .rightCnt {
flex-direction: column;
text-align: center;
} */
/* .one-box div.mincho img,
.pickup .box .rightCnt img {
position: static;
}
.img-left {
margin-bottom: 0;
} */
}

.two-box:nth-of-type(odd),
.two-box:nth-of-type(even),
.three-box {
width: 100%;
float: none;
margin: 0;
}
@media only screen and (min-width: 520px) {
div:has(> .two-box) {
display: grid;
grid-template: auto / 1fr 1fr;
gap: 1em;
}
div.kodawari:has(> .two-box) {
grid-template: auto / 1.2fr 1fr;
}
div:has(> .three-box) {
display: grid;
grid-template: auto / 1fr 1fr 1fr;
gap: 1em;
}
}
@media only screen and (max-width: 840px) {
.pickup .two-box h3 span.bg, .pickup .three-box h3 span.bg {
padding-left: 0;
background: none;
}
.pickup .two-box h3, .pickup .three-box h3 {
font-size: min(20px,4vw);
}
}
.pickup .two-box h3 {
margin-bottom: .5em;
}

section.menu {
display: none;
}

/*--- promise --- */
.promise {
width: 100%;
float: none;
}
.promise .photo {
width: 55%;
margin-left: 45%;
position: absolute;
top: 20%;
right: 0;
}
.d-vice {
position: relative;
z-index: 2;
top: 5%;
}

/*--- kodawari ---*/
.kodawari .two-box:nth-of-type(1),
.kodawari .two-box:nth-of-type(2) {
width: 100%;
margin-inline: 0;
float: none;
}
@media only screen and (max-width: 930px) {
div.kodawari:has(> .two-box) {
grid-template: auto auto / 100%;
}
.kodawari .two-box:nth-of-type(1) img {
width: 100%;
position: static;
}
}
.kodawari .two-box:nth-of-type(2) ul {
box-sizing: border-box;
max-width: 500px;
margin-inline: auto;
display: flex;
justify-content: center;
align-items: center;
flex-wrap: wrap;
gap: .5em;
}
.kodawari .two-box:nth-of-type(2) ul li {
margin: 0;
width: calc((100% - 1em) / 3);
}
.kodawari .two-box:nth-of-type(2) p:nth-of-type(2) {
width: 100%;
}
.kodawari .two-box:nth-of-type(2) li a {
padding: 8px;
}
@media only screen and (max-width: 640px) {
.kodawari .two-box:nth-of-type(2) li a {
font-size: 80%;
}
/*
.kodawari .two-box:nth-of-type(2) ul {
display: flex;
flex-direction: column;
gap: 1em;
}
.kodawari .two-box:nth-of-type(2) ul li {
margin: 0;
width: 100%;
} */
.kodawari * {
box-sizing: border-box;
}
}

.ttl-topics {
background: none;
display: flex;
margin-bottom: 1em;
grid-row: 1 / 2;
}
.ttl-topics::after {
content: "TDC Style";
font-weight: bold;
color: #8F8F8F;
text-align: center;
line-height: 1;
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAALUlEQVR4AVzLwQkAQAgDwTsbSv9lpCIlgqLuc2DtnUj6QgGA31igMXFC4gVhAAAA//93JmwRAAAABklEQVQDAOPsE32dC+BvAAAAAElFTkSuQmCC) repeat;
display: flex;
justify-content: center;
align-items: center;
flex-grow: 1;
border-right: 1px solid #d1d1d1;
border-bottom: 1px solid #d1d1d1;
border-top: 1px solid #d1d1d1;
box-sizing: border-box;
}
.ttl-topics span {
width: 150px;
text-align: center;
margin: 0;
flex-grow: 0;
}
.topics {
display: grid;
grid-template: auto / auto;
grid-auto-flow: row;
}
.topics .two-box.box1,
.topics .two-box.box2,
.topics .two-box.box3 {
grid-row: 3 / 4;
}
.topics .two-box {
grid-row: 2 / 3;
text-align: center;
}
.topics .two-box img {
margin: auto;
}
.topics.cf {
padding-bottom: 0;
margin-bottom: 4em;
border-bottom: none;
}
.topics.cf::after {
display: none;
}

.banner {
width: 100%;
float: none;
}
.banner ul {
width: 100%;
}
.banner li {
text-align: center;
}
.banner li a {
margin: auto;
}

.conference {
width: 100%;
float: none;
}
.info,
.conference,
.blog,
.multinfo {
margin-bottom: 4em;
}
.conference p {
width: min(80%,400px);
margin-inline: auto;
position: static;
}
.news,
.calendar,
.calendar iframe {
width: 100%;
float: none;
padding-inline: 0;
}
.news dl *:is(dt,dd) {
width: 100%;
float: none;
}
@media only screen and (max-width: 640px) {
.news dl *:is(dt,dd) {
font-size: 90%;
font-feature-settings: "palt" 1;
}
}
.news dl {
display: grid;
grid-template: auto / 90px 1fr;
}
.news dl dt {
padding-left: 0;
}
.news dl dd {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.news {
margin-bottom:2em;
}

/*-- blog ---*/
.blog {
display: grid;
grid-template: auto auto auto / 100%;
gap: 2em 0;
}
.blog .ttl-top {
grid-row: 1 / 2;
}
.blog .two-box {
grid-row: 2 / 3;
display: flex;
justify-content: center;
align-items: center;
}
.blog .b-contents {
grid-row: 3 / 4;
float: none;
padding-right: 0;
overflow-x: hidden;
width: 100%;
}
.blog .button {
grid-row: 4 / 5;
text-align: center;
}
.blog .button a {
background: #F29701;
color: white;
font-weight: bold;
border-radius: 8px;
line-height: 1;
display: flex;
justify-content: center;
align-items: center;
width: min(80%, 400px);
margin: auto;
font-size: 130%;
padding: 1em;
box-sizing: border-box;
gap: 8px;
}
.blog .button a i {
font-size: 150%;
}

.multinfo {
display: grid;
grid-template: auto auto / 65% 35%;
}
.multinfo * {
box-sizing: border-box;
}
.multinfo .logo {
grid-row: 1 / 2;
grid-column: 1 / 2;
}
.multinfo .contact_btn {
grid-row: 1 / 2;
grid-column: 2 / 3;
}
.multinfo .contact_btn a {
margin-top: 0;
box-sizing: border-box;
padding: .8em;
}
.multinfo .logo {
width: 100%;
padding-top: 0;
padding-right: 1em;
display: flex;
justify-content: flex-start;
align-items: center;
box-sizing: border-box;
}
.multinfo .reserve {
padding-top: 1em;
grid-row: 2 / 3;
grid-column: 1 / 3;
width: 100%;
display: grid;
grid-template: auto / 1fr 1fr;
}
.multinfo .reserve .tel:nth-child(1),
.multinfo .reserve .tel:nth-child(2) {
width: 100%;
float: none;
text-align: left;
}
.multinfo .reserve .tel:nth-child(1) span.clinic,
.multinfo .reserve .tel:nth-child(2) span.clinic {
font-weight: bold;
}
.multinfo .reserve .tel:nth-child(2) {
width: calc(100% - 14px);
margin-left: 14px;
}
.multinfo h1.dis {
display: none;
}
.tel .tel-time {
justify-content: flex-start;
gap: 4px;
}
.tel .web {
width: max(170px,70%);
padding: 1em;
margin-inline: 0;
}
.info_add p:first-of-type {
font-size: 120%;
font-weight: bold;
}
.timetable table,
.branch .timetable {
width: 100%;
}
.timetable table *,
.branch .timetable * {
box-sizing: border-box;
}
.timetable table th,
.branch .timetable th {
text-align: center;
}
.timetable table *:is(td,th),
.branch .timetable *:is(td,th) {
padding: .4em;
font-size: 80%;
}
.left {
float: none;
width: 100%;
}
.right {
width: 100%;
float: none;
margin-top: 2em;
}
.right img {
width: 100%;
}
.appearance p:first-of-type {
padding: 1em;
box-sizing: border-box;
}

.link {
width: 100%;
}
.link ul {
display: flex;
justify-content: center;
align-items: center;
gap: 1em;
flex-wrap: wrap;
width: min(100%,600px);
margin-inline: auto;
}

.link ul li {
width: calc((100% - 2em) / 3);
display: block;
margin: 0;
}
.link ul li a,
.link ul li a img {
display: block;
width: 100%;
margin: 0;
}


/*--- footer ---*/
@media only screen and (max-width: 600px) {
.tel .tel-link {
font-size: 18px;
}
.tel img {
width: 20px;
}
.tel .tel-time *:is(dt,dd) {
font-size: 80%;
}
@media only screen and (max-width: 480px) {
.tel .tel-link {
font-size: 16px;
}
@media only screen and (max-width: 400px) {
.tel .tel-link {
font-size: 14px;
letter-spacing: -.5px;
}
header.less-1000 .reserve .tel .web {
font-size: 80%;
}
}
header.less-1000 .reserve .tel span.clinic {
font-size: 12px;
}
.tel img {
width: 17px;
transform: translateY(4px);
}
.tel .tel-time *:is(dt,dd) {
font-size: 70%;
}
}
}
footer .multinfo {
display: none;
}
.fNav {
display: grid;
grid-template: auto / repeat(3,1fr);
gap: 1em;
}
.fNav::after {
display: none;
}
.fNav ul,
.fNav .wide-ul {
width: 100%;
float: none;
}
.footerArea {
width: 100%;
}
.footerLink {
width: 100%;
text-align: left;
font-weight: bold;
font-size: 110%;
}
.footerLink a {
display: block;
font-weight: bold;
}
footer .linkBnr {
position: static;
}
footer {
display: grid;
grid-template: auto / auto;
grid-auto-flow: row;
padding-bottom: 4em;
}
footer .multinfo {
grid-row: 1 / 2;
}
footer .fNav {
grid-row: 2 / 3;
margin-bottom: 0;
}
@media only screen and (max-width: 640px) {
footer .fNav {
font-size: 70%;
}
}
footer .linkBnr {
grid-row: 3 / 4;
margin-bottom: 3em;
text-align: center;
}
footer .footerArea {
grid-row: 4 / 5;
}
footer .footerLink {
grid-row: 5 / 6;
}
footer > small {
grid-row: 6 / 7;
display: block;
margin-top: 3em;
}



/*--------- Other pages --------*/
.left-contents,
.right-contents {
width: 100%;
text-align: center;
float: none;
}
.left-contents .banner {
width: min(100%,500px);
margin: 0 auto;
}
.left-contents .banner ul {
width: 100%;
display: grid;
grid-template: auto / repeat(3,1fr);
place-items: center;
gap: 1em;
}
.left-contents .banner ul li {
width: 100%;
margin: 0;
}
body:not(.p-home) .contents  {
display: grid;
grid-template: auto / auto;
}
body:not(.p-home) .contents .mainPhoto {
margin-bottom: 4em;
}
body:not(.p-home) .contents .right-contents {
grid-row: 2 / 3;
text-align: left;
}
body:not(.p-home) .contents .left-contents {
grid-row: 3 / 4;
padding-bottom: 2em;
}
body:not(.p-home) .fNav {
margin-bottom: 2em;
}


/*--- Staff ---*/

.staff .box-two-column,
.esthetics-link {
display: grid;
grid-template: auto / 1fr 1fr;
gap: 1em;
}
@media only screen and (max-width: 768px) {
.staff .box-two-column,
.esthetics-link {
grid-template: auto auto / 100%;
}
}
.staff .box-left, .staff .box-right,
.esthetics-link li {
width: 100%;
margin: 0;
float: none;
}
.staff p:has(.img-border) {
text-align: center;
}
.img-border {
box-sizing: border-box;
width: 100%;
}
@media only screen and (min-width: 641px) {
.img-border.img-right,
div.img-right {
box-sizing: border-box;
width: min(100%, 300px);
}
}
@media only screen and (max-width: 640px) {
.img-border.img-right,
div.img-right {
box-sizing: border-box;
width: 100%;
float: none;
margin: 0;
}
}
.footertimetable table {
width: 100%;
}

.two-column {
display: grid;
grid-template: auto / 1fr 1fr;
gap: 1em;
}
@media only screen and (max-width: 640px) {
.two-column {
grid-template: auto auto / auto;
}
}
.two-column img {
width: 100%;
box-sizing: border-box;
}


/*--- price ---*/
.pricemenu {
display: grid;
grid-template: auto / 1fr 1fr 1fr;
gap: .5em;
}

.price .featurea {
text-align: left;
}
.price .featurea ul {
padding: 0;
text-align: left;
}
.price .featurea ul li {
width: 100% !important;
display: flex;
justify-content: flex-start;
align-items: flex-start;
gap: 0;
}
.price .featurea ul li::before {
content: "・";
display: inline-block;
width: 1em;
flex-shrink: 0;
}
.price .featurea ul li + li {
margin-top: 0;
padding-top: 0;
border-top: 0;
}
.price .box-img-left .img {
width: 100%;
padding: 0;
}
.price .box-img-left {
display: grid;
grid-template: auto auto / auto;
gap: 1em;
}
@media only screen and (min-width: 769px) {
.price .box-img-left {
grid-template: auto / 1fr 1fr;
}
}
.price .list-dot {
margin-top: 1em;
}
@media only screen and (max-width: 768px) {
.price table:is(.table-implant-3,.table-straumann,.cel2,.cel3,.table-normal02) *:is(td,th) {
font-size: 75%;
padding: .4em !important;
white-space: wrap !important;
box-sizing: border-box;
}
}
.price table:is(.table-implant-3,.table-straumann) th:nth-of-type(1) {
width: 20% !important;
}
.price table.table-straumann th:nth-of-type(6),
.price table.table-implant-3 th:nth-of-type(5) {
width: 8% !important;
}
.price table.table-straumann th:nth-of-type(7),
.price table.table-implant-3 th:nth-of-type(6) {
width: 24% !important;
}

/*--- Access ---*/

.map_time .callme {
width: 100%;
float: none;
}
@media only screen and (max-width: 768px) {
.map_time .map_time_table,
.map_time .map,
#gmap,
#gmap2 {
float: none;
width: 100%;
}
#gmap {
margin-top: 1em;
}
.map-wrap {
display: grid;
grid-template: auto / 100%;
gap: 1em;
}
.map_time .map_time_table:nth-of-type(odd) {
border-right: 0;
}
}


/*-- Contact ---*/

@media only screen and (max-width: 640px) {
.contact02 .callme {
width: 100%;
float: none;
}
}
table.table-normal02 *:is(th,td) {
padding: .4em !important;
box-sizing: border-box;
font-size: 80% !important;
}

.box-img-left .img {
width: 100%;
float: none;
padding-right: 0;
display: block;
}
.box-img-left:has(.w110) .img {
text-align: center;
}
.list-emd.cf img {
width: 110px;
box-sizing: border-box;
margin-inline: calc((100% - 110px) / 2);
}
.box-img-left:has(.w110) .img img {
width: 110px;
margin-inline: auto;
box-sizing: border-box;
}
.box-img-left .box {
width: 100%;
display: block;
}
.box-img-left {
display: grid;
grid-template: auto auto / 100%;
gap: 1em;
}
@media only screen and (min-width: 641px) {
.box-img-left .img {
width: 100%;
float: none;
padding-right: 0;
}
.box-img-left {
grid-template: auto / min(30%,110px) 1fr;
}
}

.contact-wrap {
display: grid;
grid-template: auto auto / 100%;
gap: 1em;
margin-top: 2em;
}
@media only screen and (min-width: 641px) {
.contact-wrap {
grid-template: auto / 1fr 30%;
}
.contact-wrap::after {
display: none;
}
.contact-wrap div {
grid-row: 1 / 2;
grid-column: 1 / 2;
}
.contact-wrap > p {
grid-row: 1 / 2;
grid-column: 2 / 3;
}
}
.contact-wrap :is(p,div) {
width: 100%;
float: none;
}
.contact-wrap > p img {
width: 100%;
margin: 0;
}


/*--- むしば ---*/
@media only screen and (max-width: 768px) {
.compare02-wrap {
display: grid;
grid-template: auto auto / 100%;
gap: 1em;
margin-top: 2em;
}
*:is(.compare02,.case-records02),
*:is(.compare02,.case-records02) li {
width: 100%;
float: none;
position: static;
text-align: center;
}
*:is(.compare02,.case-records02) li:last-child {
padding-left: 0;
padding-top: 2em;
background: none;
}
*:is(.compare02,.case-records02) li:last-child::before {
content: "";
display: block;
width: 20%;
margin: auto;
aspect-ratio: 64/32;
background: url(//www.toda-dentalclinic.com/wp-content/themes/humanity/css/../images/common/arrow04.png) center / contain no-repeat;
transform: rotate(90deg);
transform-origin: center;
}
*:is(.case-records02) li:last-child::before {
width: 20%;
margin-block: 1em;
background-image: url(https://www.toda-dentalclinic.com/wp-content/themes/humanity/images/common/arrow02.png);
}
*:is(.compare02) li:last-child img {
margin-top: 2.5em;
}
*:is(.compare02) li:last-child::before {
width: 20%;
margin-block: 1em;
}
}
.img-column {
width: 100%;
position: absolute;
float: none;
margin-inline: 0;
}
*:is(.img-column, .img-column02) {
display: grid;
grid-template: auto / repeat(3,1fr);
gap: .5em;
}
@media only screen and (max-width: 640px) {
*:is(.img-column, .img-column02) {
grid-template: auto auto auto / 100%;
}
}
*:is(.img-column, .img-column02) li {
float: none;
width: 100%;
margin: 0;
}


/*-- 親知らず ---*/
.extraction .w600 {
width: 100%;
box-sizing: border-box;
margin-inline: 0;
}
@media only screen and (max-width: 768px) {
.case-list td {
width: 100% !important;
display: block;
box-sizing: border-box;
}
}


/*-- 歯周病 ---*/
.denture-prg {
display: grid;
grid-template: auto auto auto / 100%;
gap: 1em;
max-width: 400px;
margin-inline: auto;
}
@media only screen and (min-width: 769px) {
.denture-prg {
grid-template: auto / repeat(3, 1fr);
}
}
.denture-prg * {
box-sizing: border-box;
}
.denture-prg li {
width: 100%;
margin: 0;
}
.denture .compare-pre-img {
width: 100%;
box-sizing: border-box;
}

*:is(.halitosis-link,.implant-link,.perio-prg) {
display: grid;
grid-template: auto / repeat(4,1fr);
gap: 1em;
}
.perio-prg {
width: min(100%,730px);
grid-template: auto / repeat(2,1fr);
}
*:is(.halitosis-link,.implant-link,.perio-prg) li,
*:is(.halitosis-link,.implant-link,.perio-prg) li a {
display: grid;
grid-template-rows: subgrid;
grid-row: span 3;
gap: 0;
}
*:is(.halitosis-link,.implant-link,.perio-prg) li {
width: 100%;
float: none;
margin: 0 !important;
}
@media only screen and (max-width: 768px) {
*:is(.halitosis-link,.implant-link,.perio-prg) {
grid-template: auto / repeat(2,1fr);
}
.perio-prg .ttl {
font-size: 12px;
display: flex;
justify-content: center;
align-items: center;
}
}
@media only screen and (max-width: 640px) {
*:is(.halitosis-link,.implant-link) {
/*grid-template: auto auto auto auto / 100%;*/
}
}

.box-two-column.cf.implantColumn {
display: grid;
grid-template: auto / 1fr 1fr;
gap: 0 2em;
}
@media only screen and (max-width: 640px) {
.box-two-column.cf.implantColumn {
grid-template: auto auto / 100%;
}
}
.implantColumn.box-two-column .box-left,
.implantColumn.box-two-column .box-right {
width: 100%;
margin: 0;
float: none;
container-type: inline-size;
container-name: impcolumn;
}
@container impcolumn (max-width: 350px) {
.implantColumn.box-two-column .box-left,
.implantColumn.box-two-column .box-right {
grid-template: auto auto 100%;;
}
.implantColumn.box-two-column .box-img-left .img {
padding-right: 0;
}
}

.white-box-wrap .img-column02 li,
.white-box-wrap .img-column02 li a {
display: grid;
grid-template-rows: subgrid;
grid-row: span 2;
gap: 0;
}
.white-box-cnt img {
width: 100%;
}
.white-box-wrap .img-column02 li a .ttl-btn-gr {
display: flex;
justify-content: center;
align-items: center;
}

@media only screen and (max-width: 640px) {
.whitening .flow-gaiyo,
.list-flow.cf,
.whitening .step,
.list-emd {
width: min(100%,400px);
margin-inline: auto;
display: grid;
grid-template: auto / 100%;
grid-auto-flow: row;
}
.whitening .flow-gaiyo::after,
.list-flow.cf::after,
.whitening .step::after,
.list-emd::after {
display: none;
}
.whitening .flow-gaiyo li,
.list-flow.cf li,
.whitening .step li,
.list-emd li {
float: none;
width: 100%;
padding: 0;
background: none;
}
.list-flow.cf li,
.whitening .step li {
text-align: center;
}
.whitening .flow-gaiyo li:not(:first-of-type)::before,
.list-flow.cf li:not(:first-of-type)::before,
.whitening .step li:not(:first-of-type)::before,
.list-emd li:not(:first-of-type)::before {
content: "";
display: block;
width: 10%;
margin-inline: auto;
aspect-ratio: 1/1;
margin-bottom: 1em;
transform: rotate(90deg);
background: url(//www.toda-dentalclinic.com/wp-content/themes/humanity/images/whitening/whiteningIconArrow001.png) center top / contain no-repeat;
}


.whitening .flow-gaiyo img {
width: 120px;
box-sizing: border-box;
margin-inline: calc((100% - 120px) / 2);
}
.whitening .flow-gaiyo li {
text-align: center;
font-size: 13px;
}
}

@media only screen and (max-width: 768px) {
.whitening .img-column {
display: grid;
grid-template: auto auto  / 100%;
gap: 1em;
position: static;
float: none;
width: min(100%,300px);
margin-inline: calc((100% - min(100%,300px)) / 2);
}
.whitening .img-column li {
position: static;
width: 100%;
margin: 0;
}
.whitening .img-column li img {
width: 100%;
}
}
@media only screen and (min-width: 769px) {
.whitening .img-column {
width: fit-content;
display: grid;
grid-template: auto / 1fr 1fr;
gap: 1em;
margin-inline: auto;
}
.whitening .img-column li {
width: fit-content;
}
}


.box-img-left.yobou .img {
text-align: center;
}
.box-img-left.yobou .img img {
margin-inline: auto;
}

@media only screen and (max-width: 640px) {
span.column {
top: -28px;
transform: rotate(-4deg) scale(.9);
}
.ttl-btn-gr:has(span.column) {
margin-top: 3em;
}
}

@media only screen and (min-width: 641px) {
.list-emd.cf {
width: 100%;
position: static;
float: none;
display: flex;
justify-content: space-between;
}
}
.list-emd.cf li {
position: static;
float: none;
flex-shrink: 1;
box-sizing: border-box;
}
@media only screen and (max-width: 768px) {
.list-emd {
position: static;
float: none;
width: min(100%,400px);
margin-inline: auto;
display: grid;
grid-template: auto / 100%;
grid-auto-flow: row;
}
.list-emd::after {
display: none;
}
.list-emd li {
float: none;
width: 100%;
padding: 0;
background: none;
text-align: center;
}
.list-emd li:not(:first-of-type)::before {
content: "";
display: block;
width: 10%;
margin-inline: auto;
aspect-ratio: 1/1;
margin-block: 1em;
transform: rotate(90deg);
background: url(//www.toda-dentalclinic.com/wp-content/themes/humanity/images/whitening/whiteningIconArrow001.png) center top / contain no-repeat;
}
}

/*---Blog---*/
.post {
margin-left: 0;
width: 100%;
box-sizing: border-box;
}
.roop {
min-height: 0;
padding-bottom: 4em;
}
.less-1000 .sidebar {
margin-top: 4em;
}
.roop .post .size-full, .roop .post img {
height: auto;
}
.roop .post .size-full, .roop .post img, .roop .post iframe {
max-width: 100%;
}
.sidebar {
text-align: left;
}


/*--Branch---*/
.branch .gallery .innerwrap {
width: 100%;
box-sizing: border-box;
}
.branch .gallery .bx-wrapper,
.branch .gallery .controlWrap .bx-wrapper {
width: calc(100% - 80px);
}
@media only screen and (max-width: 640px) {
.branch .gallery .controlWrap {
display: none;
}
.branch .gallery {
padding-bottom: 0;
}
}

.box-two-column {
width: 100%;
display: grid;
grid-template: auto / 1fr 1fr;
gap: 2em;
}
@media only screen and (max-width: 640px) {
.box-two-column {
grid-template: auto auto / 100%;
gap: 1em;
}
}
.box-two-column .box-left,
.box-two-column .box-right {
width: 100%;
float: none;
margin: 0;
}
@media only screen and (max-width: 640px) {
.branch .divide {
display: flex;
flex-direction: column;
gap: 1em;
}
.branch .divide .div_box {
width: 100%;
}
}

.correct-link {
display: grid;
grid-template: auto auto  / 1fr 1fr 1fr 1fr;
gap: 1em;
}
@media only screen and (max-width: 768px) {
.correct-link {
grid-template: auto auto  / 1fr 1fr;
}
}
.correct-link li {
width: 100%;
margin: 0;
float: none;
}
.correct-link li,
.correct-link li a {
display: grid;
grid-template-rows: subgrid;
grid-row: span 2;
}
.correct-link li a .txtLikeImg {
height: 100%;
line-height: 1;
display: flex;
justify-content: center;
align-items: center;
}

@media only screen and (max-width: 640px) {
.ttl-btn-s-or.center {
box-sizing: border-box;
margin-inline: calc((100% - 210px) / 2);
}
}

@media only screen and (max-width: 640px) {
.box-two-column.cf.mb10.implantColumn {
display: grid;
grid-template: auto / 1fr 1fr;
gap: 1em;
}
.box-two-column.cf.mb10.implantColumn .ttl-btn-s-or {
width: 100%;
text-align: center;
box-sizing: border-box;
}
}

@media only screen and (max-width: 640px) {
.whitening .step img {
width: min(100%,110px);
margin-inline: calc((100% - min(100%,110px)) / 2);
}
}
.box-img-right.recruit {
display: grid;
grid-template: auto / 1fr 60%;
gap: 1em;
}
@media only screen and (max-width: 640px) {
.box-img-right.recruit {
display: grid;
grid-template: auto / 100%;
gap: 1em;
}
}
.box-img-right *:is(.box,.img) {
display: block;
width: 100%;
padding: 0;
}

div.post {
text-align: left;
}
@media only screen and (max-width: 640px) {
div.post {
padding: 24px;
}
}

.img-column-wrap.renewed {
overflow: visible;
position: static;
}
.img-column-wrap.renewed:not(.renewed2) ul.img-column {
grid-template: auto/repeat(2,1fr);
}
@media only screen and (max-width: 640px) {
.img-column-wrap.renewed ul.img-column {
grid-template: auto/100% !important;
}
}
.img-column-wrap.renewed ul.img-column,
.img-column-wrap.renewed ul.img-column li {
position: static;
float: none;
width: 100%;
}

body.prevent .img-column-wrap.renewed ul.img-column {
width: 50%;
margin-inline: 25%;
}


} /* max-width: 1000px media query */


@media only screen and (min-width: 481px) {
br.sp {
display: none !important;
}
}