@charset "UTF-8";
/* 構造・配色（PC・SP共通） */
#pt-main,#pt-life,#pt-point,#pt-last{ position: relative; }
#pt-main{ overflow: hidden; }
#pt-main::before{ content: ''; position: absolute; left: 0; background-color: #D4E1E3; }
#pt-main .pt-inner{ position: relative; }
#pt-main .pt-main-ttl span{ position: absolute; z-index: 3; line-height: 1; }
#pt-main .pt-main-ttl img{ width: 100%; }
#pt-main .pt-main-pic{ position: relative; z-index: 2; }
#pt-main .pt-main-pic img{ width: 100%; }
#pt-main .pt-main-catch{ position: relative; z-index: 3; color: #3E6D74; font-weight: 700; letter-spacing: 0.05em; }
#pt-main .pt-main-catch span{ display: block; }
#pt-main .pt-main-catch .pt-catch01,#pt-main .pt-main-catch .pt-catch02,#pt-main .pt-main-catch .pt-catch03{ display: block; background-color: #fff; box-sizing: border-box; white-space: nowrap; }
#pt-main .pt-main-txt{ position: relative; z-index: 3; color: #1E2424; letter-spacing: 0.05em; }

#pt-life .pt-life-head{ text-align: center; }
#pt-life .pt-life-ttl{ color: #1E2424; font-weight: 700; letter-spacing: 0.05em; }
#pt-life .pt-life-en{ line-height: 1; }
#pt-life .pt-life-en img{ vertical-align: top; }
#pt-life .pt-item{ position: relative; overflow: hidden; }
#pt-life .pt-item::before{ content: ''; position: absolute; top: 0; height: 100%; }
#pt-life .pt-item01::before,#pt-life .pt-item03::before{ left: 0; background-color: #F2F2F2; }
#pt-life .pt-item02::before{ right: 0; background-color: #D4E1E3; }
#pt-life .pt-item-box{ position: relative; background-color: #fff; }
#pt-life .pt-item-num{ position: absolute; line-height: 1; }
#pt-life .pt-item-num img{ width: 100%; }
#pt-life .pt-item-ttl{ position: relative; color: #1E2424; font-weight: 700; letter-spacing: 0.05em; }
#pt-life .pt-item-pic img,#pt-life .pt-item-pic2 img{ width: 100%; }
#pt-life .pt-item-txt{ color: #1E2424; letter-spacing: 0.05em; text-spacing-trim: space-all; }
#pt-life .pt-item-pic2{ position: relative; }
#pt-life .pt-item01 .pt-item-pic2::after{ content: ''; position: absolute; background: url(../images/patio/deco-zigzag.png) no-repeat left top / 100% 100%; }
#pt-life .pt-item02 .pt-item-box::after{ content: ''; position: absolute; background: url(../images/patio/deco-zigzag.png) no-repeat left top / 100% 100%; z-index: 2; }
#pt-life .pt-item03 .pt-item-box::after{ content: ''; position: absolute; background: url(../images/patio/deco-dots.png) no-repeat left top / 100% 100%; }

#pt-point::before{ content: ''; position: absolute; left: 0; background-color: #D4E1E3; }
#pt-point .pt-point-box{ position: relative; z-index: 1; background-color: #fff; border: 1px solid #1E2424; box-sizing: border-box; }
#pt-point .pt-point-ttl{ position: relative; text-align: center; color: #1E2424; font-weight: 700; letter-spacing: 0.05em; }
#pt-point .pt-point-ttl::after{ content: ''; position: absolute; left: 50%; bottom: 0; height: 1px; background-color: #707070; transform: translateX(-50%); -ms-transform: translateX(-50%); }
#pt-point .pt-point-txt{ position: relative; color: #1E2424; letter-spacing: 0.05em; text-spacing-trim: space-all; }

#pt-last .pt-last-box{ position: relative; background-color: #F2F2F2; }
#pt-last .pt-last-txt{ color: #1E2424; font-weight: 700; letter-spacing: 0.1em; }
#pt-last .pt-last-en{ position: absolute; line-height: 1; }
#pt-last .pt-last-en img{ width: 100%; }
#pt-last .pt-last-pic{ position: absolute; }
#pt-last .pt-last-pic img{ width: 100%; }
#pt-last .pt-last-pic::after{ content: ''; position: absolute; border: 1px solid #707070; }

#main-inc1 li:nth-child(2){display: none;}

@media screen and (min-width: 768px),print {
.seo_bread_list{margin-bottom: 0;}

#pt-main{ margin-top: 35px; height: 695px; }
#pt-main::before{ top: 34px; right: calc(50% - 428px); height: 661px; }
#pt-main .pt-inner{ width: 1100px; height: 695px; margin: 0 auto; }
#pt-main .pt-main-ttl01{ left: -35px; top: 131px; width: 366px; }
#pt-main .pt-main-ttl02{ left: -36px; top: 218px; width: 569px; }
#pt-main .pt-main-pic{ position: absolute; left: 435px; top: 0; width: 715px; }
#pt-main .pt-main-catch{ position: absolute; left: -33px; top: 379px; font-size: 25px; line-height: 61px; }
#pt-main .pt-main-catch .pt-catch01{ width: 385px; padding-left: 38px; }
#pt-main .pt-main-catch .pt-catch-row{ width: 523px; margin-top: 7px; padding-left: 38px; background-color: #fff; box-sizing: border-box; }
#pt-main .pt-main-catch .pt-catch02,#pt-main .pt-main-catch .pt-catch03{ display: inline; padding: 0; background: none; }
#pt-main .pt-main-txt{ position: absolute; left: -33px; top: 549px; width: 540px; font-size: 16px; line-height: 30px; }

#pt-life{ padding-top: 175px; }
#pt-life .pt-life-ttl{ font-size: 40px; line-height: 50px; }
#pt-life .pt-life-en{ margin-top: 19px; margin-bottom: 70px; }
#pt-life .pt-life-en img{ width: 185px; }
#pt-life .pt-item{ max-width: 1920px; margin: 0 auto; }
#pt-life .pt-item01{ height: 840px; }
#pt-life .pt-item02{ height: 705px; margin-top: 120px; }
#pt-life .pt-item03{ height: 693px; margin-top: 120px; }
#pt-life .pt-item01::before,#pt-life .pt-item03::before{ right: calc(50% - 600px); }
#pt-life .pt-item02::before{ left: calc(50% - 600px); }
#pt-life .pt-item-box{ width: 888px; box-sizing: border-box; }
#pt-life .pt-item01 .pt-item-box,#pt-life .pt-item03 .pt-item-box{ margin-left: calc(50% - 146px); padding-left: 176px; }
#pt-life .pt-item02 .pt-item-box{ margin-left: calc(50% - 749px); padding-left: 199px; }
#pt-life .pt-item01 .pt-item-box{ top: 74px; height: 688px; padding-top: 98px; }
#pt-life .pt-item02 .pt-item-box{ top: 92px; height: 535px; padding-top: 95px; }
#pt-life .pt-item03 .pt-item-box{ top: 92px; height: 522px; padding-top: 112px; }
#pt-life .pt-item-num{ width: 87px; }
#pt-life .pt-item01 .pt-item-num{ left: 124px; top: 18px; width: 76px; }
#pt-life .pt-item02 .pt-item-num{ left: 149px; top: 5px; }
#pt-life .pt-item03 .pt-item-num{ left: 132px; top: 26px; }
#pt-life .pt-item-ttl{ font-size: 40px; line-height: 50px; margin-bottom: 43px; }
#pt-life .pt-item-txt{ width: 520px; font-size: 16px; line-height: 30px; }
#pt-life .pt-item-pic2 + .pt-item-txt{ margin-top: 30px; }
#pt-life .pt-para{ display: block; margin-top: 30px; }
#pt-life .pt-item-pic{ position: absolute; width: 582px; }
#pt-life .pt-item01 .pt-item-pic{ left: -486px; top: 40px; }
#pt-life .pt-item02 .pt-item-pic{ left: 799px; top: 42px; }
#pt-life .pt-item03 .pt-item-pic{ left: -480px; top: 41px; }
#pt-life .pt-item01 .pt-item-pic2{ position: absolute; left: -454px; top: 485px; width: 307px; }
#pt-life .pt-item01 .pt-item-pic2::after{ left: 268px; top: -61px; width: 84.5px; height: 120px; }
#pt-life .pt-item02 .pt-item-box::after{ left: 858px; top: 454px; width: 84.5px; height: 120px; }
#pt-life .pt-item03 .pt-item-box::after{ left: 550px; top: 442px; width: 270px; height: 132px; }

#pt-point{ width: 1000px; margin: 150px auto 0; padding-bottom: 55px; }
#pt-point::before{ top: 55px; width: 1000px; height: 360px; }
#pt-point .pt-point-box{ width: 880px; height: 360px; margin-left: 60px; padding-top: 95px; }
#pt-point .pt-point-ttl{ font-size: 25px; line-height: 36px; padding-bottom: 24px; }
#pt-point .pt-point-ttl::after{ width: 30px; }
#pt-point .pt-point-txt{ margin-top: 28px; font-size: 16px; line-height: 30px; text-align: center; }

#pt-last{ max-width: 1920px; margin: 150px auto 0; padding-bottom: 245px; }
#pt-last .pt-last-box{ width: 1281px; max-width: 100%; height: 474px; margin: 0 auto; padding: 80px 0 0 91px; box-sizing: border-box; }
#pt-last .pt-last-txt{ font-size: 24px; line-height: 60px; }
#pt-last .pt-last-en{ left: 90px; top: 200px; width: 485px; }
#pt-last .pt-last-pic{ left: 625px; top: 259px; width: 600px; }
#pt-last .pt-last-pic::after{ left: -13px; top: -11px; width: 598px; height: 298px; }
}

@media screen and (max-width: 767px) {
#pt-main{ height: 200.483vw; margin-top: -0.725vw; }
#pt-main::before{ top: 19.807vw; right: 0; width: 100vw; height: 180.676vw; }
#pt-main .pt-inner{ height: 200.483vw; }
#pt-main .pt-main-ttl01{ left: 7.729vw; top: 10.145vw; width: 51.57vw; }
#pt-main .pt-main-ttl02{ left: 7.488vw; top: 22.464vw; width: 80.072vw; }
#pt-main .pt-main-pic{ position: absolute; left: 0; top: 42.512vw; width: 100vw; }
#pt-main .pt-main-catch{ position: absolute; left: 8.454vw; top: 118.357vw; font-size: 4.831vw; line-height: 12.077vw; }
#pt-main .pt-main-catch .pt-catch01,#pt-main .pt-main-catch .pt-catch02,#pt-main .pt-main-catch .pt-catch03{ padding-left: 4.348vw; }
#pt-main .pt-main-catch .pt-catch01{ width: 69.082vw; }
#pt-main .pt-main-catch .pt-catch02{ width: 56.28vw; }
#pt-main .pt-main-catch .pt-catch03{ width: 52.174vw; }
#pt-main .pt-main-catch .pt-catch-row,#pt-main .pt-main-catch .pt-catch03{ margin-top: 1.691vw; }
#pt-main .pt-main-txt{ position: absolute; left: 8.454vw; top: 161.111vw; width: 83.092vw; font-size: 3.865vw; line-height: 7.246vw; }

#pt-life{ padding-top: 17.633vw; }
#pt-life .pt-life-ttl{ font-size: 5.556vw; line-height: 12.077vw; }
#pt-life .pt-life-en{ margin-top: -0.483vw; margin-bottom: 12.077vw; }
#pt-life .pt-life-en img{ width: 39.13vw; }
#pt-life .pt-item{ overflow: visible; }
#pt-life .pt-item::before{ width: 100%; }
#pt-life .pt-item01{ padding: 9.662vw 0; }
#pt-life .pt-item02{ padding: 9.662vw 0; }
#pt-life .pt-item03{ padding: 9.662vw 0; }
#pt-life .pt-item-box{ width: 91.787vw; margin: 0 auto; padding: 0 4.348vw; box-sizing: border-box; }
#pt-life .pt-item01 .pt-item-box{ height: 262.319vw; padding-top: 26.329vw; }
#pt-life .pt-item02 .pt-item-box{ height: 183.575vw; padding-top: 26.329vw; }
#pt-life .pt-item03 .pt-item-box{ height: 188.406vw; padding-top: 26.329vw; }
#pt-life .pt-item-num{ left: 40.338vw; top: 10.145vw; width: 11.353vw; }
#pt-life .pt-item01 .pt-item-num{ left: 41.063vw; width: 9.903vw; }
#pt-life .pt-item-ttl{ font-size: 5.556vw; line-height: 8.454vw; text-align: center; margin-bottom: 5.797vw; }
#pt-life .pt-item-pic{ width: 82.126vw; margin: 0 auto 5.556vw; }
#pt-life .pt-item03 .pt-item-pic{ width: 82.609vw; }
#pt-life .pt-item-txt{ font-size: 3.865vw; line-height: 7.246vw; }
#pt-life .pt-item01 .pt-item-pic2{ width: 56.039vw; margin: 6.28vw 0.483vw 5.314vw auto; }
#pt-life .pt-item01 .pt-item-pic2::after{ left: -32.126vw; top: 10.628vw; width: 15.217vw; height: 21.739vw; background-image: url(../images/patio/sp-deco-zigzag.png); }
#pt-life .pt-item02 .pt-item-box::after{ display: none; }
#pt-life .pt-item03 .pt-item-box::after{ left: 42.754vw; top: 180.193vw; width: 51.932vw; height: 25.362vw; background-image: url(../images/patio/sp-deco-dots.png); }

#pt-point{ margin-top: 29.952vw; padding-bottom: 8.454vw; }
#pt-point::before{ top: 11.594vw; width: 100%; height: 86.715vw; }
#pt-point .pt-point-box{ width: 91.787vw; height: 89.855vw; margin: 0 auto; padding: 17.391vw 4.106vw 0; }
#pt-point .pt-point-ttl{ font-size: 4.831vw; line-height: 8.454vw; padding-bottom: 5.797vw; }
#pt-point .pt-point-ttl::after{ width: 7.246vw; }
#pt-point .pt-point-txt{ margin-top: 7.246vw; font-size: 3.865vw; line-height: 7.246vw; }

#pt-last{ margin-top: 19.324vw; padding-bottom: 28.986vw; }
#pt-last .pt-last-box{ width: 100vw; height: 101.932vw; padding: 16.546vw 0 0 6.28vw; box-sizing: border-box; }
#pt-last .pt-last-txt{ width: 87.44vw; font-size: 4.831vw; line-height: 8.696vw; }
#pt-last .pt-last-en{ left: 33.333vw; top: 53.865vw; width: 62.56vw; }
#pt-last .pt-last-pic{ left: 13.043vw; top: 74.638vw; width: 84.058vw; }
#pt-last .pt-last-pic::after{ left: -1.932vw; top: -1.449vw; width: 83.575vw; height: 41.546vw; }

#patio #main-inc1{ background: linear-gradient(#F2F2F2, #F2F2F2) no-repeat left 0 top 5.072vw / 38.164vw calc(100% - 5.072vw); }
}