﻿*:where(:not(html,iframe,canvas,img,svg,video,audio):not(svg *,symbol *)){all:unset;display:revert}*,*::before,*::after{box-sizing:border-box}a,button{cursor:revert}ol,ul,menu{list-style:none}img{max-inline-size:100%;max-block-size:100%}table{border-collapse:collapse}input,textarea{-webkit-user-select:auto}textarea{white-space:revert}meter{-webkit-appearance:revert;appearance:revert}pre{all:revert}::placeholder{color:unset}::marker{content:""}:where([hidden]){display:none}:where([contenteditable]:not([contenteditable=false])){-moz-user-modify:read-write;-webkit-user-modify:read-write;overflow-wrap:break-word;-webkit-line-break:after-white-space;-webkit-user-select:auto}:where([draggable=true]){-webkit-user-drag:element}:where(dialog:modal){all:revert}html{font-size:62.5%}a{text-decoration:none}img{max-width:100%;height:auto;vertical-align:bottom}iframe{display:block;width:100%}@media screen and (min-width: 600px){.sp{display:none}}.pc{display:none}@media screen and (min-width: 1025px){.pc{display:block}}.main{display:block}body{color:#333;font-family:"Noto Sans JP",sans-serif;font-weight:400;font-size:1.6rem;line-height:1.5;letter-spacing:.1em;background-color:#fff}body.fixed{position:fixed;height:100%;overflow-y:scroll}main{overflow:hidden}a{color:#333}.wrapper{margin:0 auto;padding:0 4%;width:100%;max-width:120rem}.block{padding:clamp(10rem,4.586rem + 15.04vw,20rem) 0}h2{font-size:clamp(2.4rem,1.101rem + 3.61vw,4.8rem);font-weight:bold;text-align:center;margin-bottom:clamp(5rem,2.293rem + 7.52vw,10rem)}h2::before{content:attr(data-title);display:block;color:#ff9f06;font-size:clamp(1.6rem,1.167rem + 1.2vw,2.4rem);font-weight:normal}h2 span{display:inline-block}.btn a{display:flex;gap:1em;color:#fff;padding:1rem 2rem;width:fit-content;margin-inline:auto;background:#ff9f06;border-radius:1rem}.btn a::after{content:"→";transition:translate .5s}.btn a:hover::after{translate:.5em}.bg .image{position:absolute;top:50%;left:50%;translate:-50% -50%}.bg .shadow{position:absolute;top:0;left:0;z-index:-2;animation:rotate 20s linear infinite}@keyframes rotate{0%{rotate:0}100%{rotate:360deg}}header{position:fixed;top:0;left:0;z-index:10;width:100%;background-color:rgba(255,255,255,.8)}header .wrapper{display:flex;align-items:center;justify-content:space-between;padding:1rem 2rem;max-width:192rem}header .wrapper h1{color:#ff9f06;font-size:1.6rem;font-weight:bold}header .wrapper h1 a{display:flex;align-items:center;gap:1em;color:#ff9f06}header .wrapper h1 a::after{content:"つむぎクリーンメンテナンス"}header .wrapper h1 a img{width:3rem}.nav{display:grid;place-items:center;position:fixed;z-index:20;top:0;right:-100%;width:100%;min-height:100dvh;background-color:#ff9f06;transition:right .5s}@media screen and (min-width: 1025px){.nav{position:static;width:auto;min-height:auto;background-color:rgba(0,0,0,0)}}.nav.active{right:0}.nav ul{display:flex;flex-direction:column;gap:3rem}@media screen and (min-width: 1025px){.nav ul{flex-direction:row;gap:2rem}}.nav ul a{display:block;color:#fff;text-transform:uppercase}@media screen and (min-width: 1025px){.nav ul a{color:#333}.nav ul a::after{content:"";display:block;width:100%;height:1px;background-color:#333;transform:scale(0);transition:transform .5s}.nav ul a:hover::after{transform:scale(1)}}.menuBtn{position:relative;z-index:30;width:3.3rem;height:2rem;background-color:rgba(0,0,0,0);border:none}@media screen and (min-width: 1025px){.menuBtn{display:none}}.menuBtn::after1{position:absolute;left:0;bottom:0;content:"MENU";width:100%;color:#333;font-size:1rem;text-align:center}.fixed .menuBtn::after1{color:#fff}.menuBtn:hover{cursor:pointer}.menuBtn:focus{outline:0;-webkit-tap-highlight-color:rgba(0,0,0,0)}.menuBtn span{display:block;position:absolute;width:100%;height:2px;background:#ff9f06;transition:all .5s}.fixed .menuBtn span{background:#fff}.menuBtn span:nth-child(1){top:0}.fixed .menuBtn span:nth-child(1){translate:0 .8rem;rotate:-45deg}.menuBtn span:nth-child(2){top:.8rem}.fixed .menuBtn span:nth-child(2){opacity:0}.menuBtn span:nth-child(3){top:1.6rem}.fixed .menuBtn span:nth-child(3){translate:0 -0.8rem;rotate:45deg}#hero-image{display:flex;flex-direction:column-reverse}@media screen and (min-width: 600px){#hero-image{min-height:100vh;flex-direction:row;align-items:center}}#hero-image .wrapper{display:grid;gap:4.8rem}#hero-image .wrapper h2{font-size:clamp(1.6rem,-0.132rem + 4.81vw,4.8rem);font-weight:bold;text-align:center;margin-bottom:clamp(3rem,1.917rem + 3.01vw,5rem)}@media screen and (min-width: 600px){#hero-image .wrapper h2{text-align:left}}#hero-image .wrapper h2 span{color:#ff9f06;font-size:clamp(2.4rem,.235rem + 6.02vw,6.4rem)}#hero-image .wrapper .btn{display:flex;justify-content:center;gap:3.2rem}@media screen and (min-width: 600px){#hero-image .wrapper .btn{justify-content:flex-start}}#hero-image figure{width:100%;max-width:1214px;aspect-ratio:1214/1056;background:url(../images/hero-image1.webp) no-repeat center/cover;margin-left:auto;margin-bottom:3rem}@media screen and (min-width: 600px){#hero-image figure{position:absolute;top:0;right:0;z-index:-1;width:50%}}#point{position:relative}#point .wrapper ul{display:grid;gap:4rem}@media screen and (min-width: 600px){#point .wrapper ul{grid-template-columns:repeat(3, 1fr)}}#point .wrapper ul li{display:grid;grid-template-rows:subgrid;grid-row:span 2;gap:2rem}#point .wrapper ul li div{order:2}#point .wrapper ul li div h3{font-size:clamp(1.6rem,.95rem + 1.8vw,2.8rem);font-weight:bold;text-align:center;margin-bottom:1rem}#point .wrapper ul li div h3 span{display:inline-block}#point .wrapper ul li figure{order:1}#point .wrapper ul li figure img{aspect-ratio:4/3;object-fit:cover;border-radius:1rem}#point .bg{position:absolute;top:0;left:0;z-index:-1;translate:-20% 0;width:50%}#point .bg .image{width:80%}#works{position:relative}#works .wrapper .text{width:fit-content;margin:0 auto 5rem}#works .wrapper ul{display:grid;gap:clamp(4rem,.752rem + 9.02vw,10rem)}@media screen and (min-width: 600px){#works .wrapper ul{grid-template-columns:repeat(2, 1fr)}}#aircon #works .wrapper ul{margin-bottom:5rem}#works .wrapper ul li figure{display:grid;grid-template-columns:1fr auto 1fr;gap:clamp(1rem,.459rem + 1.5vw,2rem);align-items:center;margin-bottom:2rem}#works .wrapper ul li figure a{display:block}#works .wrapper ul li figure a img{aspect-ratio:1;object-fit:cover;border-radius:1rem}#works .wrapper ul li figure a img:first-of-type{grid-column:1/2}#works .wrapper ul li figure a img:last-of-type{grid-column:3/4}#works .wrapper ul li figure::after{content:"";display:grid;grid-column:2/3;grid-row:1/2;width:clamp(2rem,.376rem + 4.51vw,5rem);aspect-ratio:1;background:#ddd;clip-path:polygon(0 0, 100% 50%, 0 100%)}#works .wrapper ul li p{text-align:center}#works .bg{position:absolute;top:0;right:0;z-index:-1;translate:20% 0;width:40%}#flow{position:relative}#flow .wrapper ol{display:grid;gap:3rem}#flow .wrapper ol li:not(:last-of-type)::after{content:"";display:block;width:3rem;aspect-ratio:4/3;margin-inline:auto;background:#ccc;clip-path:polygon(0 0, 100% 0, 50% 100%)}#flow .wrapper ol li .inner{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:3rem 0;padding:4rem 4rem;background:#fff;border:1px solid #ccc;border-radius:1rem}@media screen and (min-width: 1025px){#flow .wrapper ol li .inner{grid-template-columns:15rem 5rem auto;gap:5rem}}#flow .wrapper ol li .inner .no{order:1;grid-column:1/2;grid-row:1/2;width:100%;text-align:center;text-transform:uppercase;border-right:1px solid #ccc}@media screen and (min-width: 1025px){#flow .wrapper ol li .inner .no{grid-column:auto;grid-row:auto;padding-inline:3rem}}#flow .wrapper ol li .inner .no span{display:block;font-size:3.2rem}#flow .wrapper ol li .inner div{order:3;grid-column:1/3;grid-row:2/3}@media screen and (min-width: 1025px){#flow .wrapper ol li .inner div{grid-column:auto;grid-row:auto}}#flow .wrapper ol li .inner div h3{color:#ff9f06;font-size:2rem;font-weight:bold;text-align:center;margin-bottom:1rem}@media screen and (min-width: 1025px){#flow .wrapper ol li .inner div h3{text-align:left}}#flow .wrapper ol li .inner div p{width:fit-content;margin-inline:auto}@media screen and (min-width: 1025px){#flow .wrapper ol li .inner div p{margin:0}}#flow .wrapper ol li .inner figure{order:2;grid-column:2/3;grid-row:1/2;width:100%;text-align:center}@media screen and (min-width: 1025px){#flow .wrapper ol li .inner figure{grid-column:auto;grid-row:auto}}#flow .wrapper ol li .inner figure img{width:5rem}#flow .bg1{position:absolute;top:0;left:0;z-index:-1;translate:-5% 5%;width:50%}#flow .bg2{position:absolute;top:0;right:0;z-index:-1;width:30%}#flow .bg3{position:absolute;bottom:0;right:0;z-index:-1;width:40%;translate:0 40%}#flow .bg3 .image{width:80%}#other .wrapper ul{display:flex;flex-wrap:wrap;justify-content:center;gap:2rem;margin-bottom:5rem}#other .wrapper ul li{padding:.5rem 1rem;color:#fff;background:#ff9f06;border-radius:1rem}#other .wrapper .text{width:fit-content;margin-inline:auto;margin-bottom:5rem}#about{position:relative}#about .wrapper .inner{display:flex;flex-direction:column-reverse}@media screen and (min-width: 1025px){#about .wrapper .inner{display:grid;grid-template-columns:auto 40rem}}#about .wrapper .inner table{background-image:linear-gradient(rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.7)),url(../images/logo.svg);background-repeat:no-repeat;background-position:center;background-size:100%,contain}#about .wrapper .inner table tbody{display:grid;gap:1em}#about .wrapper .inner table tr{display:grid;grid-template-columns:5em 1fr;gap:1em}#about .wrapper .inner table tr th{font-weight:bold}#about .wrapper .inner table tr td span{display:inline-block}#about .wrapper .bg{position:relative;width:50%;max-width:38rem;margin-inline:auto}@media screen and (min-width: 1025px){#about .wrapper .bg{width:80%}}#about .wrapper .bg .shadow{scale:1.1;top:8%}#contact{position:relative}#contact .wrapper{overflow-x:hidden}#contact .wrapper section{margin-bottom:5rem}#contact .wrapper section h3{margin-bottom:2rem;font-size:2rem;font-weight:bold;text-align:center}#contact .wrapper section.tel h3+p{margin-bottom:2rem;text-align:center}#contact .wrapper section.tel h3+p a{display:block;margin:0 auto;padding:1rem 3rem;width:fit-content;color:#fff;font-size:clamp(2rem,.912rem + 1.5vw,3rem);background:#ff9f06;border-radius:5rem}#contact .wrapper section.tel h3+p span{font-size:2rem}@media screen and (min-width: 600px){#contact .wrapper section.tel h3+p+p{text-align:center}}#contact .wrapper section.mail h3+p{margin-bottom:2rem}@media screen and (min-width: 600px){#contact .wrapper section.mail h3+p{text-align:center}}#contact .wrapper section.mail form table{width:100%}#contact .wrapper section.mail form table tr{display:grid;margin-bottom:2rem}@media screen and (min-width: 600px){#contact .wrapper section.mail form table tr{grid-template-columns:13em 1fr}}#contact .wrapper section.mail form table tr th{margin-bottom:.5rem}@media screen and (min-width: 600px){#contact .wrapper section.mail form table tr th{padding:1.1rem 0}}#contact .wrapper section.mail form table tr th .required{display:flex;align-items:center}@media screen and (min-width: 600px){#contact .wrapper section.mail form table tr th .required{justify-content:space-between}}#contact .wrapper section.mail form table tr th .required::after{content:"必須";display:inline-block;margin:0 1em;padding:.5rem;color:#fff;font-size:1.2rem;background:red}#contact .wrapper section.mail form input,#contact .wrapper section.mail form textarea{padding:1rem;width:100%;background-color:#fff;border:1px solid #333}#contact .wrapper section.mail form input::placeholder,#contact .wrapper section.mail form textarea::placeholder{color:#aaa}#contact .wrapper section.mail form input+p,#contact .wrapper section.mail form textarea+p{padding-top:.5rem;font-size:1.2rem}#contact .wrapper section.mail form textarea{min-height:20rem}#contact .wrapper section.mail form .privacypolicy{margin-bottom:5rem;padding:2rem;aspect-ratio:2/1;background:#fff;background-color:#ccc}@media screen and (min-width: 600px){#contact .wrapper section.mail form .privacypolicy{margin-left:13em}}#contact .wrapper section.mail form .privacypolicy h3{margin-bottom:2rem;font-size:2rem}#contact .wrapper section.mail form .privacypolicy div{margin-bottom:2rem;padding-right:1rem;width:100%;height:calc(100% - 5rem);overflow-y:scroll}#contact .wrapper section.mail form .privacypolicy div ul{display:grid;gap:2rem;margin-top:5rem}#contact .wrapper section.mail form .privacypolicy div ul li h4{margin-bottom:1rem;font-weight:bold}#contact .wrapper section.mail form .privacypolicy .check input[type=checkbox]{position:absolute;z-index:-1;width:1px;opacity:0}#contact .wrapper section.mail form .privacypolicy .check label{display:flex;align-items:center;width:fit-content;font-size:1.2rem;cursor:pointer}#contact .wrapper section.mail form .privacypolicy .check label::before{display:grid;place-items:center;content:"";margin-right:1rem;padding:0;width:1.6rem;aspect-ratio:1/1;line-height:1;border:1px solid #333}#contact .wrapper section.mail form .privacypolicy .check.checked label::before{content:"✓"}#contact .wrapper section.mail form .btn{text-align:center}@media screen and (min-width: 600px){#contact .wrapper section.mail form .btn{padding-left:13em;text-align:left}}#contact .wrapper section.mail form .btn button{padding:1rem 2rem;width:20rem;text-align:center;letter-spacing:1em;text-indent:1em;border:1px solid #333;background-color:#fff;transition:color .5s,background-color .5s;cursor:pointer}#contact .wrapper section.mail form .btn button[disabled]{color:#aaa;border:1px solid #aaa;cursor:not-allowed}@media(hover: hover){#contact .wrapper section.mail form .btn button[disabled]:hover{color:#aaa;background-color:#fff}}@media(hover: hover){#contact .wrapper section.mail form .btn button:hover{color:#fff;background-color:#333}}#contact .bg{position:absolute;top:0;left:0;z-index:-1;translate:-10% -5%;width:50%}#contact .bg .image{width:80%}footer{position:relative}footer::before,footer::after{content:"";display:block;width:100%;aspect-ratio:1920/79}footer::before{background:url(../images/footer_image1.svg) repeat-x left bottom/cover;animation:wave 15s linear infinite}footer::after{position:absolute;top:0;left:0;background:url(../images/footer_image2.svg) repeat-x left 20% bottom/cover;animation:wave 20s linear infinite}footer p{padding:2rem 0;color:#fff;font-size:1.2rem;text-align:center;background-color:#ff9f06}footer ul{position:fixed;top:50%;right:0;translate:0 -50%}footer ul li a{display:block;writing-mode:vertical-rl;padding-block:.5rem;padding-inline:1rem 5rem;clip-path:polygon(100% 0, 100% 100%, 0 80%, 0 0);color:#fff;background-color:#ff9f06;width:3.4rem}@keyframes wave{0%{background-position:left 0 bottom}100%{background-position:left -100% bottom}}