main.spec #content_header {
background-image: url(//bondhome.d-grip.com/wp/wp-content/themes/bondhome_theme/img/bg/material/bg_spec_top.jpg);
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
}
main.zero_energy #content_header {
background-image: url(//bondhome.d-grip.com/wp/wp-content/themes/bondhome_theme/img/bg/material/bg_zero_energy_top.jpg);
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
}
main.garden #content_header {
background-image: url(//bondhome.d-grip.com/wp/wp-content/themes/bondhome_theme/img/bg/material/bg_garden_top.jpg);
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
}
main.garden_r #content_header {
background-image: url(//bondhome.d-grip.com/wp/wp-content/themes/bondhome_theme/img/bg/material/bg_garden_r_top.jpg);
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
} #content_header {
padding-top:45px;
}
#content_header nav.page_link ul li{
margin-bottom:210px;
}
#content_header nav.page_link li {
background: #999;
text-align: center;
margin-right:5%;
width:30%;
float:left;
font-size:15px;
}
#content_header nav.page_link li:last-child {
margin-right:0;
}
#content_header nav.page_link li a{
color:#FFF;
padding:20px 5px;
display: block;
width:100%;
height:100%;
}
#content_header nav.page_link li a:hover{
background: #000;
}
#content_header nav.page_link li br {
display:none;
}
.link_active {
background: #000!important;
}
.content_logo img{
display: block;
margin:auto;
}
main.spec .content_logo img{
width:45%;
margin-bottom:20px;
}
main.spec .content_logo h1{
color:#000;
font-weight:bold;
text-align: center;
font-size:22px;
}
main.zero_energy .content_logo img{
margin-bottom:30px;
width:35%;
}
main.zero_energy .content_logo h1{
color:#FFF;
font-weight:normal;
text-align: center;
font-size:22px;
}
main.garden .content_logo img{
width:75%;
margin-bottom:0px;
}
main.garden .content_logo h1{
color:#000;
font-weight:bold;
text-align: center;
font-size:22px;
}
main.garden_r .content_logo img{
width:75%;
margin-bottom:0px;
}
main.garden_r .content_logo h1{
color:#fff;
font-weight:bold;
text-align: center;
font-size:22px;
}
@media (max-width: 767px) { #content_header {
padding-top:15px;
height:380px;
}
#content_header nav.page_link ul li{
margin-bottom:50px;
}
#content_header nav.page_link li {
background: #999;
text-align: center;
margin-right:2%;
width:32%;
float:left;
line-height: 18px;
}
#content_header nav.page_link li a{
color:#FFF;
padding:12px 5px;
display: block;
width:100%;
height:100%;
font-size:12px;
}
#content_header nav.page_link li br{
display: block;
}
#content_header nav.page_link li:nth-of-type(1) a,
#content_header nav.page_link li:nth-of-type(3) a{
height:60px;
padding-top:20px;
}
#content_header nav.page_link li:nth-of-type(2) {
height:60px;
}
main.spec .content_logo img{
min-width:200px;
}
main.zero_energy .content_logo img{
margin-bottom:20px;
width:80%;
max-width: 200px;
}
.content_logo p{
font-size:20px;
margin-bottom: 100px;
}
} .read_text_area{
color:#000;
height:385px;
text-align: left;
padding:120px 0 0px;
}
.read_text_area h2{
font-size:23px;
text-align: center;
font-weight:550;
margin-bottom: 30px;
color:#444;
letter-spacing: 0.05rem
}
.read_text_area p{
font-weight: 500;
font-size: 18px;
letter-spacing: 0.08rem;
}
.read_text_area{
height: auto;
margin-bottom: 75px;
}
@media (max-width:1139px){
.read_text_area {
padding-left:20px;
padding-right:20px;
}
}
@media (max-width:767px){
.read_text_area {
padding-top:50px;
}
.read_text_area p{
letter-spacing: 0.05rem;
font-size: 14px;
}
} #spec_contents {
color:#000;
}
#spec_contents .inner {
width:950px;
padding: 0px;
}
@media (max-width: 991px){
#spec_contents .inner{
width: 100%;
}
}
.spec_intro_link {
margin-bottom: 100px;
}
.spec_intro_link .container {
width:950px;
}
.spec_intro_link ul {
margin-right:-20px;
margin-left:-20px;
}
.spec_intro_link li {
height: 230px;
padding:0 5px;
}
.spec_intro_link li a{
display: block;
width:100%;
height:100%;
color:#FFF;
position: relative;
}
.spec_intro_link li a:hover{
margin-top:10px;
transition: .4s;
}
.spec_intro_link li:nth-of-type(1) a{
background: url(//bondhome.d-grip.com/wp/wp-content/themes/bondhome_theme/img/bg/material/bg_spec_link_01.jpg);
background-size:100%;
}
.spec_intro_link li:nth-of-type(2) a{
background: url(//bondhome.d-grip.com/wp/wp-content/themes/bondhome_theme/img/bg/material/bg_spec_link_02.jpg);
background-size:100%;
}
.spec_intro_link li:nth-of-type(3) a{
background:url(//bondhome.d-grip.com/wp/wp-content/themes/bondhome_theme/img/bg/material/bg_spec_link_03.jpg);
background-size:100%;
}
.spec_intro_link li:nth-of-type(4) a{
background: url(//bondhome.d-grip.com/wp/wp-content/themes/bondhome_theme/img/bg/material/bg_spec_link_04.jpg);
background-size:100%;
margin-right: 0;
}
.spec_intro_link li a:hover{
color:#FFF;
}
.spec_intro_link li a:focus{
color:#FFF;
}
.spec_intro_link li h2{
text-align: right;
font-size:32px;
margin:0;
font-weight:500;
padding:8px 15px;
letter-spacing: 0.2rem;
}
.spec_intro_link li a p{
position: absolute;
bottom:0;
font-size:60px;
margin-bottom: 0;
line-height: 70px;
padding-left:10px;
font-weight:bold;
}
@media (max-width: 991px){
.spec_intro_link .container {
width:750px;
}
.spec_intro_link li {
height:170px;
}
.spec_intro_link li h2{
font-size:28px;
padding:5px 15px;
}
}
@media (max-width: 767px){
.spec_intro_link .container {
width:750px;
}
.spec_intro_link li {
height:120px;
}
.spec_intro_link li h2{
font-size:22px;
padding:3px 15px;
}
}
@media (max-width: 575px){
.spec_intro_link .container {
width:300px;
}
.spec_intro_link li {
height:120px;
margin-bottom: 10px;
}
.spec_intro_link li h2{
font-size:22px;
padding:5px 10px;
}
}
#spec_intro_01 {
width:1420px;
margin:auto;
padding-top:70px;
position: relative;
margin-bottom: 100px;
}
@media (max-width: 1419px){
#spec_intro_01 {
width: 1000px;
}
}
.intro_block {
width:110px;
height:110px;
background: url(//bondhome.d-grip.com/wp/wp-content/themes/bondhome_theme/img/parts/material/parts_intro_block.svg);
background-size: 100%;
position: absolute;
top:0;
z-index:1;
}
.intro_block.wide {
width:163.716px;
background: url(//bondhome.d-grip.com/wp/wp-content/themes/bondhome_theme/img/parts/material/parts_intro_block_wide.svg);
}
@media (max-width: 575px) {
.intro_block.wide {
width:119px;
}
}
.intro_block h2{
color:#FFF;
text-align: right;
font-size:22px;
margin:0;
font-weight:500;
padding:8px 15px;
letter-spacing: 0.2rem
}
.intro_block p{
position: absolute;
bottom:0;
font-size:40px;
margin-bottom: 0;
line-height: 50px;
padding-left:10px;
font-weight:bold;
}
.intro01_content01 {
height:450px;
width:1210px;
margin:0 auto 50px;
background: url(//bondhome.d-grip.com/wp/wp-content/themes/bondhome_theme/img/bg/material/bg_intro01_01.jpg);
background-size:auto;
background-repeat: no-repeat;
}
.intro01_content01_text,
.intro01_content03_text {
width:450px;
text-align: justify;
letter-spacing: 0.1rem;
font-size:18px;
}
.intro01_content04_text {
width:350px;
text-align: justify;
letter-spacing: 0.1rem;
font-size:18px;
}
.intro01_content01_text h3,
.intro01_content03_text h3 {
font-weight: 550;
font-size:24px;
letter-spacing: 0.05rem;
line-height: 40px
}
.intro01_content02 {
height:510px;
margin:0 auto 80px;
background: url(//bondhome.d-grip.com/wp/wp-content/themes/bondhome_theme/img/bg/material/bg_intro01_02.png);
background-size:auto;
background-position: right bottom;
background-repeat: no-repeat;
}
.intro01_content02_text {
width:540px;
text-align: justify;
letter-spacing: 0.05rem;
font-size:18px;
}
.intro01_content02_text h3{
font-weight: bold;
font-size:25px;
letter-spacing: 0.1rem;
line-height: 40px
}
.intro01_content03 {
height:400px;
width:1210px;
margin:0 auto ;
background: no-repeat url(//bondhome.d-grip.com/wp/wp-content/themes/bondhome_theme/img/bg/material/bg_intro01_03.png);
background-size: auto;
background-position: left 140px top 10px;
}
.intro01_content04 {
height:550px;
margin:0 auto 50px;
}
.intro01_content04 .entry_block {
display: flex;
flex-direction: row;
justify-content: space-around;
}
.intro01_content04 .entry_block p:before{
content:"■";
}
.intro01_content04 .entry_block img {
width: auto;
height: 291px;
}
.intro01_content04 .entry_1{
margin-right: 20px;
}
.intro01_content04 .entry_2 {
width: 310px;
}
.entry_block,
.intro01_content04 .intro01_content04_text{
padding: 0;
}
.intro01_content04 .intro01_content04_text{
width: 320px;
}
.intro01_content04 .intro01_content04_text li:before{
content:"・";
}
.intro01_content01_text p,
.intro01_content02_text p,
.intro01_content03_text p {
font-weight: 500;
}
@media (max-width: 1419px){
.intro01_content01 {
width:1000px;
background-size:50%;
}
.intro01_content02 {
height:530px;
background-size:45%;
}
.intro01_content02_text {
width:500px;
text-align: justify;
text-justify: inter-ideograph;
}
.intro01_content03 {
width:1000px;
background-size: 40%;
background-position: left 100px top 10px;
}
}
@media (max-width: 999px){
#spec_intro_01 {
width:760px;
}
#spec_contents .inner {
width:760px;
}
.intro01_content01 {
width:760px;
background-size:35%;
}
.intro01_content02 {
background-position: right bottom;
height:650px;
}
.intro01_content01_text h3{
font-weight: bold;
font-size:22px;
letter-spacing: 0.1rem;
line-height: 35px
}
.intro01_content02_text {
width:400px;
}
.intro01_content03 {
width:760px;
background-size: 40%;
background-position: left 0 top 10px;
}
}
@media (max-width: 991px) {
.intro01_content04 .entry_block p{
font-size: 16px;
}
}
@media (max-width: 767px) {
#spec_intro_01 {
width:560px;
margin-bottom: 150px;
}
#spec_contents .inner {
width:560px;
}
.intro_block {
top:-20px;
}
.intro01_content01,
.intro01_content03 {
width:560px;
background-size:100%;
background-position:center top;
}
.intro01_content01_text {
width:100%;
height:100%;
background: rgba(255,255,255,0.7);
padding:36px 20px;
}
.intro01_content01_text h3 br:nth-of-type(2),
.intro01_content01_text h3 br:nth-of-type(3){
display: none;
}
.intro01_content01_text p,
.intro01_content02_text p {
font-size: 18px;
}
.intro01_content03_text {
width: 100%;
height: 400px;
background: rgba(255,255,255,0.7);
padding:36px 20px;
}
.intro01_content02 {
width:560px;
background-size:100%;
background-position:center top;
margin-bottom: 40px;
}
.intro01_content02_text{
width:560px;
height:100%;
background: rgba(255,255,255,0.7);
padding:36px 20px;
}
.intro01_content04{
height: auto;
}
.intro01_content04 .entry_block {
flex-direction: column;
align-items: center;
}
.entry_1{
margin-bottom: 25px;
}
}
@media (max-width: 575px){
.intro_block {
width:80px;
height:80px;
top:-10px;
}
.intro_block h2{
font-size:20px;
padding:3px;
}
#spec_intro_01 {
width:300px;
margin-bottom: 80px;
}
#spec_contents .inner {
width:300px;
}
.intro01_content01 {
width:300px;
height: 600px;
background-size:100%;
padding-top:230px;
background-position:center top;
}
.intro01_content01_text{
width:100%;
height:100%;
padding:0px 10px;
}
.intro01_content01_text h3{
font-size:16px;
line-height:25px;
}
.intro01_content01_text p{
font-size:14px;
}
.intro01_content02 {
width:300px;
height: 760px;
background-size:100%;
padding-top:230px;
background-position:center top;
}
.intro01_content02_text{
width:100%;
height:100%;
padding:0px 10px;
}
.intro01_content02_text h3{
font-size:16px;
line-height:25px;
}
.intro01_content02_text p{
font-size:14px;
}
.intro01_content03 {
width:300px;
height: 500px;
background-size:100%;
padding-top:230px;
background-position:center top;
}
.intro01_content03_text{
width:100%;
height:100%;
padding:0px 10px;
}
.intro01_content03_text h3{
font-size:16px;
line-height:25px;
}
.intro01_content03_text p,
.intro01_content04_text {
font-size:14px;
}
.intro01_content04{
margin-bottom: 170px;
}
}
#spec_intro_02 {
width:1230px;
margin:auto;
padding-top:1px;
position: relative;
margin-bottom: 100px;
}
@media (max-width: 1419px){
#spec_intro_02 {
width: 1000px;
}
}
.intro02_content01 {
height:450px;
width:1230px;
margin:70px auto 50px;
background: url(//bondhome.d-grip.com/wp/wp-content/themes/bondhome_theme/img/bg/material/bg_intro02.jpg);
background-size:auto;
background-repeat: no-repeat;
}
.intro02_content01_text {
width:450px;
}
.intro02_content01_text h3{
font-size:24px;
letter-spacing: 0.1rem;
line-height: 40px;
font-weight:550;
margin-bottom: 15px;
}
.intro02_content01_text p{
letter-spacing: 0.1rem;
text-align: justify;
margin-bottom: 30px;
}
.intro02_content02 {
clear:both;
}
.intro02_content02 li{
padding:0;
}
.intro02_content02 h3{
font-weight: 550;
font-size:24px;
letter-spacing: 0.1rem;
line-height: 40px;
margin-top: 20px;
}
.intro02_content02 p{
font-size:18px;
letter-spacing: 0.1rem;
text-align:justify;
}
@media (max-width: 1419px){
.intro02_content01 {
width:1000px;
background-size:50%;
}
.intro02_content02 {
height: 510px;
background-size: 45%;
}
.intro02_content02_text {
width:500px;
text-align: justify;
text-justify: inter-ideograph;
}
}
@media (max-width: 999px){
#spec_intro_02 {
width:760px;
}
.intro02_content01 {
width:760px;
height:350px;
background-size:35%;
margin-bottom: 0;
}
.intro02_content02 {
background-position: right top;
}
.intro02_content01_text h3,
.intro02_content02_text li h3{
font-weight: bold;
font-size:22px;
letter-spacing: 0.1rem;
line-height: 35px
}
}
@media (max-width: 767px) {
#spec_intro_02 {
width:560px;
margin-bottom:0;
}
.intro02_content01 {
width: 560px;
background-size: 100%;
background-position: center top;
margin-bottom: 50px;;
}
.intro02_content01_text {
width: 100%;
height: 100%;
background: rgba(255,255,255,0.7);
padding: 36px 20px;
}
.intro02_content01_text p,
.intro02_content02_text p {
font-size: 18px;
}
.intro02_content01 {
width:560px;
background-size:100%;
background-position:center top;
}
.intro02_content01_text,
.intro02_content02_text {
width:100%; height:350px;
background: rgba(255,255,255,0.7);
padding:36px 20px;
}
.intro02_content01_text p,
.intro02_content02_text p {
font-size: 18px;
}
.intro02_content02 {
background-size:100%;
background-position:center top;
width:560px;
height:450px;
}
.intro02_content02_text{
width:560px;
height:100%;
background: rgba(255,255,255,0.7);
padding:36px 20px;
}
.intro02_content02 li h3 {
font-size:22px;
}
.intro02_content02 ul {
position: relative;
}
.intro02_content02 li img {
width: 100%;
}
.intro02_content02 li:first-child {
z-index: 1;
height: 360px;
}
.intro02_content02 li:last-child {
position: absolute;
}
}
@media (max-width: 575px){
#spec_intro_02 {
width:300px;
}
.intro02_content01{
width: 300px;
height: 450px;
background-size: 100%;
background-position: center top;
padding-top: 230px;
margin-bottom: 0;
}
.intro02_content01_text{
width: 100%;
height: 100%;
padding: 0px 10px;
}
.intro02_content01_text h3{
font-size: 16px;
line-height: 20px;
}
.intro02_content01_text p{
font-size: 14px;
margin-bottom: 15px;
}
.intro02_content02{
width: 300px;
height: 760px;
background-size: 100%;
padding-top: 0px;
background-position: center top;
}
.intro02_content02 li h3 {
font-size:16px;
}
.intro02_content02 li p {
font-size:14px;
}
.intro02_content02 .container li {
padding:5px!important;
}
.intro02_content02_text h3{
font-size: 16px;
line-height: 25px;
}
.intro02_content01_text{
width:100%;
height:100%;
padding:0px 10px;
}
.intro02_content01_text h3{
font-size:16px;
line-height:25px;
}
.intro02_content01_text p{
font-size:14px;
}
.intro02_content02 {
height: 500px;
width:300px;
background-size:100%;
background-position:center top;
margin-top: 30px;
}
.intro02_content02_text h3{
font-size:16px;
line-height:25px;
}
#spec_intro_02{
width: 300px;
}
.intro02_content02 li:last-child {
position: static;
}
}
#spec_intro_03 {
width:1230px;
margin:auto;
padding-top:1px;
position: relative;
margin-bottom: 100px;
margin-bottom: 100px;
}
@media (max-width: 1419px){
#spec_intro_03 {
width: 1000px;
}
}
.intro03_content01 {
height:450px;
width:1230px;
margin:70px auto 50px;
background: url(//bondhome.d-grip.com/wp/wp-content/themes/bondhome_theme/img/bg/material/bg_intro03_01.png);
background-size:auto;
background-repeat: no-repeat;
}
.intro03_content01_text {
width:800px;
margin-bottom: 26px;
padding:0 5px 0 20px;
}
.intro03_content01_text h3{
font-weight: bold;
text-align: right;
font-size:25px;
letter-spacing: 0.1rem;
line-height: 40px
}
.intro03_content01_text p{
letter-spacing: 0.1rem
}
.intro03_content02 li{
padding:0 10px;
margin-bottom: 20px;
}
.intro03_content02 .row {
margin:0 -25px;
}
.intro03_content02 h3{
margin-top: 10px;
font-weight: bold;
font-size:25px;
letter-spacing: 0.1rem;
line-height: 40px
}
@media (max-width: 1419px){
.intro03_content01 {
width:1000px;
background-size:50%;
height:350px;
}
.intro03_content01_text {
margin-bottom: 0;
}
.intro03_content01_img {
width:340px;
}
.intro03_content02 {
width:1000px;
}
}
@media (max-width: 999px){
#spec_intro_03 {
width:760px;
}
.intro03_content01 {
width:760px;
height:350px;
background-size:auto;
margin-bottom: 30px;
}
.intro03_content02 {
background-position: right top;
}
.intro03_content01_text {
width:600px;
}
.intro03_content01_text h3{
font-weight: bold;
font-size:22px;
letter-spacing: 0.1rem;
line-height: 35px
}
.intro03_content01_text p{
font-size:16px;
line-height: 35px
}
.intro03_content01_img {
width:275px;
}
.intro03_content02 {
width:720px;
clear:both;
}
}
@media (max-width: 767px) {
#spec_intro_03 {
width:560px;
}
.intro03_content01 {
width: 560px;
background-size: 100%;
background-position: center top;
margin-bottom: 50px;;
float:none;
}
.intro03_content01_text {
width: 100%;
height: 350px;
background: rgba(255,255,255,0.7);
padding: 36px 20px;
margin-bottom: 30px;
float:none;
}
.intro03_content01_img{
float:none;
width:300px;
margin:30px auto 30px;
clear: both;
}
.intro03_content02 {
width:540px;
padding-top:220px;
}
}
@media (max-width: 575px){
#spec_intro_03 {
width: 300px;
margin-top:100px;
}
.intro03_content01{
width: 300px;
height: 500px;
background-size: 100%;
background-position: center top;
padding-top: 230px;
margin-bottom: 0;
}
.intro03_content01_text{
width: 100%;
height: 100%;
padding: 0px 10px;
}
.intro03_content01_text h3{
font-size: 16px;
line-height: 25px;
text-align: left;
letter-spacing: .01rem
}
.intro03_content01_text p{
font-size: 14px;
line-height:24px;
}
.intro03_content02{
width: 300px;
padding-top: 80px;
}
.intro03_content01_img{
width:200px;
margin:30px auto 0px;
}
.intro03_content02 li {
padding:0 3px;
margin-bottom: 5px;
}
}
#spec_intro_04 {
width:1230px;
margin:auto;
padding-top:1px;
position: relative;
margin-bottom: 100px;
}
@media (max-width: 1419px){
#spec_intro_04 {
width: 1000px;
}
}
#spec_intro_04 > div {
height:350px;
width:1230px;
margin:50px auto 0px;
background-size:auto;
background-repeat: no-repeat;
}
.intro04_content01 {
background: url(//bondhome.d-grip.com/wp/wp-content/themes/bondhome_theme/img/bg/material/bg_intro04_01.png);
margin-top: 70px!important;
}
.intro04_content02 {
background: url(//bondhome.d-grip.com/wp/wp-content/themes/bondhome_theme/img/bg/material/bg_intro04_02.png);
}
.intro04_content03 {
background: url(//bondhome.d-grip.com/wp/wp-content/themes/bondhome_theme/img/bg/material/bg_intro04_03.png);
}
.intro04_content04 {
background: url(//bondhome.d-grip.com/wp/wp-content/themes/bondhome_theme/img/bg/material/bg_intro04_04.png);
}
.intro04_content05 {
background: url(//bondhome.d-grip.com/wp/wp-content/themes/bondhome_theme/img/bg/material/bg_intro04_05.png);
}
.intro04_text_inner {
position: relative;
height:350px;
background: none;
}
.intro04_text_inner > div {
position: absolute;
bottom:0;
width: 457px;
}
.intro04_text_inner p{
margin-bottom: 0;
font-size:16px;
letter-spacing: 0.06rem;
text-align: justify;
text-justify: inter-ideograph;
}
.intro04_text_inner h3{
font-size:29px;
font-weight: 600;
color:#444;
letter-spacing: 0.1rem;
line-height: 40px;
position: relative;
}
.intro04_content01_text,
.intro04_content03_text,
.intro04_content05_text {
right:0;
}
.intro04_content01_text h3::after,
.intro04_content03_text h3::after,
.intro04_content05_text h3::after {
content: url(//bondhome.d-grip.com/wp/wp-content/themes/bondhome_theme/img/bg/material/balloon_right.png);
position: absolute;
top: -70px;
left: 105px;
transform: scale(0.9);
}
.intro04_content02_text h3::after,
.intro04_content04_text h3::after {
content: url(//bondhome.d-grip.com/wp/wp-content/themes/bondhome_theme/img/bg/material/balloon_left.png);
position: absolute;
top: -70px;
left: -50px;
transform: scale(0.9);
}
@media (max-width: 1419px){
#spec_intro_04 > div {
height:300px;
width:1000px;
margin:50px auto 0px;
background-size:100%;
background-repeat: no-repeat;
}
.intro04_text_inner {
height:290px;
}
}
@media (max-width: 1199px) {
.intro04_content02_text h3::after,
.intro04_content04_text h3::after {
position: absolute;
left: -10px;
}
}
@media (max-width: 999px){
#spec_intro_04 {
width:760px;
}
#spec_intro_04 > div {
height:250px;
width:760px;
margin:50px auto 0px;
background-size:100%;
}
.intro04_text_inner {
height:230px;
}
.intro04_text_inner > div{
width:360px;
}
.intro04_text_inner h3{
font-size:20px;
margin-bottom: 0;
}
.intro04_text_inner p{
font-size:14px;
}
.intro04_content01_text h3::after,
.intro04_content03_text h3::after,
.intro04_content05_text h3::after{
transform: scale(0.7);
top: -65px;
left: 60px;
}
.intro04_content02_text h3::after,
.intro04_content04_text h3::after {
transform: scale(0.7);
top: -65px;
left: -30px;
}
.intro04_content03 .intro04_text_inner > div {
bottom: -20px;
}
}
@media (max-width: 767px) {
#spec_intro_04 {
width:560px;
}
#spec_intro_04 > div {
height:240px;
margin:50px auto 0px;
width:560px;
}
.intro04_content01,
.intro04_content03,
.intro04_content05 {
background-size:cover!important;
background-position: center left
}
.intro04_content02,
.intro04_content04{
background-size:cover!important;
background-position: center right
}
.intro04_text_inner {
height:240px;
}
.intro04_text_inner > div{
width:100%;
background: rgba(255,255,255,.6);
height:100%;
padding:20px 30px 0;
}
.intro04_text_inner h3{
font-size:20px;
margin-bottom: 0;
}
.intro04_text_inner p{
font-size:14px;
}
.intro04_content01_text h3::after,
.intro04_content02_text h3::after,
.intro04_content03_text h3::after,
.intro04_content04_text h3::after,
.intro04_content05_text h3::after {
content: url(//bondhome.d-grip.com/wp/wp-content/themes/bondhome_theme/img/bg/material/balloon_right.png);
transform: scale(0.6);
top: -60px;
}
.intro04_content02_text h3::after {
left: 80px;
}
.intro04_content03_text h3::after {
left: 90px;
}
.intro04_content04_text h3::after {
left: 220px;
}
.intro04_content01 .intro04_text_inner > div,
.intro04_content02 .intro04_text_inner > div,
.intro04_content04 .intro04_text_inner > div {
padding-top: 50px;
}
.intro04_content03 .intro04_text_inner > div {
bottom: 0;
}
}
@media (max-width: 575px) {
#spec_intro_04 {
width:300px;
}
#spec_intro_04 > div {
height:100%;
margin:50px auto 0px;
width:300px;
}
.intro04_text_inner > div {
top:0;
}
.intro04_content03 .intro04_text_inner {
height:400px!important;
}
.intro04_content04 .intro04_text_inner {
height:350px!important;
}
.intro04_content05 .intro04_text_inner {
height:350px!important;
}
.intro04_content01 .intro04_text_inner > div,
.intro04_content02 .intro04_text_inner > div,
.intro04_content04 .intro04_text_inner > div {
padding-top: 20px;
}
.intro04_content04_text h3::after {
left: 150px;
}
} #zeh_contents {
color:#000;
}
#zeh_contents .inner {
width:960px;
padding: 10px;
}
@media (max-width: 991px){
#zeh_contents .inner {
width:100%;
}
} .devising_area h2 {
margin-bottom: 50px;
font-size:24px;
letter-spacing: 0.05rem;
text-align: center;
font-weight: 550;
color:#444;
}
.devising_img {
padding:0 50px;
text-align: center;
margin-bottom: 100px;
}
.devising_img img:nth-of-type(1){
margin-bottom:50px;
width:740px;
}
@media (max-width: 991px) {
.devising_img {
padding:0 50px;
text-align: center;
margin-bottom: 80px;
}
.devising_img img:nth-of-type(1){
width:100%;
margin-bottom:50px;
}
.devising_img img:nth-of-type(1) {
width: 100%;
}
}
@media (max-width: 767px){
.devising_area h2 {
text-align:left;
font-size:22px;
margin-bottom: 20px;
}
.devising_img {
padding:0 20px;
}
}
@media (max-width: 575px){
.devising_area h2 {
font-size:16px;
margin-bottom: 20px;
text-align:left;
}
.devising_img {
padding:0 0px;
margin-bottom: 30px;
}
} .energy_saving {
position: relative;
padding:30px 0 0;
margin-bottom: 100px;
}
.title_label {
width: 240px;
position: absolute;
top:-15px;
left:-15px;
}
.energy_saving p {
font-weight: 500;
margin-top: 70px;
margin-bottom: 25px;
letter-spacing: 0.08rem;
margin-top: 70px;
text-align: justify;
color:#444;
}
.energy_saving_img img:nth-of-type(1) {
width:480px;
margin-right: 30px;
margin-top: 100px;
}
.energy_saving_img img:nth-of-type(2) {
width:420px;
}
@media (max-width: 991px) {
.title_label {
width: 150px;
position: absolute;
top:-20px;
left:0px;
}
.energy_saving {
width:740px;
padding:0px;
margin: 0 auto 50px;
}
.energy_saving p {
margin-top: 50px;
margin-bottom: 50px;
padding: 0 30px;
}
.energy_saving_img img:nth-of-type(1) {
width:50%;
margin-right: 30px;
margin-top: 100px;
}
.energy_saving_img img:nth-of-type(2) {
width:45%;
}
}
@media (max-width: 767px) {
.title_label {
width: 150px;
position: absolute;
top:-10px;
left:-10px;
}
.energy_saving {
width:550px;
padding:60px 0 0;
margin: 0 auto 50px;
}
.energy_saving p {
margin-top: 0px;
margin-bottom: 30px;
padding: 0px;
font-size:15px;
}
.energy_saving_img img:nth-of-type(1) {
width:90%;
margin-right: 0px;
margin-top: 0px;
margin:0 auto 50px;
display: block;
}
.energy_saving_img img:nth-of-type(2) {
width:70%;
margin-right: 0px;
margin-top: 0px;
margin:0 auto 30px;
display: block;
}
}
@media (max-width: 575px) {
.title_label {
width: 120px;
position: absolute;
top:0px;
left:0px;
}
.energy_saving {
width:300px;
padding:60px 0 0;
margin: 0 auto 50px;
}
.energy_saving p {
margin-top: 0px;
margin-bottom: 30px;
padding:0 10px;
font-size:14px;
}
.energy_saving_img img:nth-of-type(1) {
width:100%;
margin-right: 0px;
margin-top: 0px;
margin:0 auto 50px;
display: block;
}
.energy_saving_img img:nth-of-type(2) {
width:100%;
margin-right: 0px;
margin-top: 0px;
margin:0 auto 30px;
display: block;
}
} .insulation {
position: relative;
padding:30px 0 0;
margin-bottom: 70px;
}
.insulation_intro {
margin-top: 70px;
margin-bottom: 50px;
letter-spacing: 0.08rem;
color:#444;
font-weight: 500;
}
.insulation_point {
padding:0 20px;
height: 325px;
margin-bottom: 90px;
}
.insulation_point_area .point01 {
background-repeat:no-repeat;
background-position:right;
background:url(//bondhome.d-grip.com/wp/wp-content/themes/bondhome_theme/img/bg/material/bg_insulation_point_01.jpg);
}
.insulation_point_area .point02 {
background: url(//bondhome.d-grip.com/wp/wp-content/themes/bondhome_theme/img/bg/material/bg_insulation_point_02.jpg);
background-repeat:no-repeat;
background-position:right;
}
.insulation_point_area .point03 {
background: url(//bondhome.d-grip.com/wp/wp-content/themes/bondhome_theme/img/bg/material/bg_insulation_point_03.jpg);
background-repeat:no-repeat;
background-position:right;
}
.insulation_text {
width: 470px;
}
.point02 .right {
text-align: right;
} .insulation_text p {
text-justify: inter-ideograph;
text-align: justify;
}
.point02 .insulation_text p {
text-align: left;
}
.point_label {
display: inline-block;
width:108px;
position: relative;
margin-bottom: 15px;
margin-top: -20px;
}
.point_label p {
width:108px;
position: absolute;
font-weight:bold;
top:25%;
left:40%;
font-size: 40px;
color:#B3A98B;
text-align: left;
}
.insulation_text h3 {
font-size:30px;
margin-bottom: 10px;
font-weight:550;
color:#444;
}
.insulation_text p {
margin-bottom:15px;
font-size:16px;
color:#444;
letter-spacing:0.08rem;
font-weight:500;
}
@media (max-width: 991px) {
.insulation {
width:740px;
padding:0px;
margin:0 auto 50px;
}
.insulation_intro  {
margin-top: 50px;
margin-bottom: 50px;
padding:0 30px;
}
.insulation_point {
margin-bottom: 50px;
padding: 0 20px;
height: 325px;
}
.insulation_text {
width:380px;
}
.insulation_point_area .point01 {
background-position:-100px;
}
.insulation_point_area .point02 {
background-position:-110px;
}
.insulation_point_area .point03 {
background-position:-100px;
}
.point_label {
width:90px;
margin-bottom: 10px;
margin-top: -20px;
}
.point_label p {
width:90px;
top:30%;
left:40%;
font-size: 30px;
}
}
@media (max-width: 767px) {
.insulation {
width:550px;
padding:60px 0 0;
margin: 0 auto 50px;
}
.insulation p {
margin-top: 0px;
padding: 0px;
font-size:15px;
}
.point_label {
position: absolute;
width:80px;
margin-bottom: 10px;
margin-top: -20px;
}
.point_label p {
width:0px;
top:30%;
left:40%;
font-size: 25px;
}
.insulation_point {
padding:0;
height:250px;
}
.insulation_text h3 {
font-size:22px;
}
.insulation_point_area .point01 {
background-position:right;
}
.insulation_point_area .point02 {
background-position:left;
}
.insulation_point_area .point03 {
background-position:right;
}
.insulation_text {
width:100%;
background: rgba(255,255,255,.6);
height:100%;
padding:65px 30px 30px;
}
.point02 .right{
text-align: left;
}
}
@media (max-width: 575px) {
.insulation {
width:300px;
padding:60px 0 0;
margin: 0 auto 50px;
}
.insulation p {
margin-top: 0px;
margin-bottom: 30px;
padding:0 10px;
font-size:14px;
}
.point_label {
position: absolute;
width:60px;
margin-bottom: 10px;
margin-top: -20px;
}
.point_label p {
width:0px;
top:30%;
left:25%;
font-size: 20px;
}
.insulation_point {
padding:0;
height:310px;
}
.insulation_text h3 {
font-size:18px;
}
.insulation_text {
padding:50px 10px 30px;
}
} .comparison h3 {
background-size:100%;
background-repeat: no-repeat;
text-align: center;
color:#333;
padding:6px 0;
max-width: 800px;
margin:0 auto 50px;
font-weight:550;
font-size:24px;
background: #DDD;
position: relative;
height:40px;
}
.comparison h3:before {
content:"";
display: inline-block;
height: 0;
position:absolute;
left:0;
top:0;
border-left: 20px solid #FFF;
border-top: 20px solid transparent;
border-bottom: 20px solid transparent;
}
.comparison h3:after {
content:"";
display: inline-block;
height: 0;
position:absolute;
right:0;
top:0;
border-right: 20px solid #FFF;
border-top: 20px solid transparent;
border-bottom: 20px solid transparent;
}
.comparison_header {
padding:0 30px;
position: relative;
margin-bottom: 20px;
}
.comparison_header p{
position:absolute;
top:80px;
left:0;
text-align: center;
width: 100%;
font-size:24px;
font-weight: 550;
color:#333;
line-height: 38px
}
li:first-child .comparison_header p {
top:100px;
}
.comparison table {
width:100%;
margin-bottom: 20px;
}
.comparison table th{
width:33%;
text-align: center;
font-weight:normal;
font-size:16px;
padding:8px;
}
.comparison table td{
padding-left: 10px;
font-size:16px;
font-weight: 500;
}
.comparison table caption{
caption-side:top;
text-align: center;
font-size:22px;
color:#FFF;
font-weight: normal;
padding:3px 0 0 0;
}
.table01 caption{
background: #0247AE;
}
.table01 tr {
border:1px solid #0247AE;
}
.table01 th {
background: #EAF6FD;
}
.table02 caption{
background: #92C94C;
}
.table02 tr {
border:1px solid #92C94C;
}
.table02 th {
background: #EAF6DF;
}
.table03 caption{
background: #FF4A34;
}
.table03 tr {
border:1px solid #FF4A34;
}
.table03 th {
background: #FDD2A6;
}
.comparison table + p {
text-align: center;
font-weight: 500;
font-size: 20px;
line-height: 30px;
color:#555;
}
.container ul + p {
font-weight: 500;
text-align: right;
font-size:14px;
}
.container ul + p.align_left {
text-align: left;
margin-left: -15px;
}
@media (max-width: 991px) {
.comparison_header p{
top:30px;
left:0;
text-align: center;
width: 100%;
font-size:20px;
line-height: 38px
}
li:first-child .comparison_header p{
top:50px;
}
}
@media (max-width: 767px){
.comparison  h3 {
font-size: 20px;
margin-bottom: 30px;
padding-top:8px;
}
.comparison li {
padding:5px;
}
.comparison_header{
padding:0;
}
.comparison_header p{
top:50px;
left:0;
font-size:16px;
line-height: 30px
}
li:first-child .comparison_header p{
top:70px;
}
.comparison table caption {
font-size:16px;
}
.comparison table th{
width:30%;
}
.comparison table th,
.comparison table td {
font-size:14px;
}
.comparison table + p {
font-size:16px;
line-height:25px;
}
}
@media (max-width: 575px){
.comparison  h3 {
font-size: 16px;
margin-bottom: 0px;
padding-top:12px;
}
.comparison li {
padding: 20px 30px 0;
}
.comparison_header {
padding:0 30px;
}
.comparison_header p{
top:60px;
left:0;
font-size:16px;
line-height: 30px
}
li:first-child .comparison_header p{
top:80px;
}
.container ul + p {
font-size:12px;
padding:0;
}
} #garden_contents {
margin-bottom: 0px;
}
#garden_contents .inner {
width:935px;
padding: 0;
}
@media (max-width: 991px){
#garden_contents .inner {
width:100%;
padding: 20px;
}
} .garden_intro_area {
background: url(//bondhome.d-grip.com/wp/wp-content/themes/bondhome_theme/img/bg/material/bg_garden.png);
padding:80px 0 50px;
color:#000;
}
.garden_intro {
margin-bottom: 100px;
}
.intro_label {
width:295px;
margin:0 auto 20px;
}
.intro_text {
margin-bottom: 50px;
letter-spacing: .07rem;
font-weight:500;
}
.intro_img {
position: relative;
padding:0 20px;
}
.intro01 .intro_sub_img {
position: absolute;
top:-20px;
left:-50px;
width: 115%;
}
.intro02 .intro_sub_img {
position: absolute;
top:60px;
left:-120px;
width: 130%;
}
.intro03 .intro_sub_img {
position: absolute;
top:-20px;
left:-200px;
width: 145%;
}
@media (max-width: 575px){
.garden_intro_area{
padding:
50px 0 0;
}
.garden_intro{
margin-bottom:50px;
}
.intro_label {
width:80%;
max-width:250px;
}
.intro_img {
position: relative;
padding:0 0px;
}
.intro01 .intro_sub_img {
top:0px;
left:0px;
width: 100%;
}
.intro02 .intro_sub_img {
top:0px;
left:-50px;
width: 120%;
}
.intro03 .intro_sub_img {
top:40px;
left:-30px;
width: 120%;
}
}
.eijyu_link {
margin: 100px auto 100px;
width: 420px;
height: 83px;
line-height: 83px;
text-align: center;
}
.eijyu_link a {
color:#FFF;
display: block;
width:100%;
height: 100%;
background: #3F4041;
border: 2px solid #3F4041;
vertical-align: middle;
font-weight: 600;
}
.eijyu_link a:hover {
color:#3F4041;
background: #FFF;
}
.eijyu_link i {
margin-left: 15px;
}
@media (max-width: 767px) {
.eijyu_link {
height: 70px;
background: #3F4041;
text-align: center;
color: #ffffff;
float: none;
width: 100%;
max-width: 350px;
margin: 80px auto;
}
.eijyu_link p:last-child {
margin-top: -10px;
}
}  .br {
display: inline-block;
}
.pc_none {
display: none;
}
@media (max-width: 767px) {
.pc_none {
display: inline-block;
}
.sp_none {
display: none;
}
}
#garden_r_contents .inner {
width: 1140px;
padding: 0 25px;
margin: auto;
}
@media (max-width: 991px){
#garden_r_contents .inner {
width:100%;
padding: 20px;
}
}
#garden_r_contents .read_text_area h2 {
color: #000;
font-weight: 400;
letter-spacing: 0.3em;
}
.read_text_area .main_ttl_top {
font-size: 24px;
font-weight: 400;
display: block;
margin-bottom: 20px;
font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
color: #000;
letter-spacing: 0.3em;
}
.read_text_area .main_ttl_btm {
font-size: 36px;
font-weight: 400;
display: block;
margin-bottom: 40px;
font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
color: #000;
letter-spacing: 0.3em;
}
.read_text_area .main_txt_top {
font-size: 16px;
font-weight: 500;
letter-spacing: 1px;
line-height: 32px;
text-align: center;
margin-bottom: 60px;
}
.read_text_area .main_txt_cnt {
font-size: 21px;
font-weight: 400;
letter-spacing: 0.2em;
line-height: 32px;
text-align: center;
font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
}
.read_text_area .main_txt_btm {
font-size: 28px;
font-weight: 400;
letter-spacing: 0.2em;
line-height: 32px;
text-align: center;
font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
}
.read_text_area .main_txt_btm_line {
background: linear-gradient(transparent 60%, #d9e9f4 60%);
}
_:-ms-fullscreen, :root .read_text_area .main_txt_btm_line {
background: linear-gradient(transparent 45%, #d9e9f4 45%);
}
@media (max-width: 767px) {
.read_text_area .main_ttl_top {
font-size: 18px;
margin-bottom: 20px;
}
.read_text_area .main_ttl_btm {
font-size: 22px;
margin-bottom: 40px;
line-height: 28px;
}
.read_text_area .main_txt_cnt {
font-size: 18px;
}
.read_text_area .main_txt_btm {
font-size: 22px;
}
} .garden_plan_bg {
background: url(//bondhome.d-grip.com/wp/wp-content/themes/bondhome_theme/img/parts/material/parts_garden_bg.png) repeat;
margin: 120px 0 0 0;
padding: 0 0 180px 0;
}
.plan_ttl_wrap {
text-align: center;
margin: -24px 0 0 0;
}
.plan_ttl {
color: #231815;
font-size: 60px;
font-weight: bold;
letter-spacing: 1px;
margin-top: -32px;
margin-bottom: 110px;
display: inline-block;
position: relative;
}
.plan_ttl:after {
content: "";
width: 70px;
height: 7px;
margin: 0px 32.44px;
border-bottom: solid 7px #231815;
position: absolute;
left: 0;
bottom: -10px;
}
.plan_top {
text-align: center;
padding-bottom: 60px;
border-bottom: solid 4px #231815;
}
.plan_top img {
max-width: 650px;
}
@media (max-width: 767px) {
.garden_plan_bg {
padding: 0 0 80px 0;
}
.plan_ttl {
margin-bottom: 60px;
}
}
.plan_1f_flex {
display: flex;
margin: 80px 10% 0 10%;
}
.plan_1f_item_l {
flex-basis: 54%;
margin: 0 18% 0 0;
}
.plan_1f_item_l_img {
margin: 80px 0 40px 0;
}
.plan_1f_item_l_img img {
max-width: 67px;
}
.plan_1f_item_l_txt {
font-size: 16px;
font-weight: 500;
letter-spacing: 1px;
line-height: 36px;
}
.plan_1f_item_r {
flex-basis: 28%;
}
.plan_1f_item_r img {
max-width: 221px;
}
.plan_2f_flex {
display: flex;
flex-direction: row-reverse;
margin: 80px 10% 0 10%;
}
.plan_2f_item_l {
flex-basis: 60%;
margin: 0 0 0 12%;
}
.plan_2f_item_l_img {
margin: 40px 0 40px 0;
}
.plan_2f_item_l_img img {
max-width: 77px;
}
.plan_2f_item_l_img_photo {
margin: 40px 0 0 -40px;
max-width: 480px;
}
.plan_2f_item_l_txt {
font-size: 16px;
font-weight: 500;
letter-spacing: 1px;
line-height: 36px;
}
.plan_2f_item_r {
flex-basis: 28%;
}
.plan_2f_item_r img {
max-width: 221px;
}
.plan_2f_photo_flex {
display: flex;
margin: 20px 8% 0 8%;
}
.plan_2f_photo_item_l {
flex-basis: 53%;
margin: 0 3% 0 0;
}
.plan_2f_photo_item_r {
flex-basis: 44%;
}
.plan_2f_photo_item_l01 {
margin: 0 0 24px 0;
text-align: right;
}
.plan_2f_photo_item_l01 img {
max-width: 378px
}
.plan_2f_photo_item_l02 img {
max-width: 460px
}
.plan_2f_photo_item_r img {
max-width: 365px
}
@media (max-width: 767px) {
.plan_2f_item_l_img_photo {
margin: 40px 0 0 0;
}
}
.plan_3f_flex {
display: flex;
margin: 80px 14% 0 14%;
}
.plan_3f_item_l {
flex-basis: 55%;
margin: 0 14% 0 0;
}
.plan_3f_item_l_img {
margin: 70px 0 40px 0;
}
.plan_3f_item_l_img img {
max-width: 77px;
}
.plan_3f_item_l_txt {
font-size: 16px;
font-weight: 500;
letter-spacing: 1px;
line-height: 36px;
}
.plan_3f_item_r {
flex-basis: 31%;
}
.plan_3f_item_r img {
max-width: 221px;
}
@media (max-width: 767px) {
.plan_top {
margin-top: -40px;
}
.plan_top img {
max-width: 354px;
margin: 0 0 0 8%;
}
.plan_1f_flex {
display: block;
margin: 40px 0 0 0;
text-align: center;
}
.plan_1f_item_l {
margin: 0 0 0 0;
}
.plan_1f_item_l_txt {
flex-basis: 80%;
font-size: 16px;
font-weight: 500;
letter-spacing: 1px;
line-height: 24px;
}
.plan_1f_item_r {
margin: 20px 0 0 0;
}
.plan_2f_flex {
display: block;
margin: 100px 0 0 0;
text-align: center;
}
.plan_2f_item_l {
margin: 0 0 0 0;
}
.plan_2f_item_l_txt {
flex-basis: 80%;
font-size: 16px;
font-weight: 500;
letter-spacing: 1px;
line-height: 24px;
}
.plan_2f_item_r {
margin: 20px 0 0 0;
}
.plan_2f_photo {
text-align: center;
margin: 40px 0 0 0;
}
.plan_2f_photo_flex {
margin: 20px 0 0 0;
}
.plan_2f_photo_item_l {
flex-basis: 50%;
margin: 0 2% 0 0;
}
.plan_2f_photo_item_l01 {
margin: 0 0 8px 0;
}
.plan_2f_photo_item_r {
flex-basis: 48%;
}
.plan_3f_flex {
display: block;
margin: 70px 0 0 0;
text-align: center;
}
.plan_3f_item_l {
margin: 0 0 0 0;
}
.plan_3f_item_l_txt {
flex-basis: 80%;
font-size: 16px;
font-weight: 500;
letter-spacing: 1px;
line-height: 24px;
}
.plan_3f_item_r {
margin: 20px 0 0 0;
}
} .eijyu_link_r_wrap {
margin: 0 4%;
}
.eijyu_link_r {
margin: -44px auto 100px;
width: 420px;
height: 83px;
line-height: 83px;
text-align: center;
}
.eijyu_link_r a {
color:#FFF;
display: block;
width:100%;
height: 100%;
background: #3F4041;
border: 2px solid #3F4041;
vertical-align: middle;
font-weight: 600;
}
.eijyu_link_r a:hover {
color:#3F4041;
background: #FFF;
}
.eijyu_link_r i {
margin-left: 15px;
}
@media (max-width: 767px) {
.eijyu_link_r {
height: 70px;
background: #3F4041;
text-align: center;
color: #ffffff;
float: none;
width: 100%;
max-width: 350px;
margin: -40px auto 80px;
}
.eijyu_link_r p:last-child {
margin-top: -10px;
}
}