.bg01 {
background-color: #f3f5f7;
}
.main h2 {
color: #111;
font-weight: 600;
}
.main .secTtl {
position: relative;
display: flex;
flex-flow: column;
font-size: 2.2em;
color: #111;
line-height: 1.4;
padding: 0;
margin: 0 auto 40px;
text-align: center;
align-items: center;
font-weight: 600;
}
.pageTitle {
display: none;
}
.contents {
margin-top: 0;
padding-top: 0;
}
#window-renovation.cmp .pageTitle {
display: flex;
}
#window-renovation.cmp .contents {
margin-top: 30px;
}
.mv {
display: flex;
justify-content: center;
position: relative;
background: #f1efe7 url(//owners-plus.com/wp-content/themes/ownersplus/img/common/bg01.png) center center;
padding: 8vmin 0 9vmin;
}
.mv::before {
content: "";
position: absolute;
left: 50%;
bottom: -70px;
transform: translateX(-50%);
width: 100%;
height: 417px;
background: url(//owners-plus.com/wp-content/themes/ownersplus/add/img/pic_renovation_mv_catch.png) center 0 no-repeat;
z-index: 1;
}
.mv img {
position: relative;
z-index: 2;
}
.firstView {
background-color: #fff;
padding: 3vmin 0 1vmin;
}
.conversion {
padding: 5vmin 0;
background-color: #f1efe7;
text-align: center;
}
.conversion .conversionTel .tel {
margin-bottom: 0;
font-size: 18px;
line-height: 1.2;
}
.conversion .conversionTel .tel span {
font-size: 70px;
padding-left: 70px;
background-size: 70px auto;
}
.conversion .conversionList {
display: flex;
align-items: center;
justify-content: center;
margin: 15px 0 0;
gap: 0 20px;
}
.conversion .conversionList li {
max-width: 320px;
margin: 0;
padding-left: 0;
}
.conversion .conversionList li::before,
.conversion .conversionList li::after {
content: none;
}
.conversion .conversionList li img {
max-width: 100%;
height: auto;
} .merits {
padding: 60px 0;
}
.meritsInner {
max-width: 1200px;
margin-inline: auto;
}
.merits h2 {
text-align: center;
}
.merits .meritsList {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
margin: 0;
}
.merits .meritsList li {
margin: 0;
padding: 0;
max-width: 290px;
border: 2px solid #ebe9e5;
background-color: #fff;
box-sizing: border-box;
border-radius: 6px;
padding: 20px;
text-align: center;
}
.merits .meritsList li dd {
margin-top: 15px;
font-size: 16px;
text-align: center;
font-weight: bold;
line-height: 1.4;
}
.merits .meritsList li img {
max-width: 100%;
height: auto;
}
.merits .meritsList li::before,
.merits .meritsList li::after {
content: none;
}
.merits .meritsDetalis {
margin-top: 60px;
max-width: 1000px;
margin-inline: auto;
}
.merits .meritsDetalis h3 {
background: transparent;
font-size: 32px;
color: #111;
width: auto;
padding: 0;
margin: 0;
text-align: center;
}
.merits .meritsDetalisPic {
margin-top: 40px;
}
.merits .meritsDetalisPic img {
max-width: 100%;
height: auto;
}
.merits .meritsDetalisPic figcaption {
margin-top: 5px;
font-size: 14px;
} .lead {
padding: 0 0 60px;
}
.leadInner {
max-width: 1200px;
margin-inline: auto;
}
.lead h2 {
margin-bottom: 20px;
font-size: 22px;
}
.lead h2 span {
font-size: 35px;
color: #ff8800;
text-align: center;
}
.lead .leadList {
display: flex;
justify-content: space-between;
margin: 40px 0 0 0;
gap: 0 20px;
}
.lead .leadList .leadItem {
width: 49%;
margin: 0;
border-radius: 20px;
padding: 24px 24px 20px 24px;
}
.lead .leadList .leadItem01 {
background: url(//owners-plus.com/wp-content/themes/ownersplus/add/img/pic_lead_main_img01.jpg) 0 0 / cover no-repeat;
}
.lead .leadList .leadItem02 {
background: url(//owners-plus.com/wp-content/themes/ownersplus/add/img/pic_lead_main_img02.jpg) 0 0 / cover no-repeat;
}
.lead .leadList li::before,
.lead .leadList li::after {
content: none;
}
.lead .leadItem .leadItemTtl {
margin: 0 0 32px 0;
border: 1px solid #fff;
border-radius: 4px;
padding: 13px 5px;
text-align: center;
background-color: rgba(241, 239, 231, 0.8);
backdrop-filter: blur(10px);
font-weight: 400;
font-size: 18px;
color: #111;
}
.lead .leadItem .leadItemLg {
font-size: 28px;
font-weight: 600;
}
.lead .leadItem .leadItemKind {
display: flex;
justify-content: center;
align-items: center;
border-radius: 50%;
border: 1px solid #fff;
background: #66605d;
margin: 0 0 258px auto;
width: 108px;
height: 108px;
}
.lead .leadItem .leadItemKind p {
margin: 0;
text-align: center;
color: #fff;
font-size: 15px;
line-height: calc(16 / 12);
letter-spacing: 0.08em;
font-weight: 400;
}
.lead .leadListFeature {
display: flex;
justify-content: center;
margin-bottom: 0;
}
.lead .leadListFeature .leadListItem {
display: flex;
justify-content: center;
align-items: center;
position: relative;
text-align: center;
width: 138px;
height: 138px;
margin: 0 18px 0 0;
padding: 0;
border-radius: 50%;
background: #fff;
border: 1px solid #ebe9e5;
font-size: 15px;
}
.lead .leadListFeature .leadListItem:last-child {
margin-right: 0;
}
.lead .leadListFeature .leadListItem::before,
.lead .leadListFeature .leadListItem::after {
content: "";
position: absolute;
top: 50%;
left: 50%;
translate: -50% -50%;
border-radius: 50%;
border: 1px solid #ebe9e5;
background-color: transparent;
}
.lead .leadListFeature .leadListItem::before {
width: 95%;
height: 95%;
}
.lead .leadListFeature .leadListItem::after {
width: 90%;
height: 90%;
}
.lead .leadInner .leadItemNote {
width: 49%;
margin: 10px 0 0 auto;
font-size: 14px;
}
.method {
margin-top: 30px;
}
.method .methodInner {
max-width: 1200px;
margin-inline: auto;
border-radius: 32px;
padding: 60px;
background-color: #f1efe7;
box-sizing: border-box;
}
.method h3 {
position: relative;
background-color: transparent;
font-size: 35px;
font-weight: 600;
color: #111;
line-height: 1.4;
padding: 0;
margin: 0;
position: relative;
text-align: center;
}
.method .methodRow {
display: flex;
justify-content: space-between;
margin-top: 40px;
}
.method .methodRow02 {
align-items: center;
}
.method .methodCol {
width: 45%;
}
.method .methodRow02 .methodCol {
width: 38%;
}
.method .methodRow02 .methodCol + .methodCol {
width: 58%;
}
.method .methodCol .methodTtl {
font-size: 22px;
padding: 0;
margin: 0;
color: #111;
}
.method .methodCol .methodTtl::before,
.method .methodCol .methodTtl::after {
content: none;
}
.method .methodCol p.methodTxt {
margin-top: 35px;
margin-bottom: 0;
}
.method .methodCol .methodPicRow {
display: flex;
align-items: center;
}
.method .methodCol .methodPicRow img:first-child {
width: 64%;
height: 100%;
}
.method .methodCol .methodPicRow img:nth-of-type(2) {
width: 32%;
height: 100%;
}
.method .methodCol .methodPic {
margin-top: 20px;
text-align: center;
}
.method .methodCol .methodPic img {
max-width: 100%;
height: auto;
}
.method .methodCol .methodNote {
margin-top: 10px;
}
.method .methodCol .methodNote li {
margin: 0;
padding: 0;
font-size: 12px;
}
.method .methodCol .methodNote li::before,
.method .methodCol .methodNote li::after {
content: none;
}
.method .methodContent {
margin-top: 60px;
}
.method .methodContent .methodLeadTtl {
font-size: 22px;
padding: 0;
margin: 0;
color: #222;
}
.method .methodContent + .methodContent {
margin-top: 60px;
padding-top: 60px;
border-top: 1px solid #cecdcd;
}
.method .methodContent .methodLeadTtl::before,
.method .methodContent .methodLeadTtl::after {
content: none;
}
.method .methodContent .methodLead {
margin-top: 20px;
margin-bottom: 0;
}
.method .methodContent .methodTxts {
position: relative;
text-align: center;
}
.method .methodContent h4.methodTxt {
display: inline-block;
margin: 0;
padding: 0;
position: relative;
font-size: 18px;
line-height: calc(20 / 14);
font-weight: 600;
color: #ff8800;
}
.method .methodContent h4.methodTxt::before,
.method .methodContent h4.methodTxt::after {
content: "";
width: 1px;
height: 18px;
background: #ff8800;
position: absolute;
top: 50%;
border-radius: 6px;
opacity: 1;
}
.method .methodContent h4.methodTxt::before {
left: -25px;
transform: translate(0%, -50%) rotate(-30deg);
}
.method .methodContent h4.methodTxt::after {
left: inherit;
right: -25px;
transform: translate(0%, -50%) rotate(30deg);
}
.method .methodContent .methodNote {
margin: 10px 0 0 0;
padding: 0;
font-size: 12px;
} .product {
margin-bottom: 60px;
}
.product .productInner {
max-width: 1000px;
margin-inline: auto;
}
.product .productTables {
border-radius: 10px;
background-color: #fff;
}
.product .productTable {
width: 100%;
table-layout: fixed;
margin: 0;
}
.product .productTable tr th:first-child,
.product .productTable tr td:first-child {
width: 20%;
padding: 1em;
font-size: 16px;
border-bottom: 1px solid #ebe9e5;
}
.product .productTable tr th {
background-color: #fff;
color: #111;
}
.product .productTable tr th,
.product .productTable tr td {
width: auto;
padding: 1em;
font-size: 16px;
line-height: 1;
text-align: left;
vertical-align: middle;
border-bottom: 1px solid #ebe9e5;
background-color: #fff;
}
.product .productTable tr td {
text-align: center;
border-bottom: 1px solid #ebe9e5;
border-left: 1px solid #ebe9e5;
}
.product .productTable .productWrap {
display: flex;
flex-direction: row;
align-items: flex-end;
width: 100%;
}
.product .productTable .productWrap .thumb {
width: 45%;
height: auto;
padding: 0 5% 0 0;
}
.product .productTable .productWrap .thumb img {
max-width: 100%;
height: auto;
border-radius: 20px;
}
.product .productTable .productWrap .btnWrap p {
margin-bottom: 0;
font-size: 15px;
} .subsidys {
margin-bottom: 60px;
}
.subsidys .secTtl.fullWidth {
margin-bottom: 0;
}
.subsidys .subsidyInner {
padding: 60px 20px;
}
.subsidys .subsidyMenu {
display: flex;
flex-wrap: wrap;
margin-bottom: 0;
gap: 20px;
max-width: 1000px;
margin-inline: auto;
}
.subsidys .subsidyMenu li {
width: 32%;
margin: 0;
border: 2px solid #ebe9e5;
background-color: #fff;
box-sizing: border-box;
border-radius: 6px;
padding: 20px;
text-align: center;
}
.subsidys .subsidyMenu li::before,
.subsidys .subsidyMenu li::after {
content: none;
}
.subsidys .subsidyMenu li h3 {
margin: 0;
padding: 0;
color: #111;
box-shadow: none;
border: none;
background: none;
line-height: 1.4;
font-size: 18px;
text-align: center;
}
.subsidys .subsidyMenu .subsidyPic {
margin-top: 20px;
text-align: center;
}
.subsidys .subsidyMenu .subsidyPic img {
max-width: 100%;
max-height: 218px;
height: auto;
} .otherMenus {
margin-bottom: 60px;
}
.otherMenus .otherMenu {
display: flex;
flex-wrap: wrap;
margin-bottom: 0;
gap: 20px;
max-width: 1200px;
margin-inline: auto;
}
.otherMenus .otherMenu li {
width: 23%;
margin: 0;
border: 2px solid #3b4391;
box-sizing: border-box;
border-radius: 6px;
padding: 0 10px 10px;
text-align: center;
}
.otherMenus .otherMenu li::before,
.otherMenus .otherMenu li::after {
content: none;
}
.otherMenus .otherMenu .otherMenufirst {
width: 100%;
padding: 0 20px 10px;
text-align: left;
}
.otherMenus .otherMenu .otherMenufirst h3 {
margin: 0 -20px 15px;
}
.otherMenus .otherMenu h3 {
margin: 0 -10px 15px;
background: #3b4391;
box-shadow: none;
font-size: 20px;
text-align: center;
}
.otherMenus .otherMenu .otherRow {
display: flex;
}
.otherMenus .otherMenu .otherPic {
width: 220px;
margin-inline: auto;
}
.otherMenus .otherMenu .otherPic img {
width: 100%;
max-width: 100%;
height: auto;
}
.otherMenus .otherMenu .otherPrice {
color: #c1272d;
font-size: 32px;
font-weight: bold;
}
.otherMenus .otherMenu .otherPrice span {
font-size: 20px;
}
.otherMenus .btnWrap {
margin: 40px 0 0;
text-align: center;
}
.otherMenus .btnWrap .btn {
min-width: 308px;
margin: 0;
}
.otherMenus .btnWrap .btn a {
text-decoration: none;
} .achievement {
position: relative;
}
.main .achievementList {
padding: 60px 20px;
}
.achievement h2.fullWidth {
margin-bottom: 0;
}
.achievementSlider {
width: 1200px;
margin: 0 auto;
}
.main .archiveList .achievementItem {
width: 375px;
margin-bottom: 0;
}
.main .archiveList article > a {
display: block;
border-color: #ebe9e5;
}
.achievementItem .more {
background-color: #111;
color: #fff;
text-align: center;
font-size: 15px;
font-weight: 600;
padding: 5px 0;
}
.achievementList .btnWrap {
margin: 30px 0 0;
text-align: center;
}
.achievementList .btnWrap .btn {
margin: 0;
}
.main .formArea h2 {
font-size: 30px;
}