@charset "utf-8";

/*--------------------------------------
mv
---------------------------------------*/
.l-mv {
position: relative;
min-height: 50rem;
padding: 2rem 0 0 0;
}
.l-mv::before {
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
width: 100vw;
height: 76%;
background: url(img/mv_bg_02.png) no-repeat left top;
background-size: cover;
content: "";
z-index: -1;
}
.l-mv-wrapper {
position: relative;
width: 110rem;
margin: 0 auto;
}
.l-mv-box {
position: relative;
width: 48rem;
padding: 0 0 2rem 0;
}
.l-mv-box::before {
position: absolute;
left: calc(100% + 8rem);
top: 2rem;
width: 64rem;
height: 43.2rem;
background: url(img/mv_bg_01.png) no-repeat left top;
background-size: contain;
content: "";
z-index: -1;
}
.l-mv-logo {
width: 16.2rem;
margin: 0 0 6rem 0;
}
.l-mv-title {
margin: 0 0 1.5rem 0;
font-size: 2.3rem;
font-weight: bold;
line-height: 1.4;
}
.l-mv-title span {
display: inline-block;
margin: 0.5rem 0 0 0;
padding: 0 0.2rem 0.1rem 0.2rem;
background: #fff;
color: #34bce0;
font-size: 3.2rem;
letter-spacing: 0.3rem;
}
.l-mv-title span span {
font-size: 3.8rem;
}
.l-mv-txt p:not([class]) {
margin: 1em 0 0 0;
}
.l-mv-txt p:not([class]) > span:not([class]) {
background: linear-gradient(transparent 50%, #fffe7f 50%);
color: #003788;
font-weight: bold;
}


/*--------------------------------------
l-parts02
---------------------------------------*/
.l-parts02 {
position: relative;
padding: 8rem 0;
}
.l-parts02::before {
position: absolute;
left: 0;
top: 0;
width: 100vw;
height: 100%;
background: #e7fff9;
background: -webkit-linear-gradient(0deg, rgba(197,216,237,1) 0%, rgba(203,231,226,1) 100%);
background: linear-gradient(0deg, rgba(197,216,237,1) 0%, rgba(203,231,226,1) 100%);
content: "";
opacity: 0.3;
z-index: -1;
}
.l-parts02::after {
position: absolute;
left: 0;
top: 0;
width: 100vw;
height: 100%;
background: url(img/parts02_bg_01.png) no-repeat center top 16rem, url(img/parts02_bg_01.png) no-repeat center bottom 8rem;
background-size: 100% auto;
content: "";
z-index: -2;
}
.l-parts02 .l-common-title {
margin: 0 auto 6rem auto;
}
.l-parts02-clinic {
position: relative;
margin: 0 0 10rem 0;
background: #fff;
border-radius: 2rem;
}
.l-parts02-clinic:last-child {
margin: 0;
}
.l-parts02 .catch-title {
min-height: 12rem;
padding: 3rem 2rem 5rem 2rem;
background: url(img/title_bg_04.png) no-repeat left bottom;
background-size: 100% auto;
border-radius: 2rem 2rem 0 0;
color: #fff;
font-size: 3.2rem;
font-weight: bold;
line-height: 1.4;
text-align: center;
}
.l-parts02-clinic > .inner {
padding: 4rem 5.5rem;
}
.l-parts02 .catch {
margin: 0 0 5rem 0;
color: #34bce0;
font-size: 3rem;
font-weight: bold;
line-height: 1.4;
text-align: center;
}
.l-parts02 .name {
position: relative;
font-size: 2.8rem;
font-weight: bold;
line-height: 1.4;
text-align: center;
z-index: 2;
}
.l-parts02 .name::before {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 8rem;
height: 8rem;
background: url(img/title_bg_05.png) no-repeat left top;
background-size: contain;
content: "";
z-index: -1;
}
.l-parts02 .float-wrap .float-img.ct {
width: 54rem;
}
.l-parts02 .title {
position: relative;
margin: 7rem 0 3rem 0;
text-align: center;
}
.l-parts02 .title::before {
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
width: 100%;
height: 0.1rem;
border-top: 1px solid #34bce0;
content: "";
}
.l-parts02 .title span {
display: inline-block;
position: relative;
max-width: 90%;
padding: 0 2rem;
background: #fff;
font-size: 2.2rem;
font-weight: bold;
line-height: 1.4;
}
.block-feature .box {
margin: 0 0 3rem 0;
padding: 2rem 4rem;
background: #f3f3f3;
border-radius: 1rem;
}
.block-feature .box .ttl {
display: flex;
align-items: center;
min-height: 4.8rem;
padding: 0 0 0 7rem;
background: url(img/title_bg_06.png) no-repeat left center;
background-size: 57px auto;
color: #1a5ec4;
font-size: 2.1rem;
font-weight: bold;
line-height: 1.4;
}
.l-parts02 .box-wrap .box {
margin: 0;
background: #f5f7fa;
}
.l-parts02 .box-wrap .box-head {
padding: 1rem;
text-align: center;
}
.l-parts02 .box-wrap .box-head .ttl {
font-size: 2rem;
}
.l-parts02 .box-wrap .box-body .caption {
text-align: center;
}
.l-parts02 .inner > ul:not([class]) {
padding: 2rem 3rem;
background: #f5f7fa;
}
.block-info {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.block-info .box-fig {
width: 40rem;
}
.block-info .box-fig iframe {
width: 100%;
height: 100%;
border: none;
}
.block-info .box-txt {
width: calc(100% - 40rem);
padding: 0 0 0 3rem;
}
.block-info .box-txt table {
margin: 0;
}


/*--------------------------------------
l-parts03
---------------------------------------*/
.l-parts03 .l-section-inner {
padding: 10rem 0 0 0;
background: url(img/parts03_bg_01.png) no-repeat left top 6rem;
}
.l-parts03 .accordion-btn::after {
content: "山形市の矯正歯科クリニックを\Aもっと見る";
white-space: pre;
}


/*--------------------------------------
l-parts04
---------------------------------------*/
.l-parts04 {
padding: 8rem 0 4rem 0;
background: #f3f3f3;
}
.l-parts04 .frame-wrap .frame {
background: #fff;
}
.l-parts04 .frame-wrap .frame-head .ttl {
font-size: 2rem;
}


/*--------------------------------------
l-parts05
---------------------------------------*/
.l-parts05 {
padding: 8rem 0 12rem 0;
background: url(img/parts05_bg_01.png) no-repeat right top 1rem, url(img/parts05_bg_02.png) no-repeat left 1rem bottom 3rem;
}
.l-parts05 .block {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.l-parts05 .block .box {
width: calc((100% - 4rem) / 2);
margin: 0 0 4rem 0;
}
.l-parts05 .block .box .fig {
margin: 0 0 2rem 0;
text-align: center;
}
.l-parts05 .block .box .ttl {
display: flex;
align-items: center;
width: 100%;
margin: 0 0 1.5rem 0;
padding: 0 1.5rem 0 0;
font-size: 2.8rem;
font-weight: 700;
line-height: 1.4;
}
.l-parts05 .block .box .ttl a {
display: block;
width: 100%;
padding: 0 2rem 0 0;
background: url(img/arrow01_black.svg) no-repeat right center;
background-size: 10px auto;
color: inherit;
text-decoration: none;
}


/*--------------------------------------
l-parts06
---------------------------------------*/
.l-parts06 {
padding: 7rem 0 4rem 0;
background: #c7f0fe url(img/parts06_bg_02.jpg) no-repeat center top;
background-size: cover;
}


/*--------------------------------------
l-parts07
---------------------------------------*/
.l-parts07 {
padding: 8rem 0 0 0;
}
.l-parts07 .title {
margin: 4rem 0 2rem 0;
padding: 2rem 2rem 2rem 9rem;
background: #abe3f2 url(img/title_bg_07.png) no-repeat left 1rem center;
background-size: 56px auto;
border-radius: 1rem;
color: #003788;
font-size: 2.4rem;
font-weight: bold;
line-height: 1.4;
}
.l-parts07 .title a {
display: block;
width: 100%;
padding: 0 2rem 0 0;
background: url(img/arrow01_black.svg) no-repeat right center;
background-size: 10px auto;
color: inherit;
text-decoration: none;
}




















@media screen and (max-width: 480px) {

/*--------------------------------------
mv
---------------------------------------*/
.l-mv {
min-height: auto;
margin: 0 0 2rem 0;
padding: 0;
}
.l-mv::before {
display: none;
content: none;
}
.l-mv-wrapper {
width: 100%;
}
.l-mv-box {
width: 100%;
padding: 0;
}
.l-mv-box::before {
display: none;
content: none;
}
.l-mv-logo {
width: 12rem;
margin: 0 auto 1.5rem auto;
}
.l-mv-txt {
padding: calc(67.5% + 2rem) 1.5rem 3rem 1.5rem;
background: url(img/mv_bg_01.png) no-repeat center top 2rem, url(img/mv_bg_03.png) no-repeat center top;
background-size: calc(100% - 3rem) auto, 100% 100%;
}
.l-mv-title {
margin: 0 0 1.5rem 0;
font-size: 1.8rem;
font-weight: bold;
line-height: 1.4;
}
.l-mv-title span {
font-size: 2.4rem;
letter-spacing: 0;
}
.l-mv-title span span {
font-size: 2.8rem;
}


/*--------------------------------------
l-parts02
---------------------------------------*/
.l-parts02 {
padding: 4rem 0;
}
.l-parts02::after {
background: url(img/parts02_bg_01.png) no-repeat center top 8rem, url(img/parts02_bg_01.png) no-repeat center bottom 4rem;
background-size: 100% auto;
}
.l-parts02 .l-common-title {
margin: 0 auto 4rem auto;
}
.l-parts02-clinic {
margin: 0 0 5rem 0;
}
.l-parts02 .catch-title {
min-height: auto;
padding: 2rem 1.5rem;
font-size: 2rem;
}
.l-parts02-clinic > .inner {
padding: 3rem 1.2rem;
}
.l-parts02 .catch {
margin: 0 0 3rem 0;
color: #34bce0;
font-size: 2.1rem;
font-weight: bold;
line-height: 1.4;
text-align: center;
}
.l-parts02 .name {
font-size: 2.1rem;
}
.l-parts02 .name::before {
width: 7rem;
height: 7rem;
}
.l-parts02 .float-wrap .float-img.ct {
width: 100%;
}
.l-parts02 .title {
margin: 4rem 0 3rem 0;
}
.l-parts02 .title span {
max-width: 86%;
padding: 0 1rem;
font-size: 2rem;
}
.block-feature .box {
padding: 2rem;
}
.l-parts02 .box-wrap .box {
margin: 0 0 3rem 0;
}
.l-parts02 .box-wrap .box:last-child {
margin: 0;
}
.block-feature .box .ttl {
font-size: 1.8rem;
}
.l-parts02 .box-wrap .box-head .ttl {
font-size: 1.8rem;
}
.l-parts02 .inner > ul:not([class]) {
padding: 2rem;
}
.block-info {
display: block;
}
.block-info .box-fig {
width: 100%;
margin: 0 0 2rem 0;
}
.block-info .box-fig iframe {
height: 24rem;
}
.block-info .box-txt {
width: 100%;
padding: 0;
}


/*--------------------------------------
l-parts03
---------------------------------------*/
.l-parts03 .l-section-inner {
padding: 4rem 1.5rem 0 1.5rem;
background: url(img/parts03_bg_01.png) no-repeat left 2rem top 2rem;
background-size: 60px auto;
}


/*--------------------------------------
l-parts04
---------------------------------------*/
.l-parts04 {
padding: 4rem 0 2rem 0;
background: #f5f7fa;
}
.l-parts04 .frame-wrap .frame-head .ttl {
font-size: 1.8rem;
}


/*--------------------------------------
l-parts05
---------------------------------------*/
.l-parts05 {
padding: 4rem 0;
background-size: 50% auto;
}
.l-parts05 .block {
display: block;
}
.l-parts05 .block .box {
width: 100%;
margin: 0 0 4rem 0;
}
.l-parts05 .block .box .fig {
margin: 0 0 2rem 0;
text-align: center;
}
.l-parts05 .block .box .ttl {
padding: 0;
font-size: 1.8rem;
}


/*--------------------------------------
l-parts06
---------------------------------------*/
.l-parts06 {
padding: 4rem 0 2rem 0;
background: #c7f0fe url(img/parts06_bg_02.jpg) no-repeat center top;
background-size: 130% auto;
}


/*--------------------------------------
l-parts07
---------------------------------------*/
.l-parts07 {
padding: 4rem 0 2rem 0;
}
.l-parts07 .title {
min-height: 5rem;
padding: 1.5rem 1.5rem 1.5rem 7rem;
background-size: 48px auto;
font-size: 2rem;
}

}