/* リモデラメジャー（/measure）専用。
   現行 LP（https://lp-measure.remodela.jp/ 、ソースは remodela-measure-lp/public/assets/css/style.css）の見た目を、
   サイト共通のヘッダー・フッター（shared.css）に影響しないよう .ms（<main>）の中だけに写したもの。
   - 現行の PC 用の切り替え幅 1320px は、ヘッダー（自前のメニュー）の都合だったので、本文は 1100px から PC の並びにする
   - 現行の「使い方」（PC）はスクロールで画面を固定して1枚ずつ見せる演出で、何も映らない画面が続くため、2段を並べて表示する
   - 現行の vh で決めていた「ずっと0円」バッジの位置・大きさは、画面の高さで崩れないよう px / vw に置き換えた */

/* ---- 土台（現行の reset と body の指定。.ms の中だけ） ---- */
.ms{display:block;overflow-x:hidden;overflow-x:clip;font-family:"Roboto","Noto Sans JP","ヒラギノ角ゴ ProN W3",Meiryo,sans-serif;font-size:16px;font-weight:400;line-height:1.8;color:#1f1f1f;letter-spacing:.05em;font-feature-settings:"palt"}
.ms *{box-sizing:border-box;padding:0;margin:0;font-size:100%;border:0}
.ms :is(h1,h2,h3,p){font-weight:inherit;line-height:inherit;letter-spacing:inherit;text-wrap:wrap;font-feature-settings:inherit}
.ms :is(h1,h2){font-weight:700}
.ms :is(img,picture,video,svg){display:inline;width:100%;max-width:none;vertical-align:bottom}
.ms :is(input,button,textarea,select){font:inherit;color:inherit}
.ms a{color:inherit}
.ms a[class]{text-decoration:none}
.ms ul[class]{list-style:none}
.ms :where(input[type=text],textarea,button){display:block;width:100%;border-radius:0;outline:none;background:none}
.ms textarea{resize:vertical}
.ms button{cursor:pointer}
.ms :is(a,button,input,textarea):focus-visible{outline:3px solid #e6a400;outline-offset:3px}


/* ---- 共通部品 ---- */
.ms .c-inner01{width:min(100%,1320px);padding-right:20px;padding-left:20px;margin:0 auto}
.ms .c-head01{margin-bottom:30px;font-size:calc(25 / 16 * 1rem);text-align:center}
@media (min-width:768px){.ms .c-head01{margin-bottom:40px;font-size:calc(50 / 16 * 1rem)}}

/* 画面に入ったら下からフェード（現行の js-fade-in。JS が動かないときはそのまま表示） */
.js .ms .js-fade-in{opacity:0;translate:0 50px;transition:opacity .5s ease-out,translate .5s ease-out}
.js .ms .js-fade-in.is-in{opacity:1;translate:0 0}

/* ---- ファーストビュー ---- */
.ms .p-home-title{position:relative;width:100%}
.ms .p-home-title-circle{position:absolute;top:-270px;left:-23vw;width:736px;max-width:736px;pointer-events:none}
@media (max-width:767px){.ms .p-home-title-circle{top:-219px;left:-53vw;width:100%}}
.ms .p-home-title-content{position:relative;max-width:min(100%,1300px);padding:60px 20px}
@media (min-width:1100px){.ms .p-home-title-content{display:flex;align-items:center;justify-content:space-between;margin:0 auto}}
.ms .p-home-title-content__title{position:relative}
.ms .p-home-title-content__img{position:absolute;z-index:1;top:-42px;left:336px;width:138px;height:auto;rotate:0deg}
@media (min-width:1100px){.ms .p-home-title-content__img{top:-54px;left:348px;width:162px}}
@media (max-width:767px){.ms .p-home-title-content__img{top:calc(33px - 12vw);left:min(68%,calc(100% - 24vw));width:24vw}}
.ms .p-home-title-content__text{position:relative;font-size:50px;font-weight:700;line-height:160%}
.ms .p-home-title-content__text--large{font-size:90px}
.ms .p-home-title-content__text--medium{font-size:62px}
.ms .p-home-title-content__text__description{font-size:calc(20 / 16 * 1rem);font-weight:700}
.ms .p-home-title__app{width:200px;margin-top:5%;margin-bottom:7%}
.ms .p-home-title__app a{display:block}
@media (min-width:1100px){.ms .p-home-title-content__title{width:56%}}
@media (max-width:767px){
  .ms .p-home-title-content__title{width:100%}
  .ms .p-home-title-content__text{font-size:9vw}
  .ms .p-home-title-content__text--large{font-size:16vw}
  .ms .p-home-title-content__text--medium{font-size:11vw}
  .ms .p-home-title-content__text__description{font-size:calc(14 / 16 * 1rem);line-height:130%}
  .ms .p-home-title__app{margin-top:20px;margin-bottom:25px}
}
.ms .p-home-title__videoGroup{position:relative;width:44%;margin:0 auto}
.ms .p-home-title__videoGradation{position:absolute;top:0;left:-26vw;width:711px;min-width:500px;pointer-events:none}
@media (min-width:1100px){.ms .p-home-title__videoGradation{left:-15%}}
.ms .p-home-title__video{position:relative;max-width:258px;min-height:505px;margin:0 auto}
.ms .p-home-title__videoWrap{position:absolute;top:8px;left:15px;z-index:3;width:225px;bottom:0;overflow:hidden;border-radius:30px}
.ms .p-home-title__frame{position:absolute;top:0;left:0;z-index:4;width:254px;overflow:hidden;border-radius:30px}
.ms .p-home-title__frameShadow{position:absolute;top:0;left:-5%;z-index:2;width:265px;overflow:hidden;border-radius:30px}
@media (max-width:767px){
  .ms .p-home-title__videoGroup{width:100%}
  .ms .p-home-title__videoGradation{left:-40vw}
}

/* ---- こんなことでお困りではないですか？ ---- */
.ms .p-home-merit{position:relative;width:100%;text-align:center;background-color:#f1fbf2}
.ms .p-home-merit::after{position:absolute;top:100%;right:0;left:0;height:10vw;content:"";background:#f1fbf2;clip-path:polygon(0 0,100% 0,50% 100%)}
.ms .p-home-merit__content{max-width:1000px;padding:0 20px;margin:0 auto}
.ms .p-home-merit__title{padding:108px 20px 64px;font-size:calc(50 / 16 * 1rem);font-weight:700}
.ms .p-home-merit__dot-text{padding-top:.4em;font-size:calc(62 / 16 * 1rem);color:#085f2a;-webkit-text-emphasis:dot #085f2a;text-emphasis:dot #085f2a}
@media (max-width:767px){
  .ms .p-home-merit__title{padding:55px 0 64px;font-size:calc(24 / 16 * 1rem)}
  .ms .p-home-merit__dot-text{font-size:calc(40 / 16 * 1rem)}
}
@media (min-width:1100px){.ms .p-home-merit__meritGroup{display:flex;align-items:center;justify-content:space-between}}
.ms .p-home-merit__imgGroup{display:flex;align-items:flex-start;justify-content:center}
.ms .p-home-merit__imgGroup:first-child{margin-bottom:54px}
@media (min-width:1100px){.ms .p-home-merit__imgGroup:first-child{margin-bottom:0}}
@media (max-width:767px){.ms .p-home-merit__imgGroup:first-child{margin-bottom:70px}}
.ms .p-home-merit__img{width:153px}
@media (max-width:767px){.ms .p-home-merit__img{width:119px}}
.ms .p-home-merit__name{position:relative;top:-12px;left:5px;z-index:5;padding:0 26px;font-size:20px;font-weight:700;white-space:nowrap;background-color:#fff;border:3px solid #1f1f1f;border-radius:6px}
@media (max-width:767px){.ms .p-home-merit__name{padding:0;font-size:16px}}
.ms .p-home-merit__textGroup{position:relative;width:280px;min-height:209px;padding:40px 0 32px;background-color:#fff;border-radius:20px;box-shadow:4px 4px 12px rgba(85,85,85,.15)}
@media (max-width:767px){.ms .p-home-merit__textGroup{flex:1;min-width:0}}
.ms .p-home-merit__dq{position:absolute;top:-8%;left:10%;width:40px}
.ms .p-home-merit__text{margin-bottom:30px;font-size:calc(26 / 16 * 1rem);font-weight:700;line-height:130%}
@media (max-width:767px){.ms .p-home-merit__text{font-size:calc(20 / 16 * 1rem)}}
.ms .p-home-merit__drawing{width:85px}
.ms .p-home-merit__measure{width:92px}
.ms .p-home-merit__blowing{position:absolute;right:0;left:0;z-index:5;max-width:1000px;padding:32px 64px;margin:40px auto 0;color:#fff;background-color:#009862;border-radius:106px}
@media (max-width:1039px) and (min-width:768px){.ms .p-home-merit__blowing{margin:40px 20px 0}}
@media (max-width:767px){.ms .p-home-merit__blowing{padding:32px 17px;margin:50px 20px 0;border-radius:30px}}
.ms .p-home-merit__blowing::before{position:absolute;bottom:-24px;left:50%;z-index:2;margin-left:-15px;content:"";border:12px solid transparent;border-top:12px solid #009862}
.ms .p-home-merit__blowingText{font-size:32px;font-weight:700}
.ms .p-home-merit__blowingText--large{font-size:56px;line-height:120%}
.ms .p-home-merit__blowingText--medium{font-size:40px}
@media (max-width:767px){
  .ms .p-home-merit__blowingText{font-size:calc(18 / 16 * 1rem);line-height:180%}
  .ms .p-home-merit__blowingText--large,.ms .p-home-merit__blowingText--medium{font-size:calc(24 / 16 * 1rem)}
}
.ms .p-home-merit__blowing-note{margin-top:5px;font-size:calc(14 / 16 * 1rem);color:#ffe30d}
.ms .p-home-merit__blowing-note button{display:inline-block;width:auto;color:#ffe30d;letter-spacing:inherit}
.ms .p-home-merit__blowing-hatena{position:relative;top:5px;display:inline-block;width:20px;height:20px;margin-left:10px;background:url(img/ico-hatena.svg) no-repeat center/contain}
.ms .p-home-blank{min-height:400px}
@media (max-width:767px){.ms .p-home-blank{min-height:300px}}

/* ---- 対応機種（ポップアップ） ---- */
.ms .js-modal-trigger{cursor:pointer}
.ms .p-home-modal{position:fixed;top:0;left:0;z-index:1000;display:grid;width:100%;height:100%;padding:10px;place-content:center;transition:opacity .25s ease-in-out,visibility .25s ease-in-out}
.ms .p-home-modal[aria-hidden=true]{pointer-events:none;visibility:hidden;opacity:0}
.ms .p-home-modal-bg{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(31,31,31,.85)}
.ms .p-home-modal-box{position:relative;top:5%;z-index:1;width:calc(100vw - 20px);max-width:100%;height:72vh;padding:10vw;overflow-y:auto;background:#fff;border-radius:5px;scrollbar-width:none}
.ms .p-home-modal-box::-webkit-scrollbar{display:none}
.ms .p-home-modal-close{position:absolute;top:20px;right:20px;width:20px;height:20px;background:transparent}
.ms .p-home-modal-close::before,.ms .p-home-modal-close::after{position:absolute;top:50%;left:50%;width:20px;height:2px;content:"";background:#9a9a9a;translate:-50% -50%}
.ms .p-home-modal-close::before{rotate:45deg}
.ms .p-home-modal-close::after{rotate:-45deg}
.ms .p-home-modal-head{margin-bottom:25px;font-weight:700}
.ms .p-home-modal-body{display:flex;flex-direction:column;gap:20px}
.ms .p-home-modal-body-in{width:100%}
.ms .p-home-modal-body-in-ttl{margin-bottom:5px;font-size:16px;font-weight:700}
.ms .p-home-modal-body-in-item{position:relative;padding-left:1em}
.ms .p-home-modal-body-in-item::before{position:absolute;top:11px;left:0;width:4px;height:4px;content:"";background-color:#085f2a;border-radius:50%}
@media (min-width:768px){
  .ms .p-home-modal-box{width:min(45vw,850px);min-width:600px;padding:60px 13%}
  .ms .p-home-modal-close{top:60px;right:13%}
  .ms .p-home-modal-close::before,.ms .p-home-modal-close::after{width:30px}
  .ms .p-home-modal-head{margin-bottom:35px}
  .ms .p-home-modal-body-in-ttl{margin-bottom:10px}
  .ms .p-home-modal-body-in-item:nth-child(n+2){margin-top:2px}
  .ms .p-home-modal-body-in-item::before{top:10px;width:5px;height:5px}
}
@media (min-width:1100px){
  .ms .p-home-modal-box{padding:60px 110px}
  .ms .p-home-modal-close{right:60px}
  .ms .p-home-modal-body{flex-direction:row;gap:20px}
  .ms .p-home-modal-body-in{width:calc(50% - 10px)}
}

/* ---- 数秒で採寸図面／3D画面（スマホ・タブレット） ---- */
.ms .p-home-use__cont-step{position:relative;z-index:1;padding:60px 20px 30px;margin:0 -20px;overflow:hidden;background:linear-gradient(to bottom,#dfefc7 200px,#009862 200px)}
.ms .p-home-use__cont-step:nth-child(n+2){margin-top:10px}
.ms .p-home-use__cont-step.-step2::before{position:absolute;top:50%;left:50%;width:100%;height:100%;pointer-events:none;content:"";background:url(img/bg-step02.svg) no-repeat center bottom/100% auto;translate:-50% -50%}
.ms .p-home-use__cont-step-areaTxt{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;width:280px;height:280px;padding-bottom:15px;margin:0 auto -30px;text-align:center;background:#fff;border-radius:50%}
.ms .p-home-use__cont-step .p-home-use__cont-ico{width:54.5px}
.ms .p-home-use__cont-step .p-home-use__cont-copy{display:inline-block;padding:2px 10px;font-size:calc(20 / 16 * 1rem);font-weight:700;color:#fff;background:#009862}
.ms .p-home-use__cont-step .p-home-use__cont-ttl{margin-top:5px;font-size:calc(32 / 16 * 1rem);font-weight:700;line-height:1.5;color:#085f2a}
.ms .p-home-use__cont-img{position:relative;z-index:2;width:min(100%,275px);margin:0 auto;overflow:hidden}

/* ---- 数秒で採寸図面／3D画面（PC）
   現行は1段ずつ画面に固定して、固定中だけ表示する演出。ここでは2段を並べ、画面に入ったら現行と同じフェードで出す ---- */
@media (min-width:1100px){
  .ms .p-home-use{padding:0;overflow:hidden;background:linear-gradient(to right,#dfefc7 50%,#009862 50%)}
  .ms .p-home-use__step{position:relative;display:flex;gap:0 clamp(100px,calc(100vw - 1180px),260px);align-items:center;justify-content:center;min-height:900px;padding:40px 0}
  .ms .p-home-use__step::before{position:absolute;top:0;bottom:0;left:50%;width:100%;content:"";background:url(img/bg-step02-pc.svg) no-repeat left top/auto 585px;pointer-events:none}
  .ms .p-home-use__step-balloon{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;width:calc(53% - 130px);max-width:520px;height:527px;margin-bottom:40px;text-align:center;background:#fff;border-radius:50%}
  .ms .p-home-use__step-balloon::before{position:absolute;top:50%;right:-40px;width:58px;height:67px;clip-path:polygon(0 0,100% 50%,0 100%);content:"";background:#fff;translate:0 -50%}
  .ms .p-home-use__step-balloon .p-home-use__cont-ico{width:114px;margin-bottom:15px}
  .ms .p-home-use__step-balloon .p-home-use__cont-copy{display:inline-block;padding:2px 10px;font-size:calc(32 / 16 * 1rem);font-weight:700;color:#fff;background:#009862}
  .ms .p-home-use__step-balloon .p-home-use__cont-ttl{margin-top:5px;font-size:calc(62 / 16 * 1rem);font-weight:700;line-height:1.5;color:#085f2a}
  .ms .p-home-use__areaimg{position:relative;width:calc(50% - 130px)}
  .ms .p-home-use__mobile{width:min(20vw,282px)}
  .js .ms .js-scroll-step .js-scroll-step__balloon,.js .ms .js-scroll-step .js-scroll-step__img{opacity:0;scale:.98;transition:opacity .25s ease-in-out,scale .25s ease-in-out}
  .js .ms .js-scroll-step.is-active .js-scroll-step__balloon,.js .ms .js-scroll-step.is-active .js-scroll-step__img{opacity:1;scale:1}
}

/* ---- よくあるご質問 ---- */
.ms .p-home-faq{padding:55px 0 40px}
@media (min-width:768px){
  .ms .p-home-faq{padding:100px 0}
  .ms .p-home-faq__archive{width:min(100%,1070px);margin:0 auto}
}
.ms .c-toggle01{overflow:hidden;border:2px solid #dbdbdb;border-radius:10px}
.ms .c-toggle01+.c-toggle01{margin-top:10px}
.ms .c-toggle01__trigger{position:relative;display:flex;flex-wrap:nowrap;gap:15px;width:100%;padding:20px 60px 20px 20px;text-align:left;letter-spacing:inherit;cursor:pointer;background:#f8f8f8}
.ms .c-toggle01__trigger::before,.ms .c-toggle01__trigger::after{position:absolute;top:50%;right:20px;width:23px;height:2px;content:"";background:#085f2a;translate:0 -50%}
.ms .c-toggle01__trigger::before{rotate:90deg;transition:rotate .25s ease-in-out}
.ms .c-toggle01__trigger[aria-expanded=true]::before{rotate:0deg}
.ms .c-toggle01__trigger-ico{display:block;flex:none;width:20px;font-family:"Oswald",sans-serif;font-size:25px;font-weight:500;line-height:1.1;color:#009862}
.ms .c-toggle01__trigger-txt{display:block;flex:1;min-width:0;padding-top:3px;font-size:16px;font-weight:700;line-height:1.8;color:#085f2a}
.ms .c-toggle01__content{overflow:hidden;transition:height .4s cubic-bezier(.16,1,.3,1)}
.js .ms .c-toggle01__content:not(.is-open){height:0;visibility:hidden}
.ms .c-toggle01__content-in{display:flex;gap:15px;padding:20px;border-top:1px solid #dbdbdb}
.ms .c-toggle01__content-ico{flex:none;width:20px;font-family:"Oswald",sans-serif;font-size:25px;font-weight:500;line-height:1.1;color:#9a9a9a}
.ms .c-toggle01__content-areaTxt{flex:1;min-width:0}
.ms button.p-home-faq__link{display:inline;width:auto;color:#009862;letter-spacing:inherit;text-decoration:underline}
.ms .p-home-faq__link:hover{text-decoration:none}
@media (min-width:768px){
  .ms .c-toggle01{border-radius:15px}
  .ms .c-toggle01+.c-toggle01{margin-top:15px}
  .ms .c-toggle01__trigger{gap:20px;padding:25px 75px 25px 35px}
  .ms .c-toggle01__trigger::before,.ms .c-toggle01__trigger::after{right:40px}
  .ms .c-toggle01__trigger-ico{width:25px;font-size:30px}
  .ms .c-toggle01__trigger-txt{padding-top:5px;font-size:18px}
  .ms .c-toggle01__content-in{gap:20px;padding:25px 35px}
  .ms .c-toggle01__content-ico{width:25px;font-size:30px}
}

/* ---- 今すぐはじめよう ---- */
.ms .p-home-app{padding-top:100px}
.ms .p-home-app__background{position:relative;padding:265px 20px 80px;background:url(img/bg-cv-sp.jpg) no-repeat center/cover}
.ms .p-home-app__img{position:absolute;top:-50px;left:50%;width:286px;translate:-50% 0}
.ms .p-home-app__img.js-fade-in:not(.is-in){translate:-50% 50px}
.ms .p-home-app__head{font-size:calc(25 / 16 * 1rem);font-weight:700;text-align:center}
.ms .p-home-app__list{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:30px}
.ms .p-home-app__item-logo a{display:block}
.ms .p-home-app__item-logo img{width:auto;height:50px}
@media (min-width:768px){
  .ms .p-home-app__background{display:flex;flex-wrap:wrap;gap:6.7%;justify-content:center;padding:0;margin-top:70px;background-color:#f1fbf2;background-image:url(img/bg-cv-pc.jpg);background-size:cover}
  .ms .p-home-app__img{position:relative;top:-70px;left:auto;order:2;width:30.7%;translate:0}
  .ms .p-home-app__img.js-fade-in:not(.is-in){translate:0 50px}
  .ms .p-home-app__areaTxt{order:1;padding:100px 0}
  .ms .p-home-app__head{font-size:calc(51 / 16 * 1rem)}
  .ms .p-home-app__list{gap:40px;margin-top:50px}
  .ms .p-home-app__item-logo img{height:75px}
  .ms .p-home-app__item-qr{width:100px;margin:30px auto 0}
  .ms .p-home-app__item-txt{margin-top:20px;font-size:1rem;font-weight:700;text-align:center}
}

/* ---- 追従のダウンロード案内（現行と同じ。1画面分スクロールしたら出す） ---- */
.ms .js-fix-cv{pointer-events:none;visibility:hidden;opacity:0;transition:opacity .25s ease-in-out,visibility .25s ease-in-out}
.ms .js-fix-cv.is-active{pointer-events:auto;visibility:visible;opacity:1}
.ms .c-cv{position:fixed;right:0;bottom:0;left:0;z-index:45;display:grid;height:60px;background:#ffe30d;place-content:center;letter-spacing:.05em}
.ms .c-cv__app{display:flex;flex-wrap:wrap;align-items:center;justify-content:center}
.ms .c-cv__app-item a{display:block}
.ms .c-cv__app-item img{width:auto;height:40px}
/* スマホ・タブレットの下の帯がフッターの最下部（コピーライト）に重ならないよう、フッターの下に帯の高さ分の余白（フッターと同じ色） */
@media (max-width:1099px){.ms+.global-footer{border-bottom:60px solid #001a2b}}
@media (min-width:1100px){
  .ms .c-cv{top:50%;right:0;bottom:auto;left:auto;z-index:45;width:147px;height:134px;text-align:center;cursor:pointer;border-radius:5px 0 0 5px;translate:0 -50%;transition:opacity .25s ease-in-out,visibility .25s ease-in-out,width .25s ease-in-out}
  .ms .c-cv__txt{display:flex;flex-direction:column;align-items:center;font-weight:700;line-height:1.5}
  .ms .c-cv__txt-main{font-size:calc(15 / 16 * 1rem);line-height:1.5}
  .ms .c-cv__txt-small{display:inline-block;padding:2px 10px;margin-bottom:4px;font-size:calc(12 / 16 * 1rem);background:#fff;border-radius:3px}
  .ms .c-cv__ico{width:30px;margin:10px auto 0}
  .ms .c-cv__app{width:1px;height:1px;overflow:hidden;opacity:0;transition:opacity .25s ease-in-out}
  .ms .c-cv:is(:hover,:focus-within){width:300px;height:auto;padding:20px 25px}
  .ms .c-cv:is(:hover,:focus-within) .c-cv__txt br,.ms .c-cv:is(:hover,:focus-within) .c-cv__ico{display:none}
  .ms .c-cv:is(:hover,:focus-within) .c-cv__app{gap:10px;width:auto;height:auto;margin-top:10px;overflow:visible;opacity:1}
}
@media (prefers-reduced-motion:reduce){
  .js .ms .js-fade-in,.js .ms .js-scroll-step .js-scroll-step__balloon,.js .ms .js-scroll-step .js-scroll-step__img{opacity:1!important;translate:none!important;scale:1!important;transition:none!important}
  .ms .c-toggle01__content{transition:none}
}

/* ---- 表示の切り替え（現行の u-view-*。PC は 1100px から）。各部品の display より後に置く ---- */
@media (max-width:1099px){.ms .u-view-large{display:none}}
@media (min-width:1100px){.ms .u-view-under-medium{display:none}}