@charset "UTF-8";
 #breadcrumb {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
font-weight: 500;
}
#breadcrumb a {
text-decoration: none;
color: #333;
}
#breadcrumb ul {
list-style-type: none;
margin: 0;
display: flex;
justify-content: flex-start;
flex-wrap: nowrap;
padding: 0;
}
#breadcrumb ul li:after {
content: '>';
margin: 0 8px;
font-weight: 500;
}
#breadcrumb ul li:last-child:after {
content: none;
}
@media (max-width: 767px) {
#breadcrumb {
width: 100%;
max-width: 100%;
font-size: .7rem;
padding: 0 1.5em;
margin: 1.5em auto 0 auto;
}
#breadcrumb li:last-child {
min-width: 0;
overflow: hidden;
text-overflow: ellipsis;
}
}
@media (min-width: 768px) {
#breadcrumb {
font-size: .75rem;
padding: 0 40px;
margin: 2em auto 0 auto;
}
}
@media (min-width: 1025px) {
#breadcrumb {
max-width: 88%;
margin: 2em auto 0 auto;
font-size: .8rem;
}
} .page-head {
margin: 1.5em 0;
}
.page-head .page-nav .page-nav-list {
list-style-type: none;
margin: 0;
padding: 0;
display: flex;
justify-content: center;
align-items: center;
align-items: center;
}
.page-head .page-nav .page-nav-list li {
line-height: 1;
}
.page-head .page-nav .page-nav-list li a {
display: inline-block;
padding: 0 2em;
font-size: .9rem;
font-weight: 700;
color: #333;
letter-spacing: 1px;
border-right: 1px solid #333;
}
.page-head .page-nav .page-nav-list li:last-child a {
border-right: none;
} @media (max-width: 767px) {
.page-head {
display: none;
}
} @media (min-width: 768px) {
.page-head .page-nav .page-nav-list li a {
padding: 0 .8em;
font-size: .85rem;
letter-spacing: 0;
}
} @media (min-width: 1025px) {
.page-head {
margin: 1.5em 0;
}
.page-head .page-nav .page-nav-list {
list-style-type: none;
margin: 0;
padding: 0;
display: flex;
justify-content: center;
align-items: center;
align-items: center;
}
.page-head .page-nav .page-nav-list li {
line-height: 1;
}
.page-head .page-nav .page-nav-list li a {
display: inline-block;
padding: 0 1em;
font-size: 1rem;
font-weight: 700;
color: #333;
border-right: 1px solid #333;
}
.page-head .page-nav .page-nav-list li:last-child a {
border-right: none;
}
} .hero-page-head {
position: relative;
overflow: hidden;
width: 100%;                    }
.hero-page-head .hph-block-main {
position: relative;
z-index: 3;
width: 100%;
display: flex;
justify-content: space-between;
align-items: flex-start;
}
.hero-page-head .hph-vertical {
width: 10%;
writing-mode: vertical-rl;
text-orientation: mixed;
color: #249cad;
font-weight: 700;
letter-spacing: .1em;
font-feature-settings: "vpal";
line-height: 1.1;
}
.hero-page-head .hph-photo {
position: relative;
width: 88%; }
.hero-page-head .hph-photo img {
display: block;
width: 100%;
height: auto;
}
.hero-page-head .hph-photo::after {
content: '';
position: absolute;
right: -1px;
bottom: -1px;
background-color: #249cad;
clip-path: polygon(100% 0, 0 100%, 100% 100%);
z-index: 2;
}
.hero-page-head .hph-txt {
color: #fff;
font-family: "Inter", "Century Gothic", "Futura", "Avenir", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: 500;
line-height: 1;
pointer-events: none;
z-index: 4;
}
.hero-page-head .hph-page-name-about {
position: absolute;
color: #fff;
font-family: "Inter", "Century Gothic", "Futura", "Avenir", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: 500;
line-height: 1;
z-index: 4;
}
.hero-page-head .hph-about-ism {
position: absolute;
z-index: 4;
}
.hero-page-head .hph-about-ism img {
display: block;
width: 100%;
height: auto;
}
.hero-page-head .hph-custom-head {
position: absolute;
z-index: 4;
}
.hero-page-head .hph-reform-head {
position: absolute;
z-index: 4;
}
.hero-page-head .hph-works-head {
position: absolute;
z-index: 4;
}
.hero-page-head .hph-voice-head {
position: absolute;
z-index: 4;
}
.hero-page-head .hph-company-head {
position: absolute;
z-index: 4;
}
.hero-page-head .hph-block-sub {
position: relative;
z-index: 1;
width: 100%;
background-color: #249cad;
color: #fff;
}
.hero-page-head .hph-block-sub-company {
background-color: #f2f2f2;
color: #333;
}
.hero-page-head .hph-about-copy {
width: 100%;
margin: 0 auto;
text-align: center;
}
.hero-page-head .hph-about-copy .hph-sub-head-about {
font-weight: 700;
}
.hero-page-head .hph-about-copy .hph-sub-note-about {
line-height: 2;
}
.hero-page-head .hph-custom-copy {
width: 45%;
text-align: left;
}
.hero-page-head .hph-custom-copy .hph-sub-head-custom {
line-height: 2;
}
.hero-page-head .hph-reform-copy {
text-align: left;
}
.hero-page-head .hph-block-sub-company {   }
.hero-page-head .hph-block-sub-company .hph-company-sub-inner {
margin: 0 auto;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
align-items: flex-start;
}
.hero-page-head .hph-block-sub-company .hph-company-massage {
width: 100%;
margin: 0;
border-left: 5px solid #249cad;
font-weight: 700;
color: #333;
}
.hero-page-head .hph-block-sub-company .hph-company-massage span {
display: block;
font-weight: 500;
color: #249cad;
}
.hero-page-head .hph-block-sub-company .hph-company-copy {
width: 70%;
}
.hero-page-head .hph-block-sub-company .hph-company-copy .hph-sub-note {
line-height: 2;
color: #333;
}
.hero-page-head .hph-block-sub-company .hph-president {
width: 25%;
text-align: center;
}
.hero-page-head .hph-block-sub-company .hph-president img {
display: block;
width: 100%;
height: auto;
}
.hero-page-head .hph-block-sub-company .hph-president figcaption {
margin-top: .8em;
font-weight: 700;
color: #333;
text-align: left;
}
.hero-page-head .hph-block-sub-company .hph-president figcaption span {
display: inline-block;
}
.hero-page-head .hph-house {
position: absolute;
z-index: 2;
line-height: 0;
font-size: 0;
}
.hero-page-head .hph-house img {
display: block;
width: 100%;
height: auto;
}
.hero-page-head .hph-house-custom {
width: 35%;
}
.hero-page-head .hph-house-reform {
width: 40%;
} .page-sub-hero img {
display: block;
width: 100%;
height: auto;
} @media (max-width: 767px) { .hero-page-head {                    }
.hero-page-head .hph-vertical {
width: 10%;
font-size: .9rem;
letter-spacing: .0em;
line-height: 1;
}
.hero-page-head .hph-photo {
width: 88%; }
.hero-page-head .hph-photo::after {
width: 60px;
height: 60px;
}
.hero-page-head .hph-txt {
font-size: 1.5rem;
}
.hero-page-head .hph-page-name-about {
top: 3%;
left: 3%;
font-size: 1.2rem;
}
.hero-page-head .hph-about-ism {
left: 50%;
bottom: 0;
transform: translate(-50%, 50%);
width: 38%;
max-width: 640px;
}
.hero-page-head .hph-custom-head {
left: 4%;
bottom: 0;
transform: translateY(50%);
}
.hero-page-head .hph-reform-head {
left: 7%;
bottom: 0;
transform: translateY(50%);
}
.hero-page-head .hph-works-head {
left: 4%;
bottom: 0;
transform: translateY(50%);
}
.hero-page-head .hph-voice-head {
left: 4%;
bottom: 0;
transform: translateY(50%);
}
.hero-page-head .hph-company-head {
top: 3%;
left: 3%;
}
.hero-page-head .hph-block-sub {
margin-top: -3vh;
padding: 5vh 0 2em 0;
}
.hero-page-head .hph-sub-txt {
width: 80%;
margin: 0 auto 0 auto;
padding: 0 0 4em 0;
font-size: .88rem;
line-height: 1.8;
}
.hero-page-head .hph-about-copy {
width: 100%;
margin: 0 auto;
text-align: center;
}
.hero-page-head .hph-about-copy .hph-sub-head-about {
font-weight: 700;
}
.hero-page-head .hph-about-copy .hph-sub-note-about {
line-height: 2;
}
.hero-page-head .hph-about-copy {
display: inline-block;
padding: 2em 0 8em 0;
}
.hero-page-head .hph-about-copy .hph-sub-head-about {
font-size: 1.2rem;
margin-bottom: .7em;
}
.hero-page-head .hph-about-copy .hph-sub-note-about {
font-size: .8rem;
line-height: 1.5;
padding: 0 2em;
text-align: left;
}
.hero-page-head .hph-about-copy .hph-sub-note-about br {
display: none;
}
.hero-page-head .hph-block-sub-voice,
.hero-page-head .hph-block-sub-works {
padding-top: 1em;
padding-bottom: 3em;
}
.hero-page-head .hph-block-sub-voice .hph-sub-txt, .hero-page-head .hph-block-sub-voice p,
.hero-page-head .hph-block-sub-works .hph-sub-txt,
.hero-page-head .hph-block-sub-works p {
display: none;
}
.hero-page-head .hph-block-sub-company {   }
.hero-page-head .hph-block-sub-company .hph-company-sub-inner {
max-width: 900px;
margin: 0 auto;
}
.hero-page-head .hph-block-sub-company .hph-company-massage {
margin: 0;
padding: 0 0 0 15px;
font-size: 1.6rem;
}
.hero-page-head .hph-block-sub-company .hph-company-massage span {
font-size: .9rem;
}
.hero-page-head .hph-block-sub-company .hph-company-copy {
width: 70%;
}
.hero-page-head .hph-block-sub-company .hph-company-copy .hph-sub-note {
line-height: 2;
font-size: 1rem;
}
.hero-page-head .hph-block-sub-company .hph-president {
width: 25%;
}
.hero-page-head .hph-block-sub-company .hph-president figcaption {
margin-top: .8em;
font-size: .9rem;
line-height: 1.6;
}
.hero-page-head .hph-block-sub-company .hph-president figcaption span {
margin: 0 .5rem 0 0;
font-size: .8rem;
}
.hero-page-head .hph-house-custom {
right: -6%;
bottom: 0;
width: 48%;
}
.hero-page-head .hph-house-reform {
left: -4%;
bottom: 0;
width: 52%;
} } @media (min-width: 768px) { .hero-page-head {                    }
.hero-page-head .hph-vertical {
width: 10%;
font-size: 1.5rem;
letter-spacing: .1em;
line-height: 1.2;
}
.hero-page-head .hph-photo {
width: 88%; }
.hero-page-head .hph-photo::after {
width: 100px;
height: 100px;
}
.hero-page-head .hph-txt {
font-size: 5vw;
}
.hero-page-head .hph-page-name-about {
top: 3%;
left: 3%;
font-size: 5vw;
}
.hero-page-head .hph-about-ism {
left: 50%;
bottom: 0;
transform: translate(-50%, 50%);
width: 38%;
max-width: 640px;
}
.hero-page-head .hph-custom-head {
left: 4%;
bottom: 0;
transform: translateY(50%);
}
.hero-page-head .hph-reform-head {
right: 16%;
bottom: 0;
transform: translateY(50%);
}
.hero-page-head .hph-works-head {
left: 4%;
bottom: 0;
transform: translateY(50%);
}
.hero-page-head .hph-voice-head {
left: 4%;
bottom: 0;
transform: translateY(50%);
}
.hero-page-head .hph-company-head {
top: 3%;
left: 3%;
}
.hero-page-head .hph-block-sub {
margin-top: -3vh;
padding-top: 8vh;
padding-bottom: 2em;
}
.hero-page-head .hph-about-copy .hph-sub-head-about {
font-size: 1.8rem;
margin-bottom: 1em;
}
.hero-page-head .hph-about-copy .hph-sub-note-about {
font-size: .8rem;
line-height: 2;
}
.hero-page-head .hph-custom-copy {
width: 45%;
margin: 0 auto 0 12%;
}
.hero-page-head .hph-custom-copy .hph-sub-head-custom {
font-size: .9rem;
line-height: 2;
}
.hero-page-head .hph-reform-copy {
width: 45%;
margin: 0 12% 0 auto;
}
.hero-page-head .hph-reform-copy .hph-sub-head-reform {
font-size: 1.5vw;
line-height: 2;
}
.hero-page-head .hph-block-sub-voice,
.hero-page-head .hph-block-sub-works {
padding-top: 4vh;
padding-bottom: 5vh;
}
.hero-page-head .hph-block-sub-company {   }
.hero-page-head .hph-block-sub-company .hph-company-sub-inner {
max-width: 900px;
margin: 0 auto;
}
.hero-page-head .hph-block-sub-company .hph-company-massage {
margin: 0;
padding: 0 0 0 15px;
font-size: 1.6rem;
}
.hero-page-head .hph-block-sub-company .hph-company-massage span {
font-size: .9rem;
}
.hero-page-head .hph-block-sub-company .hph-company-copy {
width: 70%;
}
.hero-page-head .hph-block-sub-company .hph-company-copy .hph-sub-note {
line-height: 2;
font-size: 1rem;
}
.hero-page-head .hph-block-sub-company .hph-president {
width: 25%;
}
.hero-page-head .hph-block-sub-company .hph-president figcaption {
margin-top: .8em;
font-size: .9rem;
line-height: 1.6;
}
.hero-page-head .hph-block-sub-company .hph-president figcaption span {
margin: 0 .5rem 0 0;
font-size: .8rem;
}
.hero-page-head .hph-house-custom {
right: -6%;
bottom: 0;
width: 35%;
}
.hero-page-head .hph-house-reform {
left: -4%;
bottom: 0;
width: 40%;
} } @media (min-width: 1025px) { .hero-page-head {                    }
.hero-page-head .hph-vertical {
width: 10%;
font-size: 2.5vw;
letter-spacing: .2em;
line-height: 1.2;
}
.hero-page-head .hph-photo {
width: 88%; }
.hero-page-head .hph-photo::after {
width: 120px;
height: 120px;
}
.hero-page-head .hph-txt {
font-size: 5vw;
}
.hero-page-head .hph-page-name-about {
top: 3%;
left: 3%;
font-size: 5vw;
}
.hero-page-head .hph-about-ism {
left: 50%;
bottom: 0;
transform: translate(-50%, 50%);
width: 30vw;
max-width: 640px;
}
.hero-page-head .hph-custom-head {
left: 4%;
bottom: 0;
transform: translateY(50%);
}
.hero-page-head .hph-reform-head {
right: 16%;
bottom: 0;
transform: translateY(50%);
}
.hero-page-head .hph-works-head {
left: 4%;
bottom: 0;
transform: translateY(50%);
}
.hero-page-head .hph-voice-head {
left: 4%;
bottom: 0;
transform: translateY(50%);
}
.hero-page-head .hph-company-head {
top: 3%;
left: 3%;
}
.hero-page-head .hph-block-sub {
margin-top: -5vh;
padding-top: 15vh;
padding-bottom: 4em;
}
.hero-page-head .hph-about-copy .hph-sub-head-about {
font-size: clamp(2rem, 3.5vw, 3rem);
margin-bottom: 1.2em;
}
.hero-page-head .hph-about-copy .hph-sub-note-about {
font-size: 1rem;
line-height: 2;
margin-bottom: 1.5em;
}
.hero-page-head .hph-custom-copy {
width: 45%;
margin: 0 auto 0 12%;
}
.hero-page-head .hph-custom-copy .hph-sub-head-custom {
font-size: 1.5vw;
line-height: 2;
}
.hero-page-head .hph-reform-copy {
width: 45%;
margin: 0 12% 0 auto;
}
.hero-page-head .hph-reform-copy .hph-sub-head-reform {
font-size: 1.5vw;
line-height: 2;
}
.hero-page-head .hph-block-sub-voice,
.hero-page-head .hph-block-sub-works {
padding-top: 4vh;
padding-bottom: 5vh;
}
.hero-page-head .hph-block-sub-company {   }
.hero-page-head .hph-block-sub-company .hph-company-sub-inner {
max-width: 900px;
margin: 0 auto;
}
.hero-page-head .hph-block-sub-company .hph-company-massage {
margin: 0;
padding: 0 0 0 15px;
font-size: 1.6rem;
}
.hero-page-head .hph-block-sub-company .hph-company-massage span {
font-size: .9rem;
}
.hero-page-head .hph-block-sub-company .hph-company-copy {
width: 70%;
}
.hero-page-head .hph-block-sub-company .hph-company-copy .hph-sub-note {
line-height: 2;
font-size: 1rem;
}
.hero-page-head .hph-block-sub-company .hph-president {
width: 25%;
}
.hero-page-head .hph-block-sub-company .hph-president figcaption {
margin-top: .8em;
font-size: .9rem;
line-height: 1.6;
}
.hero-page-head .hph-block-sub-company .hph-president figcaption span {
margin: 0 .5rem 0 0;
font-size: .8rem;
}
.hero-page-head .hph-house-custom {
right: -6%;
bottom: 0;
width: 35%;
}
.hero-page-head .hph-house-reform {
left: -4%;
bottom: 0;
width: 40%;
} }
.base-cta a {
display: inline-block;
color: #333;
border: 1px solid #333;
position: relative;
padding: .51em 2em;
font-size: .9rem;
}
.base-cta a:after {
content: '';
display: block;
width: 30px;
height: 1px;
border-top: 1px solid #333;
position: absolute;
top: 50%;
right: -15px;
transform: translateY(-50%);
}
.base-cta a:hover {
color: #249cad;
border: 1px solid #249cad;
}
.base-cta a:hover:after {
border-top: 1px solid #249cad;
} .page-main {
margin: 0 !important;
padding: 0;
}
.pages-cta {
margin: 5em auto;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.pages-cta .pc-item img {
width: 100%;
height: auto;
} .page-about {
background-color: #edeeee;
}
.vertical-head {
margin: 0 auto;
padding: 3em 0;
display: flex;
justify-content: center;
color: #249cad;
}
.vertical-head span {
display: inline-block;
writing-mode: vertical-rl;
text-orientation: mixed;
font-size: 3.8vw;
font-weight: 700;
letter-spacing: 0.1em;
border-top: 5px solid #249cad;
line-height: -1em;
margin: 0 auto;
padding: .5em 0;
}
.page-about {
margin: 0;
padding: 0 0 5em 0;
}
.page-about .about-wrap .about-items {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin: 3em 0;
width: 100%;
}
.page-about .about-wrap .about-items .about-items-img {
width: 40%;
}
.page-about .about-wrap .about-items .about-items-img img {
width: 100%;
height: auto;
}
.page-about .about-wrap .about-items .abot-items-note {
width: 60%;
}
.page-about .about-wrap .about-items .abot-items-note .about-items-head,
.page-about .about-wrap .about-items .abot-items-note .about-items-txt {
width: 68%;
margin: 0 auto 0 5%;
}
.page-about .about-wrap .about-items .abot-items-note .about-items-head {
font-size: 1.8vw;
padding: 0 0 .5em 0;
color: #249cad;
}
.page-about .about-wrap .about-items .abot-items-note .about-items-head span {
display: block;
color: #fff;
font-family: "Inter", "Century Gothic", "Futura", "Avenir", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 8vw;
font-weight: 500;
line-height: 1;
}
.page-about .about-wrap .about-items .abot-items-note .about-items-txt {
font-size: 1vw;
font-weight: 500;
}
.page-about .about-wrap .about-02 {
flex-direction: row-reverse;
}
.page-about .about-wrap .about-02 .abot-items-note .about-items-head,
.page-about .about-wrap .about-02 .abot-items-note .about-items-txt {
width: 68%;
margin: 0 5% 0 auto;
} .point-wrap {
margin: 3em auto;
}
.point-wrap .point-wrap-inner {
width: 100%;
max-width: 1000px;
margin: 0 auto;
padding: 0 2rem;
}
.point-wrap .point-item {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin: 5em 0;
}
.point-wrap .point-item:last-child {
margin-bottom: 0;
}
.point-wrap .point-item.reverse {
flex-direction: row-reverse;
}
.point-wrap .point-item .point-img,
.point-wrap .point-item .point-note {
width: 47%;
}
.point-wrap .point-item .point-img img {
display: block;
width: 100%;
height: auto;
}
.point-wrap .point-item .point-note .point-num,
.point-wrap .point-item .point-note .point-title {
color: #249cad;
}
.point-wrap .point-item .point-note .point-num {
display: inline-block;
text-align: center;
font-family: "Inter", "Century Gothic", "Futura", "Avenir", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.point-wrap .point-item .point-note .point-num small {
display: block;
font-size: 1rem;
font-weight: 700;
letter-spacing: 0.15em;
line-height: 1;
}
.point-wrap .point-item .point-note .point-num .num {
display: block;
font-size: 3.5rem;
font-weight: 700;
line-height: 1.1;
}
.point-wrap .point-item .point-note .point-title {
margin: .5rem 0;
font-size: 1.5rem;
font-weight: 700;
letter-spacing: 0.08em;
line-height: 1.6;
}
.point-wrap .point-item .point-note .point-text {
margin: 0;
font-size: 0.9rem;
font-weight: 500;
line-height: 1.8;
letter-spacing: 0.05em;
} .reform-contents {  }
.reform-contents .reform-type {
position: relative;
background: #eef1f1;
padding: 5em 0 6em;  }
.reform-contents .reform-type::after {
content: '';
position: absolute;
right: 0;
bottom: 0;
width: 120px;
height: 120px;
background: #249cad;
clip-path: polygon(100% 0, 100% 100%, 0 100%);
}
.reform-contents .reform-type .reform-type-inner {
width: 1000px;
margin: 0 auto;
position: relative;
z-index: 2;
}
.reform-contents .reform-type .reform-type-head {
margin: 0 0 2.5em;
border-left: 5px solid #249cad;
padding: 0 0 0 1.2em;
line-height: 1;
}
.reform-contents .reform-type .reform-type-head .reform-type-title {
margin: 0;
font-size: 2rem;
font-weight: 700;
letter-spacing: .08em;
color: #249cad;
}
.reform-contents .reform-type .reform-type-head .reform-type-title span {
display: block;
margin: .6em 0 0;
font-size: 1rem;
font-weight: 600;
letter-spacing: .06em;
color: #249cad;
}
.reform-contents .reform-type .reform-type-body {
display: flex;
justify-content: space-between;
align-items: flex-start;
}
.reform-contents .reform-type .reform-type-body .reform-type-figure {
width: 58%;
}
.reform-contents .reform-type .reform-type-body .reform-type-figure img {
width: 100%;
height: auto;
display: block;
}
.reform-contents .reform-type .reform-type-body .reform-type-texts {
width: 42%;
}
.reform-contents .reform-type .reform-type-body .reform-type-texts .reform-type-lead {
margin: 0 0 1.8em;
font-size: 1rem;
line-height: 2.1;
letter-spacing: .04em;
font-weight: 500;
color: #333;
}
.reform-contents .reform-type .reform-type-body .reform-type-texts .reform-type-list {
list-style: none;
margin: 0;
padding: 0;
}
.reform-contents .reform-type .reform-type-body .reform-type-texts .reform-type-list li {
display: flex;
align-items: center;
gap: 1em;
margin: .9em 0;
}
.reform-contents .reform-type .reform-type-body .reform-type-texts .reform-type-list li .num {
width: 38px;
height: 38px;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
background: #249cad;
color: #fff;
font-weight: 700;
font-size: 1rem;
line-height: 1;
}
.reform-contents .reform-type .reform-type-body .reform-type-texts .reform-type-list li .txt {
font-size: 1.1rem;
font-weight: 700;
letter-spacing: .06em;
color: #249cad;
}
.reform-contents .reform-blocks {
padding: 5em 0 6em;
}
.reform-contents .reform-blocks .reform-blocks-inner {
margin: 0 auto;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.reform-contents .reform-blocks .reform-block { }
.reform-contents .reform-blocks .reform-block .reform-block-media {
position: relative;
overflow: hidden; }
.reform-contents .reform-blocks .reform-block .reform-block-media .tag-num {
position: absolute;
top: 0;
left: 0;
width: 100px;
height: 100px;
background: #249cad;
clip-path: polygon(0 0, 100% 0, 0 100%);
display: flex;
align-items: flex-start;
justify-content: flex-start;
padding: 20px;
color: #fff;
font-weight: 700;
font-size: 1.4rem;
line-height: 1;
}
.reform-contents .reform-blocks .reform-block .reform-block-media img {
width: 100%;
height: auto;
display: block;
}
.reform-contents .reform-blocks .reform-block .reform-block-info .reform-block-tag {
display: none;
}
.reform-contents .reform-blocks .reform-block .reform-block-info {
padding: 1.4em 0 0;
}
.reform-contents .reform-blocks .reform-block .reform-block-info .reform-block-title {
margin: 0 0 .7em;
font-size: 1.4rem;
font-weight: 700;
letter-spacing: .06em;
color: #249cad;
}
.reform-contents .reform-blocks .reform-block .reform-block-info .reform-block-text {
margin: 0;
font-size: .85rem;
line-height: 1.8;
} .reform-shop {
background: #eef1f1;
padding: 5em 0 6em;
}
.reform-shop .reform-shop-inner {
width: 1000px;
margin: 0 auto;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.reform-shop .reform-shop-media {
position: relative;
width: 48%; }
.reform-shop .reform-shop-media::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100px;
height: 100px;
background: #249cad;
clip-path: polygon(0 0, 100% 0, 0 100%);
z-index: 2;
}
.reform-shop .reform-shop-media img {
width: 100%;
height: auto;
display: block;
}
.reform-shop .reform-shop-info {
width: 48%;
}
.reform-shop .reform-shop-info .reform-shop-title {
margin: 0 0 1em 0 !important;
padding: 0 !important;
font-size: 1.8rem;
font-weight: 700;
letter-spacing: .06em;
color: #249cad;
}
.reform-shop .reform-shop-info .reform-shop-text {
margin: 0 0 1em;
font-size: .95rem;
line-height: 2;
letter-spacing: .04em;
color: #333;
} .company-info-wrap {
max-width: 70%;
margin: 3em auto;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
align-items: flex-start;
}
.company-info-wrap .company-info-vertical {
width: 10%;
min-width: 64px;
writing-mode: vertical-rl;
text-orientation: mixed;
color: #249cad;
font-weight: 700;
letter-spacing: 0.2em;
}
.company-info-wrap .company-info-vertical span {
display: inline-block;
font-size: 3vw;
border-top: 5px solid #249cad;
padding-top: .4em;
line-height: 1;
}
.company-info-wrap .company-info-table {
width: 80%;
max-width: 80%;
}
.company-info-wrap .company-info-table table {
width: 100%;
border-collapse: collapse;
background: transparent;
}
.company-info-wrap .company-info-table table tr {
border-top: 1px solid #ddd;
}
.company-info-wrap .company-info-table table tr:last-child {
border-bottom: 1px solid #ddd;
}
.company-info-wrap .company-info-table table th,
.company-info-wrap .company-info-table table td {
padding: .5em 0;
vertical-align: top;
font-size: .9rem;
border: none;
background: transparent;
}
.company-info-wrap .company-info-table table th {
width: 18%;
font-weight: 700;
text-align: right;
padding-right: 2em;
white-space: nowrap;
}
.company-info-wrap .company-info-table table td {
width: 82%;
line-height: 1.8;
}
.company-info-wrap .company-info-table .ci-office {
margin: 2em 0;
}
.company-info-wrap .company-info-table .ci-office img {
width: 80%;
height: auto;
} .access {
padding: 5em 0;
}
.access .access-wrap {
max-width: 100%;
margin: 0 auto;
display: flex;
justify-content: flex-start;
align-items: flex-start;
flex-wrap: wrap;
}
.access .access-map {
width: 75%;
}
.access .access-map iframe {
width: 100%;
height: 450px;
display: block;
}
.access .access-vertical {
width: 3%;
margin-left: 2em;
writing-mode: vertical-rl;
text-orientation: mixed;
color: #249cad;
font-weight: 700;
letter-spacing: 0.2em;
}
.access .access-vertical span {
display: inline-block;
font-size: 3vw;
border-top: 5px solid #249cad;
padding-top: .4em;
line-height: 1;
} .flow-wrap {
margin: 5em auto;
font-weight: 500;
}
.flow-wrap .flow-step {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
align-items: stretch;
margin-bottom: -1px;
position: relative;
}
.flow-wrap .flow-bar {
width: 160px;
padding: 60px 10px 40px;
box-sizing: border-box;
border-left: 4px solid #fff;
border-right: 4px solid #fff;
background-color: #249cad;
color: #fff;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
background-image: url(//ootomi.jp/wp-content/themes/theme-ootomi/images/elements/flow-arrow.svg);
background-repeat: no-repeat;
background-size: 100% auto;
background-position: top center;
}
.flow-wrap .flow-bar .flow-period {
display: inline-block;
background: #fff;
color: #249cad;
padding: 3px 12px;
border-radius: 20px;
font-weight: 700;
line-height: 1.2;
margin-bottom: 15px;
white-space: nowrap;
}
.flow-wrap .flow-bar .flow-bar-list {
list-style-type: disc;
padding: 0 0 0 1.5em;
margin: 0;
}
.flow-wrap .flow-bar .flow-bar-list li {
line-height: 1.6;
font-weight: 500;
white-space: nowrap;
}
.flow-wrap .flow01 .flow-bar,
.flow-wrap .flow02 .flow-bar {
background-image: none !important;
}
.flow-wrap .flow01 .flow-bar {
justify-content: flex-end;
}
.flow-wrap .flow-step:last-child {
margin-bottom: 0;
}
.flow-wrap .flow-step:last-child .flow-bar {
clip-path: polygon(0 0, 100% 0, 100% calc(100% - 30px), 50% 100%, 0 calc(100% - 30px));
}
.flow-wrap .flow-step:last-child .flow-body {
padding-bottom: 0;
}
.flow-wrap .flow-body {
width: calc(100% - 160px);
padding: 0 0 100px 1em;
}
.flow-wrap .flow-body .flow-step-title {
color: #249cad;
font-size: 1.5rem;
font-weight: 700;
border-bottom: 2px solid #249cad;
padding-bottom: 0.5em;
margin: 0 0 1.5em 0;
}
.flow-wrap .flow-body .flow-step-body {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
align-items: flex-start;
font-size: .9rem;
font-weight: 500;
}
.flow-wrap .flow-body .flow-step-body .flow-step-img {
width: 30%;
}
.flow-wrap .flow-body .flow-step-body .flow-step-img img {
width: 100%;
height: auto;
display: block;
}
.flow-wrap .flow-body .flow-step-body .flow-step-img .flow-cta {
background-color: #249cad;
color: #fff;
display: block;
margin: 2em 0 0 0;
background-repeat: no-repeat;
background-size: 54px auto;
background-position: center left 20px;
}
.flow-wrap .flow-body .flow-step-body .flow-step-img .flow-cta span {
display: block;
}
.flow-wrap .flow-body .flow-step-body .flow-step-img .flow-cta-contact {
background-image: url(//ootomi.jp/wp-content/themes/theme-ootomi/images/elements/flow-mail.svg);
}
.flow-wrap .flow-body .flow-step-body .flow-step-img .flow-cta-works {
background-image: url(//ootomi.jp/wp-content/themes/theme-ootomi/images/elements/flow-works.svg);
}
.flow-wrap .flow-body .flow-step-body .flow-step-text {
width: 65%;
font-size: 0.9rem;
line-height: 1.9;
}
.flow-wrap .flow-body .flow-point {
background-image: url(//ootomi.jp/wp-content/themes/theme-ootomi/images/elements/flow-point.svg);
background-repeat: no-repeat;
background-size: 80px auto;
background-position: top 50% left 20px;
padding: 1em 1em  1em 130px;
border: 1px solid #249cad;
font-size: .8rem;
font-weight: 500;
color: #249cad;
}
.flow-wrap .flow-body p {
margin: 0 0 2em 0;
}
.flow-wrap .flow-quotation {
margin: 2em 0 0 0;
}
.flow-wrap .flow-quotation .flow-quotation-head {
font-size: 1rem;
}
.flow-wrap .flow-quotation p {
font-size: .8rem;
}
.after-support {
margin: 2em 0;
font-weight: 500;
}
.after-support h2 {
color: #249cad;
}
.after-support p {
font-weight: 500;
}
.custom-works {
padding: 0;
position: relative;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.custom-works .cw-list {
width: 92%;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
list-style: none;
margin: 0;
padding: 0;
}
.custom-works .cw-list .cw-item {
width: 32%;
}
.custom-works .cw-list .cw-item a {
display: block;
}
.custom-works .cw-list .cw-item .works-thumb img {
width: 100%;
height: auto;
}
.custom-works .cw-vertical {
width: 8%;
display: flex;
justify-content: start;
color: #249cad;
writing-mode: vertical-rl;
text-orientation: mixed;
font-size: 1.8rem;
font-weight: 700;
letter-spacing: .2em;
}
.page-contact,
.page-reserve {
max-width: 1000px;
width: 94%;
margin: 0 auto 3em auto;
padding: 0 2em;
}
.page-contact h1,
.page-reserve h1 {
text-align: center;
margin: 3em 0 2em;
font-size: 2.2rem;
font-weight: 500;
color: #249cad;
}
.page-contact .form-flow,
.page-reserve .form-flow {
margin-bottom: 2em;
}
.page-contact .form-flow ul,
.page-reserve .form-flow ul {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
flex-wrap: nowrap;
list-style: none;
padding: 0;
margin: 0;
}
.page-contact .form-flow ul li,
.page-reserve .form-flow ul li {
flex: 1;
text-align: center;
padding: 1.2em 0;
background: #f5f5f5;
position: relative;
font-weight: 700;
letter-spacing: .05em;
}
.page-contact .form-flow ul li:not(:last-child),
.page-reserve .form-flow ul li:not(:last-child) {
border-right: 1px solid #ddd;
}
.page-contact .form-flow ul li span,
.page-reserve .form-flow ul li span {
font-family: "Inter", "Century Gothic", "Futura", "Avenir", "Helvetica Neue", Helvetica, Arial, sans-serif;
display: block;
font-size: .7rem;
font-weight: 400;
margin-top: .3em;
letter-spacing: .15em;
opacity: .6;
}
.page-contact .form-flow ul .ff-current,
.page-reserve .form-flow ul .ff-current {
background: #249cad;
color: #fff;
}
.page-contact .form-flow ul .ff-current span,
.page-reserve .form-flow ul .ff-current span {
opacity: .9;
}
.page-contact .contact-lead,
.page-reserve .contact-lead {
text-align: center;
margin: 0 0 2em;
line-height: 2;
}
.page-contact form,
.page-reserve form {
width: 100%;
padding: 4em 0;
}
.page-contact form .form-input p,
.page-reserve form .form-input p {
margin-bottom: 2em;
font-weight: 700;
}
.page-contact form .form-input dl,
.page-reserve form .form-input dl {
margin: 0;
padding: 0;
}
.page-contact form .form-input dl dt,
.page-reserve form .form-input dl dt {
font-weight: 700;
margin-top: 2em;
margin-bottom: .5em;
letter-spacing: .05em;
}
.page-contact form .form-input dl dd,
.page-reserve form .form-input dl dd {
margin: 0;
}
.page-contact form .form-input dl dd input,
.page-contact form .form-input dl dd textarea,
.page-contact form .form-input dl dd select,
.page-reserve form .form-input dl dd input,
.page-reserve form .form-input dl dd textarea,
.page-reserve form .form-input dl dd select {
width: 100%;
padding: .8em 1em;
border: 1px solid #888;
font-size: 1em;
background: #fff;
transition: .3s;
}
.page-contact form .form-input dl dd input:focus,
.page-contact form .form-input dl dd textarea:focus,
.page-contact form .form-input dl dd select:focus,
.page-reserve form .form-input dl dd input:focus,
.page-reserve form .form-input dl dd textarea:focus,
.page-reserve form .form-input dl dd select:focus {
border-color: #249cad;
outline: none;
box-shadow: 0 0 0 3px rgba(36, 156, 173, 0.15);
}
.page-contact form .form-input dl dd input:focus::placeholder,
.page-contact form .form-input dl dd textarea:focus::placeholder,
.page-contact form .form-input dl dd select:focus::placeholder,
.page-reserve form .form-input dl dd input:focus::placeholder,
.page-reserve form .form-input dl dd textarea:focus::placeholder,
.page-reserve form .form-input dl dd select:focus::placeholder {
color: transparent;
}
.page-contact form .form-input dl dd select,
.page-reserve form .form-input dl dd select {
padding: .8em 2.5em .8em 1em;
}
.page-contact form .form-input dl dd textarea,
.page-reserve form .form-input dl dd textarea {
resize: vertical;
}
.page-contact form .form-input dl dd .form-mail-check,
.page-reserve form .form-input dl dd .form-mail-check {
display: block;
margin: .5em 0;
font-size: .8rem;
}
.page-contact form .form-input dl dd .reserve-select,
.page-reserve form .form-input dl dd .reserve-select {
margin: 0;
}
.page-contact form .form-input dl dd .reserve-select .reserve-flex-group,
.page-reserve form .form-input dl dd .reserve-select .reserve-flex-group {
display: flex !important;
gap: 10px;
align-items: center;
width: 100%;
}
.page-contact form .form-input dl dd .reserve-select .reserve-flex-group input[type="date"],
.page-reserve form .form-input dl dd .reserve-select .reserve-flex-group input[type="date"] {
flex: 2 !important;
width: auto !important;
}
.page-contact form .form-input dl dd .reserve-select .reserve-flex-group select,
.page-reserve form .form-input dl dd .reserve-select .reserve-flex-group select {
flex: 1 !important;
width: auto !important;
min-width: 140px;
}
.page-contact form .form-input dl .reserve-select,
.page-reserve form .form-input dl .reserve-select {
display: flex;
gap: 1em;
}
.page-contact form .form-input dl .reserve-select select,
.page-reserve form .form-input dl .reserve-select select {
flex: 1;
}
.page-contact form .form-input dl .reserve-flex-group,
.page-reserve form .form-input dl .reserve-flex-group {
display: flex !important;
flex-wrap: nowrap !important;
gap: 10px !important;
align-items: stretch !important;
width: 100% !important;
}
.page-contact form .form-input dl .reserve-flex-group input[type="date"],
.page-contact form .form-input dl .reserve-flex-group select,
.page-reserve form .form-input dl .reserve-flex-group input[type="date"],
.page-reserve form .form-input dl .reserve-flex-group select {
width: auto !important;
flex: 1 !important;
min-width: 0 !important;
height: 3.2em !important;
padding: 0 1em !important;
box-sizing: border-box !important;
border: 1px solid #888 !important;
border-radius: 0 !important;
-webkit-appearance: none !important;
appearance: none !important;
background-color: #fff !important;
font-size: 17px !important;
color: #333 !important;
}
.page-contact form .form-input dl .reserve-flex-group input[type="date"],
.page-reserve form .form-input dl .reserve-flex-group input[type="date"] {
flex: 1.5 !important;
}
.page-contact form .form-input dl .reserve-flex-group select,
.page-reserve form .form-input dl .reserve-flex-group select {
background-image: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="%23888" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"></polyline></svg>') !important;
background-repeat: no-repeat !important;
background-position: right 1em center !important;
background-size: 12px !important;
padding-right: 2.5em !important;
}
.page-contact form .submit-btn,
.page-reserve form .submit-btn {
margin-top: 3em;
text-align: center;
}
.page-contact form .submit-btn #check,
.page-reserve form .submit-btn #check {
margin-right: .5em;
}
.page-contact form .submit-btn input[type="checkbox"],
.page-reserve form .submit-btn input[type="checkbox"] {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
width: 20px !important;
height: 20px !important;
border: 1px solid #888 !important;
border-radius: 0 !important;
background-color: #fff !important;
cursor: pointer;
margin: 0 1em 0 0;
vertical-align: middle;
position: relative;
}
.page-contact form .submit-btn input[type="checkbox"]:checked,
.page-reserve form .submit-btn input[type="checkbox"]:checked {
background-color: #249cad !important;
}
.page-contact form .submit-btn input[type="checkbox"]:checked::after,
.page-reserve form .submit-btn input[type="checkbox"]:checked::after {
content: "";
position: absolute;
left: 6px;
top: 2px;
width: 6px;
height: 10px;
border: solid white;
border-width: 0 2px 2px 0;
transform: rotate(45deg);
}
.page-contact form .submit-btn label,
.page-reserve form .submit-btn label {
font-size: .9rem;
}
.page-contact form .submit-btn label a,
.page-reserve form .submit-btn label a {
color: #249cad;
text-decoration: underline;
}
.page-contact form .submit-btn button,
.page-reserve form .submit-btn button {
display: block;
margin: 2em auto 0;
padding: 1em 3em;
background: #249cad;
color: #fff;
border: none;
font-size: 1.2rem;
font-weight: 500;
cursor: pointer;
transition: .3s;
}
.page-contact form .submit-btn button:hover,
.page-reserve form .submit-btn button:hover {
opacity: .85;
}
.page-reserve {   }
.page-reserve h1 {
margin: 0 0 1em 0;
padding: 0;
}
.page-reserve .form-confirm {
max-width: 1000px;
margin: 0 auto 4em;
padding: 0; }
.page-reserve .form-confirm .confirm-actions {
margin-top: 3.5em;
text-align: center;
}
.page-reserve .form-confirm .confirm-actions .back-link-wrap {
margin-bottom: 2.5em;
font-size: 0.9rem;
color: #666;
}
.page-reserve .form-confirm .confirm-actions .back-link-wrap .btn-re-edit {
display: inline-block;
margin-left: 0.5em;
color: #333;
text-decoration: underline;
cursor: pointer;
}
.page-reserve .form-confirm .confirm-actions .btn-submit {
appearance: none;
display: inline-block;
width: 100%;
max-width: 450px;
padding: 1em;
background: #249cad;
color: #fff;
border: none;
font-size: 1.15rem;
font-weight: 500;
cursor: pointer;
}
.page-reserve .confirm-table {
width: 100%;
border-collapse: collapse;
background: #fff;
border-top: 2px solid #249cad;
font-size: .95rem;
}
.page-reserve .confirm-table tbody tr {
border-bottom: 1px solid #e5e5e5;
}
.page-reserve .confirm-table tbody tr th {
width: 28%;
padding: 1.3em 1.8em;
background: #f5f5f5;
text-align: left;
font-weight: 500;
vertical-align: top;
}
.page-reserve .confirm-table tbody tr td {
width: 72%;
padding: 1.3em 1.8em;
line-height: 1.5;
word-break: break-word;
}
.page-reserve .form-error-wrap {
max-width: 1000px;
margin: 3em auto 5em;
padding: 0;
text-align: center;
}
.page-reserve .form-error-wrap .error-lead {
margin-bottom: 2em;
font-size: 1rem;
line-height: 1.8;
}
.page-reserve .form-error-wrap .form-error-box {
margin: 0 auto 2.5em;
padding: 1.5em 2em;
border: 1px solid #e0b4b4;
color: #b30000;
font-weight: 400;
line-height: 1.8;
text-align: left;
}
.page-reserve .form-error-wrap .error-btn .btn-back {
display: inline-block;
padding: .8em 3em;
border: 1px solid #333;
color: #333;
background: #fff;
font-size: .9rem;
text-decoration: none;
}
.page-reserve .form-complete {
max-width: 100%;
margin: 3em auto 6em;
padding: 0;
text-align: center;
}
.page-reserve .form-complete .complete-lead {
margin-bottom: 2.5em;
font-size: 1.1rem;
line-height: 1.9;
font-weight: 600;
}
.page-reserve .form-complete .complete-box {
margin: 0 auto 3em;
padding: 2.5em 3em;
background: #f7f9f8;
border-top: 3px solid #249cad;
line-height: 1.9;
font-size: .95rem;
}
.page-reserve .form-complete .complete-box p {
margin-bottom: 1.2em;
}
.page-reserve .form-complete .complete-box p:last-child {
margin-bottom: 0;
}
.page-reserve .form-complete .complete-actions .btn-home {
display: inline-block;
padding: .9em 3.5em;
background: #249cad;
color: #fff;
text-decoration: none;
font-size: .95rem;
letter-spacing: .05em;
transition: .3s ease;
}
.page-reserve .form-complete .complete-actions .btn-home:hover {
opacity: .85;
}  @media (max-width: 767px) {
#page-wrap {
width: 92%;
margin: 0 auto 5em auto;
}
.w1000 {
width: 92%;
margin: 3em auto;
}
.w1000 p {
font-weight: 500;
}
.page-nav {
display: none;
}
.about-head {
margin: 0 auto !important;
padding: 1em 0 0 0;
}
.about-head span {
font-size: 6vw;
}
.page-about .about-wrap .about-items {
margin: 2em 0;
}
.page-about .about-wrap .about-items .about-items-img {
width: 100%;
margin: 0 0 1em 0;
}
.page-about .about-wrap .about-items .abot-items-note {
width: 100%;
}
.page-about .about-wrap .about-items .abot-items-note .about-items-head,
.page-about .about-wrap .about-items .abot-items-note .about-items-txt {
width: 90%;
margin: 0 auto;
}
.page-about .about-wrap .about-items .abot-items-note .about-items-head {
font-size: 4.8vw;
}
.page-about .about-wrap .about-items .abot-items-note .about-items-head span {
font-size: 12vw;
}
.page-about .about-wrap .about-items .abot-items-note .about-items-txt {
font-size: 3vw;
}
.page-about .about-wrap .about-02 .abot-items-note .about-items-head,
.page-about .about-wrap .about-02 .abot-items-note .about-items-txt {
margin: 0 5% 0 auto;
}
.company-info-wrap {
max-width: 98%;
margin: 3em auto;
}
.company-info-wrap .company-info-vertical {
width: 3%;
line-height: 1;
}
.company-info-wrap .company-info-vertical span {
font-size: 1.5rem;
}
.company-info-wrap .company-info-table {
width: 93%;
padding: 0 1em 0 0;
}
.company-info-wrap .company-info-table table th, .company-info-wrap .company-info-table table td {
font-size: .75rem;
}
.access {
padding: 2em 0;
}
.access .access-map {
width: 82%;
}
.access .access-map iframe {
height: 350px;
}
.access .access-vertical {
width: 3%;
margin-left: 2em;
}
.access .access-vertical span {
font-size: 1.5rem;
padding-top: .4em;
}
.pages-cta {
width: 70%;
margin: 3em auto;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.pages-cta .pc-item {
width: 100%;
margin: 1em 0;
}
.point-wrap {
margin: 3em auto;
}
.point-wrap .point-wrap-inner {
width: 100%;
max-width: 1000px;
margin: 0 auto;
padding: 0 2rem;
}
.point-wrap .point-item {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin: 5em 0;
}
.point-wrap .point-item:last-child {
margin-bottom: 0;
}
.point-wrap .point-item.reverse {
flex-direction: row-reverse;
}
.point-wrap .point-item .point-img,
.point-wrap .point-item .point-note {
width: 100%;
}
.point-wrap .point-item .point-img {
margin: 0 0 2em 0;
}
.point-wrap .point-item .point-note .point-num small {
font-size: 1rem;
letter-spacing: 0.15em;
}
.point-wrap .point-item .point-note .point-num .num {
font-size: 3.5rem;
}
.point-wrap .point-item .point-note .point-title {
margin: 0.5rem 0 !important;
padding: 0;
font-size: 1.5rem;
}
.point-wrap .point-item .point-note .point-text {
font-size: 0.9rem;
}
.flow-wrap {
max-width: 92%;
margin: 5em auto;
}
.flow-wrap .flow-bar {
width: 130px;
padding: 1em;
font-size: .7rem;
}
.flow-wrap .flow-bar .flow-period {
padding: 3px 12px;
line-height: 1.2;
margin-bottom: 15px;
}
.flow-wrap .flow-bar .flow-bar-list {
padding: 0 0 0 1.5em;
}
.flow-wrap .flow-bar .flow-bar-list li {
font-size: .6rem;
}
.flow-wrap .flow-body {
width: calc(100% - 130px);
padding: 0 0 3em 1em;
}
.flow-wrap .flow-body .flow-step-title {
font-size: 1rem;
}
.flow-wrap .flow-body .flow-step-body .flow-step-img {
width: 100%;
margin: 0 0 2em 0;
}
.flow-wrap .flow-body .flow-step-body .flow-step-text {
width: 100%;
font-size: .8rem;
}
.flow-wrap .flow-body .flow-cta {
margin: 1.5em 0 0 0;
font-size: .9rem;
background-size: 54px auto;
background-position: center left 20px;
}
.flow-wrap .flow-body .flow-cta span {
font-size: .7rem;
}
.flow-wrap .flow-body .flow-cta-contact {
padding: 1em 1em 1em 84px;
}
.flow-wrap .flow-body .flow-cta-works {
padding: 1.8em 1em 1.8em 84px;
}
.flow-wrap .flow-body .flow-point {
background-size: 80px auto;
background-position: top 20px left 20px;
padding: 4em 1em 1em 1em;
font-size: .8rem;
}
.after-support {
width: 92%;
margin: 2em auto 5em auto;
}
.after-support h2 {
font-size: 1.3rem;
}
.after-support p {
font-size: .8rem;
}
.custom-works {
width: 92%;
margin: 3em auto 4em auto;
}
.custom-works .cw-list {
width: 84%;
}
.custom-works .cw-list .cw-item {
width: 100%;
}
.custom-works .cw-vertical {
font-size: 1.8rem;
} .reform-contents {  }
.reform-contents .reform-type {
position: relative;
background: #eef1f1;
padding: 5em 0 6em;  }
.reform-contents .reform-type::after {
content: '';
position: absolute;
right: 0;
bottom: 0;
width: 120px;
height: 120px;
background: #249cad;
clip-path: polygon(100% 0, 100% 100%, 0 100%);
}
.reform-contents .reform-type .reform-type-inner {
width: 90%;
margin: 0 auto;
position: relative;
z-index: 2;
}
.reform-contents .reform-type .reform-type-head {
margin: 0 0 2.5em;
border-left: 5px solid #249cad;
padding: 0 0 0 1.2em;
line-height: 1;
}
.reform-contents .reform-type .reform-type-head .reform-type-title {
margin: 0;
font-size: 1.7rem;
font-weight: 700;
letter-spacing: .08em;
color: #249cad;
}
.reform-contents .reform-type .reform-type-head .reform-type-title span {
display: block;
margin: .6em 0 0;
font-size: .9rem;
font-weight: 600;
letter-spacing: .06em;
color: #249cad;
}
.reform-contents .reform-type .reform-type-body {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
align-items: flex-start;
}
.reform-contents .reform-type .reform-type-body .reform-type-figure {
width: 100%;
}
.reform-contents .reform-type .reform-type-body .reform-type-figure img {
width: 100%;
height: auto;
display: block;
}
.reform-contents .reform-type .reform-type-body .reform-type-texts {
width: 100%;
}
.reform-contents .reform-type .reform-type-body .reform-type-texts .reform-type-lead {
margin: 0 0 2em 0;
font-size: .9rem;
line-height: 1.5;
}
.reform-contents .reform-type .reform-type-body .reform-type-texts .reform-type-list {
list-style: none;
margin: 0;
padding: 0;
}
.reform-contents .reform-type .reform-type-body .reform-type-texts .reform-type-list li {
display: flex;
align-items: center;
margin: .5em 0;
}
.reform-contents .reform-type .reform-type-body .reform-type-texts .reform-type-list li .num {
width: 32px;
height: 32px;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
background: #249cad;
color: #fff;
font-weight: 700;
font-size: .9rem;
line-height: 1;
}
.reform-contents .reform-type .reform-type-body .reform-type-texts .reform-type-list li .txt {
font-size: 1.1rem;
font-weight: 700;
letter-spacing: .06em;
color: #249cad;
}
.reform-contents .reform-blocks {
padding: 5em 0 6em;
}
.reform-contents .reform-blocks .reform-blocks-inner {
width: 90%;
margin: 0 auto;
}
.reform-contents .reform-blocks .reform-block {
width: calc((100% - 3em) / 2); }
.reform-contents .reform-blocks .reform-block .reform-block-media {
position: relative;
overflow: hidden; }
.reform-contents .reform-blocks .reform-block .reform-block-media .tag-num {
position: absolute;
top: 0;
left: 0;
width: 100px;
height: 100px;
background: #249cad;
clip-path: polygon(0 0, 100% 0, 0 100%);
display: flex;
align-items: flex-start;
justify-content: flex-start;
padding: 20px;
color: #fff;
font-weight: 700;
font-size: 1.4rem;
line-height: 1;
}
.reform-contents .reform-blocks .reform-block .reform-block-media img {
width: 100%;
height: auto;
display: block;
}
.reform-contents .reform-blocks .reform-block .reform-block-info .reform-block-tag {
display: none;
}
.reform-contents .reform-blocks .reform-block .reform-block-info {
padding: 1.4em 0 0;
}
.reform-contents .reform-blocks .reform-block .reform-block-info .reform-block-title {
margin: 0 0 .7em;
font-size: 1.4rem;
font-weight: 700;
letter-spacing: .06em;
color: #249cad;
}
.reform-contents .reform-blocks .reform-block .reform-block-info .reform-block-text {
margin: 0;
font-size: .85rem;
line-height: 1.8;
} .reform-shop {
background: #eef1f1;
padding: 5em 0 6em;
}
.reform-shop .reform-shop-inner {
width: 90%;
margin: 0 auto;
display: flex;
justify-content: space-between;
gap: 3.5em;
}
.reform-shop .reform-shop-media {
position: relative;
width: 100%; }
.reform-shop .reform-shop-media::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 70px;
height: 70px;
background: #249cad;
clip-path: polygon(0 0, 100% 0, 0 100%);
z-index: 2;
}
.reform-shop .reform-shop-media img {
width: 100%;
height: auto;
display: block;
}
.reform-shop .reform-shop-info {
width: 100%;
}
.reform-shop .reform-shop-info .reform-shop-title {
margin: 0 0 1em 0 !important;
padding: 0 !important;
font-size: 1.2rem;
color: #249cad;
}
.reform-shop .reform-shop-info .reform-shop-text {
margin: 0 0 1em;
font-size: .85rem;
line-height: 1.5;
color: #333;
}
.page-contact,
.page-reserve {
width: 90%;
margin: 0 auto 3em auto;
padding: 0;
}
.page-contact .form-flow,
.page-reserve .form-flow {
margin-bottom: 1em;
}
.page-contact .form-flow ul li,
.page-reserve .form-flow ul li {
font-size: .9rem;
}
.page-contact .form-flow ul li:not(:last-child),
.page-reserve .form-flow ul li:not(:last-child) {
border-right: 1px solid #ddd;
}
.page-contact .form-flow ul li span,
.page-reserve .form-flow ul li span {
font-size: .7rem;
font-weight: 400;
}
.page-contact .form-flow ul .ff-current,
.page-reserve .form-flow ul .ff-current {
background: #249cad;
color: #fff;
}
.page-contact .form-flow ul .ff-current span,
.page-reserve .form-flow ul .ff-current span {
opacity: .9;
}
.reserve-flex-group input[type="date"] {
appearance: none;
-webkit-appearance: none;
border-radius: 0 !important;
}
}
@media screen and (max-width: 767px) and (max-width: 600px) {
.reserve-flex-group input[type="date"] {
background-image: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="%23888" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect><line x1="16" y1="2" x2="16" y2="6"></line><line x1="8" y1="2" x2="8" y2="6"></line><line x1="3" y1="10" x2="21" y2="10"></line></svg>') !important;
background-repeat: no-repeat !important;
background-position: right 1em center !important;
background-size: 16px !important;
padding-right: 2.5em !important;
}
}
@media (max-width: 767px) {
.page-reserve { }
.page-reserve .form-confirm {
padding: 0;
margin-bottom: 3em;
}
.page-reserve .confirm-table {
border-top: 1px solid #249cad;
}
.page-reserve .confirm-table tbody tr {
display: block;
border-bottom: 1px solid #e5e5e5;
}
.page-reserve .confirm-table tbody tr th, .page-reserve .confirm-table tbody tr td {
display: block;
width: 100% !important;
box-sizing: border-box;
}
.page-reserve .confirm-table tbody tr th {
padding: 0.8em 1.2em;
background: #f9f9f9;
font-size: 0.85rem;
border-bottom: none;
}
.page-reserve .confirm-table tbody tr td {
padding: 0.8em 1.2em 1.2em;
font-size: 1rem;
}
.page-reserve .form-confirm .confirm-actions {
margin-top: 2.5em;
}
.page-reserve .form-confirm .confirm-actions .back-link-wrap {
font-size: 0.85rem;
line-height: 1.6;
padding: 0 1em;
}
.page-reserve .form-confirm .confirm-actions .btn-submit {
max-width: 100%;
padding: 1.2em;
font-size: 1.1rem;
}
.page-reserve .form-error-wrap {
padding: 0 1.2em;
}
.page-reserve .form-error-wrap .form-error-box {
padding: 1.2em;
font-size: 0.9rem;
}
.page-reserve .form-error-wrap .error-btn .btn-back {
width: 100%;
box-sizing: border-box;
}
} @media (min-width: 768px) {
#page-wrap {
width: 92%;
margin: 0 auto 5em auto;
}
.about-head span {
font-size: 3.8vw;
}
.w1000 {
width: 92%;
margin: 3em auto;
}
.w1000 p {
font-weight: 500;
}
.page-about .about-wrap .about-items .abot-items-note .about-items-head,
.page-about .about-wrap .about-items .abot-items-note .about-items-txt {
width: 80%;
margin: 0 auto 0 5%;
}
.page-about .about-wrap .about-items .abot-items-note .about-items-head {
font-size: 2.8vw;
}
.page-about .about-wrap .about-items .abot-items-note .about-items-head span {
font-size: 8vw;
}
.page-about .about-wrap .about-items .abot-items-note .about-items-txt {
font-size: 1.5vw;
}
.company-info-wrap {
max-width: 92%;
}
.company-info-wrap .company-info-vertical {
width: 10%;
}
.company-info-wrap .company-info-vertical span {
font-size: 2rem;
}
.access .access-map {
width: 85%;
}
.access .access-map iframe {
height: 450px;
}
.access .access-vertical span {
font-size: 2rem;
padding-top: .4em;
}
.pages-cta {
width: 92%;
margin: 5em auto;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.pages-cta .pc-item {
width: 48%;
}
.pages-cta .pc-item img {
width: 100%;
height: auto;
}
.flow-wrap {
max-width: 92%;
margin: 5em auto;
}
.flow-wrap .flow-bar {
font-size: .7rem;
}
.flow-wrap .flow-bar .flow-period {
padding: 3px 12px;
}
.flow-wrap .flow-body {
width: calc(100% - 160px);
padding: 0 0 100px 2em;
}
.flow-wrap .flow-body .flow-step-title {
font-size: 1.2rem;
}
.flow-wrap .flow-body .flow-step-body .flow-step-img {
width: 100%;
margin: 0 0 2em 0;
}
.flow-wrap .flow-body .flow-step-body .flow-step-text {
width: 100%;
font-size: 0.8rem;
line-height: 1.5;
}
.flow-wrap .flow-body .flow-cta {
margin: 1.5em 0 0 0;
font-size: .9rem;
background-size: 54px auto;
background-position: center left 20px;
}
.flow-wrap .flow-body .flow-cta span {
font-size: .7rem;
}
.flow-wrap .flow-body .flow-cta-contact {
padding: 1em 1em 1em 84px;
}
.flow-wrap .flow-body .flow-cta-works {
padding: 1.8em 1em 1.8em 84px;
}
.flow-wrap .flow-body .flow-point {
background-size: 80px auto;
padding-left: 130px;
}
.after-support {
width: 92%;
margin: 2em auto 5em auto;
}
.after-support h2 {
font-size: 1.5rem;
}
.after-support p {
font-size: .8rem;
}
.custom-works {
width: 92%;
margin: 4em auto 6em auto;
}
.custom-works .cw-list {
width: 92%;
}
.custom-works .cw-list .cw-item {
width: 32%;
}
.custom-works .cw-vertical {
font-size: 1.8rem;
} .reform-contents {  }
.reform-contents .reform-type {
position: relative;
background: #eef1f1;
padding: 5em 0 6em;  }
.reform-contents .reform-type::after {
content: '';
position: absolute;
right: 0;
bottom: 0;
width: 120px;
height: 120px;
background: #249cad;
clip-path: polygon(100% 0, 100% 100%, 0 100%);
}
.reform-contents .reform-type .reform-type-inner {
width: 90%;
margin: 0 auto;
position: relative;
z-index: 2;
}
.reform-contents .reform-type .reform-type-head {
margin: 0 0 2.5em;
border-left: 5px solid #249cad;
padding: 0 0 0 1.2em;
line-height: 1;
}
.reform-contents .reform-type .reform-type-head .reform-type-title {
margin: 0;
font-size: 1.7rem;
font-weight: 700;
letter-spacing: .08em;
color: #249cad;
}
.reform-contents .reform-type .reform-type-head .reform-type-title span {
display: block;
margin: .6em 0 0;
font-size: .9rem;
font-weight: 600;
letter-spacing: .06em;
color: #249cad;
}
.reform-contents .reform-type .reform-type-body {
display: flex;
justify-content: space-between;
align-items: flex-start;
}
.reform-contents .reform-type .reform-type-body .reform-type-figure {
width: 46%;
}
.reform-contents .reform-type .reform-type-body .reform-type-figure img {
width: 100%;
height: auto;
display: block;
}
.reform-contents .reform-type .reform-type-body .reform-type-texts {
width: 48%;
}
.reform-contents .reform-type .reform-type-body .reform-type-texts .reform-type-lead {
margin: 0 0 2em 0;
font-size: .9rem;
line-height: 1.5;
}
.reform-contents .reform-type .reform-type-body .reform-type-texts .reform-type-list {
list-style: none;
margin: 0;
padding: 0;
}
.reform-contents .reform-type .reform-type-body .reform-type-texts .reform-type-list li {
display: flex;
align-items: center;
margin: .5em 0;
}
.reform-contents .reform-type .reform-type-body .reform-type-texts .reform-type-list li .num {
width: 32px;
height: 32px;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
background: #249cad;
color: #fff;
font-weight: 700;
font-size: .9rem;
line-height: 1;
}
.reform-contents .reform-type .reform-type-body .reform-type-texts .reform-type-list li .txt {
font-size: 1.1rem;
font-weight: 700;
letter-spacing: .06em;
color: #249cad;
}
.reform-contents .reform-blocks {
padding: 5em 0 6em;
}
.reform-contents .reform-blocks .reform-blocks-inner {
width: 90%;
margin: 0 auto;
}
.reform-contents .reform-blocks .reform-block {
width: calc((100% - 3em) / 2); }
.reform-contents .reform-blocks .reform-block .reform-block-media {
position: relative;
overflow: hidden; }
.reform-contents .reform-blocks .reform-block .reform-block-media .tag-num {
position: absolute;
top: 0;
left: 0;
width: 100px;
height: 100px;
background: #249cad;
clip-path: polygon(0 0, 100% 0, 0 100%);
display: flex;
align-items: flex-start;
justify-content: flex-start;
padding: 20px;
color: #fff;
font-weight: 700;
font-size: 1.4rem;
line-height: 1;
}
.reform-contents .reform-blocks .reform-block .reform-block-media img {
width: 100%;
height: auto;
display: block;
}
.reform-contents .reform-blocks .reform-block .reform-block-info .reform-block-tag {
display: none;
}
.reform-contents .reform-blocks .reform-block .reform-block-info {
padding: 1.4em 0 0;
}
.reform-contents .reform-blocks .reform-block .reform-block-info .reform-block-title {
margin: 0 0 .7em;
font-size: 1.4rem;
font-weight: 700;
letter-spacing: .06em;
color: #249cad;
}
.reform-contents .reform-blocks .reform-block .reform-block-info .reform-block-text {
margin: 0;
font-size: .85rem;
line-height: 1.8;
} .reform-shop {
background: #eef1f1;
padding: 5em 0 6em;
}
.reform-shop .reform-shop-inner {
width: 90%;
margin: 0 auto;
display: flex;
justify-content: space-between;
gap: 3.5em;
}
.reform-shop .reform-shop-media {
position: relative;
width: 48%; }
.reform-shop .reform-shop-media::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 70px;
height: 70px;
background: #249cad;
clip-path: polygon(0 0, 100% 0, 0 100%);
z-index: 2;
}
.reform-shop .reform-shop-media img {
width: 100%;
height: auto;
display: block;
}
.reform-shop .reform-shop-info {
width: 50%;
}
.reform-shop .reform-shop-info .reform-shop-title {
margin: 0 0 1em 0 !important;
padding: 0 !important;
font-size: 1.2rem;
color: #249cad;
}
.reform-shop .reform-shop-info .reform-shop-text {
margin: 0 0 1em;
font-size: .85rem;
line-height: 1.5;
color: #333;
}
} @media (min-width: 1025px) {
#page-wrap {
max-width: 1000px;
margin: 0 auto 5em auto;
}
a[href^="tel:"] {
pointer-events: none;
cursor: default;
}
.w1000 {
width: 1000px;
margin: 3em auto;
}
.w1000 p {
font-weight: 500;
}
.pages-cta {
width: 800px;
margin: 5em auto;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.pages-cta .pc-item {
width: 48%;
}
.pages-cta .pc-item img {
width: 100%;
height: auto;
}
.flow-wrap {
max-width: 1000px;
margin: 5em auto;
}
.flow-wrap .flow-bar {
font-size: .7rem;
}
.flow-wrap .flow-bar .flow-period {
padding: 3px 12px;
}
.flow-wrap .flow-body {
width: calc(100% - 160px);
padding: 0 0 100px 4em;
}
.flow-wrap .flow-body .flow-step-title {
font-size: 1.8rem;
}
.flow-wrap .flow-body .flow-step-body .flow-step-img {
width: 30%;
}
.flow-wrap .flow-body .flow-step-body .flow-step-text {
width: 65%;
font-size: 0.8rem;
line-height: 1.5;
}
.flow-wrap .flow-body .flow-step-body .flow-cta {
margin: 1.5em 0 0 0;
font-size: .9rem;
background-size: 54px auto;
background-position: center left 20px;
}
.flow-wrap .flow-body .flow-step-body .flow-cta span {
font-size: .7rem;
}
.flow-wrap .flow-body .flow-step-body .flow-cta-contact {
padding: 1em 1em 1em 84px;
}
.flow-wrap .flow-body .flow-step-body .flow-cta-works {
padding: 1.8em 1em 1.8em 84px;
}
.flow-wrap .flow-body .flow-point {
background-size: 80px auto;
padding-left: 130px;
}
.flow-wrap .flow-last {
padding: 0 0 5em 0;
}
.after-support {
width: 1000px;
margin: 2em auto 5em auto;
}
.after-support h2 {
font-size: 1.8rem;
}
.after-support p {
font-size: .9rem;
}
.custom-works {
width: 1000px;
margin: 6em auto 6em auto;
}
.custom-works .cw-list {
width: 92%;
}
.custom-works .cw-list .cw-item {
width: 32%;
}
.custom-works .cw-vertical {
font-size: 1.8rem;
} .reform-contents {  }
.reform-contents .reform-type {
position: relative;
background: #eef1f1;
padding: 5em 0 6em;  }
.reform-contents .reform-type::after {
content: '';
position: absolute;
right: 0;
bottom: 0;
width: 120px;
height: 120px;
background: #249cad;
clip-path: polygon(100% 0, 100% 100%, 0 100%);
}
.reform-contents .reform-type .reform-type-inner {
width: 1000px;
margin: 0 auto;
position: relative;
z-index: 2;
}
.reform-contents .reform-type .reform-type-head {
margin: 0 0 2.5em;
border-left: 5px solid #249cad;
padding: 0 0 0 1.2em;
line-height: 1;
}
.reform-contents .reform-type .reform-type-head .reform-type-title {
margin: 0;
font-size: 2rem;
font-weight: 700;
letter-spacing: .08em;
color: #249cad;
}
.reform-contents .reform-type .reform-type-head .reform-type-title span {
display: block;
margin: .6em 0 0;
font-size: 1rem;
font-weight: 600;
letter-spacing: .06em;
color: #249cad;
}
.reform-contents .reform-type .reform-type-body {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.reform-contents .reform-type .reform-type-body .reform-type-figure {
width: 46%;
}
.reform-contents .reform-type .reform-type-body .reform-type-figure img {
width: 100%;
height: auto;
display: block;
}
.reform-contents .reform-type .reform-type-body .reform-type-texts {
width: 48%;
}
.reform-contents .reform-type .reform-type-body .reform-type-texts .reform-type-lead {
margin: 0 0 4em 0;
font-size: .9rem;
line-height: 2;
}
.reform-contents .reform-type .reform-type-body .reform-type-texts .reform-type-list {
list-style: none;
margin: 0;
padding: 0;
}
.reform-contents .reform-type .reform-type-body .reform-type-texts .reform-type-list li {
display: flex;
align-items: center;
gap: 1em;
margin: .9em 0;
}
.reform-contents .reform-type .reform-type-body .reform-type-texts .reform-type-list li .num {
width: 38px;
height: 38px;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
background: #249cad;
color: #fff;
font-weight: 700;
font-size: 1rem;
line-height: 1;
}
.reform-contents .reform-type .reform-type-body .reform-type-texts .reform-type-list li .txt {
font-size: 1.1rem;
font-weight: 700;
letter-spacing: .06em;
color: #249cad;
}
.reform-contents .reform-blocks {
padding: 5em 0 6em;
}
.reform-contents .reform-blocks .reform-blocks-inner {
width: 1000px;
margin: 0 auto;
}
.reform-contents .reform-blocks .reform-block {
width: 47%;
margin: 0 0 2em 0; }
.reform-contents .reform-blocks .reform-block .reform-block-media {
position: relative;
overflow: hidden; }
.reform-contents .reform-blocks .reform-block .reform-block-media .tag-num {
position: absolute;
top: 0;
left: 0;
width: 100px;
height: 100px;
background: #249cad;
clip-path: polygon(0 0, 100% 0, 0 100%);
display: flex;
align-items: flex-start;
justify-content: flex-start;
padding: 20px;
color: #fff;
font-weight: 700;
font-size: 1.4rem;
line-height: 1;
}
.reform-contents .reform-blocks .reform-block .reform-block-media img {
width: 100%;
height: auto;
display: block;
}
.reform-contents .reform-blocks .reform-block .reform-block-info .reform-block-tag {
display: none;
}
.reform-contents .reform-blocks .reform-block .reform-block-info {
padding: 1.4em 0 0;
}
.reform-contents .reform-blocks .reform-block .reform-block-info .reform-block-title {
margin: 0 0 .7em;
font-size: 1.4rem;
font-weight: 700;
letter-spacing: .06em;
color: #249cad;
}
.reform-contents .reform-blocks .reform-block .reform-block-info .reform-block-text {
margin: 0;
font-size: .85rem;
line-height: 1.8;
} .reform-shop {
padding: 5em 0 6em;
}
.reform-shop .reform-shop-inner {
width: 1000px;
margin: 0 auto;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
flex-wrap: nowrap;
}
.reform-shop .reform-shop-media {
position: relative;
width: 48%; }
.reform-shop .reform-shop-media::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100px;
height: 100px;
background: #249cad;
clip-path: polygon(0 0, 100% 0, 0 100%);
z-index: 2;
}
.reform-shop .reform-shop-media img {
width: 100%;
height: auto;
display: block;
}
.reform-shop .reform-shop-info {
width: 48%;
}
.reform-shop .reform-shop-info .reform-shop-title {
margin: 0 0 1em 0 !important;
padding: 0 !important;
font-size: 1.6rem;
}
.reform-shop .reform-shop-info .reform-shop-text {
margin: 0 0 1em 0;
font-size: .95rem;
line-height: 2;
color: #333;
}
.page-reserve .form-error-wrap .error-btn .btn-back {
transition: .3s ease;
}
.page-reserve .form-error-wrap .error-btn .btn-back:hover {
background: #249cad;
color: #fff;
}
}