/*
Theme Name: 東京ECO住まいの窓口
Theme URI: http://www.www.www/
Description: This is my original theme.
*/


/*-----------------
-------------------
幅    background-image: url(img/sp-speed-suso.png);
-------------------
-----------------*/
* {
    box-sizing: border-box;
}

body{
    margin: 0 auto;
    font-family:'メイリオ', 'Meiryo','ＭＳ ゴシック','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3',sans-serif;
    color: #333;
    font-size: 16px;
}
button{
    cursor: pointer;
}

ul {
    display: block;
    list-style-type: none;
    margin-block-start: 0em;
    margin-block-end: 0em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 0px;
}

p {
    display: block;
    margin-block-start: 0em;
    margin-block-end: 0em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
}

li{
    list-style: none;
}
.wrap {
    max-width: 1200px;
    width: 100%;
    margin: 0 auto;
}
.wrap-content{
    padding: 0 1em;
}
.w100{
    width: 100%;
}
.mw100{
    width: 100%;
    max-width: none;
}


/*-----------------
-------------------
画像・リンク・表示非表示
-------------------
-----------------*/
img{
    max-width: 100%;
}
a{
    text-decoration: none;

}

a:link, a:visited, a:hover, a:active {
  color: #222222;
}

a,button{
    transition: 0.3s;
}
a:hover, button:hover{
    opacity: 0.5 ;

    @media only screen and (max-width: 1023px) {
        opacity: 1;
    }
}

a.sp-btn:hover{
    opacity: 1;
}

.dn{
    display: none!important;
}

.pc-dn{
  display:none!important;
  }
.sp-dn{
  display:block!important;
  }

/*-----------------
-------------------
マージン・パディング
-------------------
-----------------*/
.mt0{margin-top: 0;}
.mt1{margin-top: 1em;}
.mt2{margin-top: 2em;}
.mt3{margin-top: 3em;}
.mt4{margin-top: 4em;}
.mt5{margin-top: 5em;}
.mt6{margin-top: 6em;}
.mt7{margin-top: 7em;}
.mt8{margin-top: 8em;}
.mt9{margin-top: 9em;}
.mt10{margin-top: 10em;}

.mb0{margin-bottom: 0;}
.mb1{margin-bottom: 1em;}
.mb2{margin-bottom: 2em;}
.mb3{margin-bottom: 3em;}
.mb4{margin-bottom: 4em;}
.mb5{margin-bottom: 5em;}
.mb6{margin-bottom: 6em;}
.mb7{margin-bottom: 7em;}
.mb8{margin-bottom: 8em;}
.mb9{margin-bottom: 9em;}
.mb10{margin-bottom: 10em;}

.pt0{padding-top: 0;}
.pt1{padding-top: 1em;}
.pt2{padding-top: 2em;}
.pt3{padding-top: 3em;}
.pt4{padding-top: 4em;}
.pt5{padding-top: 5em;}
.pt6{padding-top: 6em;}
.pt7{padding-top: 7em;}
.pt8{padding-top: 8em;}
.pt9{padding-top: 9em;}
.pt10{padding-top: 10em;}

.pb0{padding-bottom: 0;}
.pb1{padding-bottom: 1em;}
.pb2{padding-bottom: 2em;}
.pb3{padding-bottom: 3em;}
.pb4{padding-bottom: 4em;}
.pb5{padding-bottom: 5em;}
.pb6{padding-bottom: 6em;}
.pb7{padding-bottom: 7em;}
.pb8{padding-bottom: 8em;}
.pb9{padding-bottom: 9em;}
.pb10{padding-bottom: 10em;}

.p1{padding: 1em!important;}
.p2{padding: 2em;}
.p3{padding: 3em;}
.p4{padding: 4em;}
.p5{padding: 5em;}

.prl{
    padding: 0 1em;
    text-align: center;
}

/*-----------------
-------------------
文字寄せ
-------------------
-------------------*/
.tac{
text-align: center;
}
.tal{
    text-align: left;
}
.tar{
    text-align: right;
}
.dib{
    display: inline-block;
}

.black{
    color: #000;
}
.small{
    font-size: 80%;
}
/*-----------------
-------------------
文字色
-------------------
-------------------*/
/* .black{
    color: #222;
}
.white{
    color: #fff;
}

.green{
    color: #008A3F!important;
}
.red{
    color: #BC2800;
} */
/*-----------------
-------------------
コンタクトフォーム
-------------------
-------------------*/


.form * {
box-sizing: border-box;
    margin: 0.3em 0.5em;
    align-items:center;
}
.form h3{
font-size: 1.5rem!important;
    font-weight: bold;
    border-bottom: solid 1px #000;
    margin: 2rem 0;
    letter-spacing: 1.5px;
}
input[type="button" i] {
    background: #0095a1;
    border: none;
    padding: 1em 2em;
    color: #fff;
    border-radius: 5px;
    margin: 1em 0;
}
form {
    display: inline-block;
    width: 100%;
    font-size: 18px;
}
.form__item {
  	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
  margin-bottom: 32px;
    padding: 1em 0px;
    border-bottom: 1px solid #000;
}
.bt{
     border-top: 1px solid #000;
}
.form__term {
  width: 30%;
}

.form__term:not(.is-required) {
  margin-top: 4px;
}

.form__desc {
  width: 70%;
          text-align: left;
}

.form__desc input:not([type=date]),.form__desc textarea {
  width: 100%;
}
input[type="radio" i] {
    display: inline-block;
    width: auto!important;
}
.form__term.is-required {
        text-align: left;
  display: -ms-flexbox;
  align-items: center;
  -ms-flex-align: center;
    border-radius: 5px;
        font-weight: bold;
}
.screen-reader-response{
    display: none;
}
.wpcf7-not-valid-tip{
    color: red;
}

.wpcf7-list-item input[type="checkbox"],
.wpcf7-list-item input[type="radio"]{
    transform: scale(1.4);
}


/* fixed-form */
.fixed-form-box .box-1 p,
.fixed-form-box .box-2 p {
  text-align: left;
  width: 90%;
  font-size: 22px;
  padding: 0;
}

.fixed-form-box .box-2 input{
display: block;

}

.fixed-form-box .box-2 li:last-child{
  display: flex;
  position: relative;
  top: -5px;
  font-size: 16px;
}
.fixed-form-box .box-2 li label{
  margin-left: 10px;
}

.fixed-form-box .box-2 input[type="text"] {
  margin-bottom: 10px;
  width: 90%;
  padding: 11px;
  font-size: 16px;
  border-radius: 3px;
  border: 2px solid #ddd;
}




/************************************
** pc-footer-custom-button
************************************/

#pc-footer-custom-button {
    display: block;
    width: 100%;
    background: rgb(0 0 0 / 70%);
    position: fixed;
    bottom: 0;
    z-index: 999;
    padding: 15px 0;
    margin-bottom: 0;
	zoom:80%;
	opacity:0;
	transition:1.0s;
	/* 追加 */
	text-align: center;
	box-sizing: border-box;
	overflow-wrap: break-word;
	font-weight: 400;
	font-size: 18px;
	color: #484848;
	line-height: 1.8;
	
}

    /* @media only screen and (max-width: 750px) {
        #pc-footer-custom-button {
            display: none;
        }
    } */

#mobile-footer-custom-button{
        display: none;
    }
        @media only screen and (max-width: 750px) {
#mobile-footer-custom-button{
        display: block;
    }
    }

#pc-footer-custom-button .fixed-form-box {
    margin: 0 auto;
    /* padding: 10px 10px; */
    height: auto;
    background: #fff;
    box-shadow: none;
    /* display: flex; */
    align-items: center;
	/* 追加 */
	box-sizing: border-box;
	overflow-wrap: break-word;
}



.fixed-form-box form {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}

.flexbox{
  display: flex;
}

    @media only screen and (max-width: 750px) {
.flexbox._cf_step2{
flex-direction: column;
}
    }

.fixed-form-box form .box-1 {
    width: 33%;
	/* 追加 */
 	padding: 0;
	margin: 0;
	box-sizing: border-box;
}

.fixed-form-box form .box-2 {
    width: 26%;
	/* 追加 */
	padding: 0;
	margin: 0;
	box-sizing: border-box;
}


.fixed-form-box .box-1 p, 
.fixed-form-box .box-2 p{
    font-size: 20px;
    font-weight: 700;

	/* 追加 */
	margin: 5px;
}

    @media only screen and (max-width: 750px) {
.fixed-form-box .box-1 p, 
.fixed-form-box .box-2 p{
  text-align: left;
    font-size: 15px;
    font-weight: 700;
}
    }


.fixed-form-box form .box-btn {
    /* width: 33%; */
    display: flex;
}

    @media only screen and (max-width: 750px) {
      .fixed-form-box form .box-btn {
flex-direction:column;
padding: 10px;
}

    }

.fixed-form-box form .box-btn button,
.fixed-form-box form .box-btn a{
  /* display: flex;
  justify-content: space-between;
  align-items: center; */
  margin: 0 auto;
  padding: 15px 20px;
  width: 340px;
  background-color: #fff;
  color: #fff;
  font-size: 20px;
  font-weight: 700;
  border:none;
  position: relative;
  letter-spacing: .07em;
}
.fixed-form-box form .box-btn button.btn01{
background: linear-gradient(#f4c043 0%, #f4bc43 16.06%, #f4b83f 34.92%, #f3b13e 52.06%, #f1ab3d 69.47%, #f2a13a 86.78%, #f19f3a 100%);
  border-radius: 31px;
  margin-left: 20px;

}
/* .fixed-form-box form .box-btn button.btn02{
background: linear-gradient(#9fce63 0%, #89c861 16.06%, #73c05f 34.92%, #5eb85d 52.06%, #52b05b 69.47%, #4fad5b 86.78%, #4fad5b 100%);
margin-left: 20px;
} */
.fixed-form-box form .box-btn a.btn02{
background: linear-gradient(#9fce63 0%, #89c861 16.06%, #73c05f 34.92%, #5eb85d 52.06%, #52b05b 69.47%, #4fad5b 86.78%, #4fad5b 100%);
margin-left: 20px;
}

.fixed-form-box form .box-btn a.btn03{
    border-radius: 4.773px;
    border: 3.978px solid #FFF;
    background: linear-gradient(180deg, var(--sub, #F0C24C) 0%, var(--main, #F0882D) 21.15%, var(--main, #F0882D) 85.58%, var(--sub, #F0C24C) 100%);
    box-shadow: 0px 0px 3.182px 0px rgba(0, 0, 0, 0.10);
}

.fixed-form-box form .box-btn button.btn04{
    border-radius: 4.773px;
    border: 3.978px solid #FFF;
    background: linear-gradient(180deg, #A9DE8F 0%, #6FC843 21.15%, #6FC843 85.58%, #A9DE8F 100%);
    box-shadow: 0px 0px 3.182px 0px rgba(0, 0, 0, 0.10);
}

    @media only screen and (max-width: 750px) {
.fixed-form-box form .box-btn a.btn02{
margin-top: 10px;

}

    }

.fixed-form-box form .box-btn button::after,
.fixed-form-box form .box-btn a.btn02::after{
  content: '';
  width: 7px;
  height: 7px;
  border-top: 3px solid #fff;
  border-right: 3px solid #fff;
  position: absolute;
  top: 50%;
  right: 25px;
  transform: translate(0,-50%) rotate(45deg);
}

.fixed-form-box form .box-btn button:hover{
    
}

/*** 追加 ***/

.fixed-form-wrap {
	margin: 0 auto;
	max-width: 1280px;
    padding: 0 10px;
}

    @media screen and (max-width:1300px) {

    }

@media screen and (max-width: 1024px){
	.fixed-form-wrap {
	    width: auto;
	}
}

/*.form__term.is-required::before {
  content: "必須";
  color: #fff;
  background-color: #ed5f58;
  font-size: 1rem;
  font-weight: 400;
  width: 30px;
  height: 18px;
  line-height: 1.6;
  margin-right: 8px;
  text-align: center;
  padding: 2px 3px
}
*/
.form__desc input[type=email], .form__desc input[type=tel], .form__desc input[type=text], .form__desc select, .form__desc textarea {
padding: 15px 8px;
    background: #ecececec;
    border: none;
    border-radius: 3px;
}

.form__desc input[type=date] {
  padding: 4px 8px;
}

.form__btn-wrapper {
  text-align: center;
  margin-bottom: 60px;
}

.form__btn {
padding: 0.5rem 5rem;
    border-radius: 28px;
    background-color: #4c3b31;
    color: #fff;
    font-size: 1.6rem;
    letter-spacing: .2rem;
    cursor: pointer;
    transition: .3s ease;
    -webkit-appearance: none;
    border: none;
}
.wrap-contact{
	padding: 2em 5em;
    background: #fff;
}


/* --------------------------
カスタムプロパティ
-------------------------- */
:root {
     /* color */
    --color-solor-lightest: #fff;
    --color-solor-darkest: #333;
    --color-solor-orange: #F0882D;
    --color-solor-green: #1D8B45;
    --color-solor-green02: #00B04C;
    --color-solor-brown: #734822;
    --color-solor-marker: #FFE08A;
    --color-solor-light-orange: #FFFBEC;
    --color-solor-light-green: #F5FFF2;

    /* font */
    --font-meiryo: 'メイリオ', 'Meiryo','ＭＳ ゴシック','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3',sans-serif;

    /* width */
    --width-content: min(calc(1280 / 1512 * 100vw), 1280px);
    @media only screen and (max-width: 750px) {
       --width-content: 100%;
    }

    /* margin */
    --margin-center: 0 auto;

    /* padding */
    --padding-main:  min(calc(110 / 750 * 100vw), 110px) min(calc(40 / 750 * 100vw), 40px) min(calc(40 / 750 * 100vw), 40px);
}

/* ---------------------------------------
common
--------------------------------------- */
html {
  font-size: 62.5%;
  box-sizing: border-box;
}

body {
  width: 100%;
  font-family: "Noto Sans JP", sans-serif;
  /* font-size: min(calc(32 / 750 * 100vw), 3.2rem); */
  font-size: min(calc(32 / 750 * 100vw), 1.7rem);
  line-height: 1.6;
}

.main {
    overflow: hidden;
}

img, source {
  max-width: 100%;
  height: auto;
  vertical-align: top;
}

/* セクションごと共通の見出し */
.sec-ttl {
    font-size: min(calc(32 / 1280 * 100vw), 3.2rem);
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    margin: 0 0 min(calc(60 / 1280 * 100vw), 60px);
    position: relative;

    @media only screen and (max-width: 750px) {
        font-size: min(calc(20 / 390 * 100vw), 2.0rem);
        margin-bottom: min(calc(30 / 390 * 100vw), 30px);
    }

    .estimate & {
        line-height: 1.3;
    }

    .support & {
        margin-bottom: 0;

        @media only screen and (max-width: 750px) {
            margin-bottom: min(calc(10 / 390 * 100vw), 10px);
        }

        span {
            @media only screen and (max-width: 750px) {
                display: inline;
                line-height: 1.4;
            }
        }
    }

    &.step {
        @media only screen and (max-width: 750px) {
            font-size: min(calc(32 / 390 * 100vw), 3.2rem);
            margin-top: min(calc(40 / 390 * 100vw), 40px);
            margin-bottom: min(calc(40 / 390 * 100vw), 40px);
        }
    }

    span {
        font-size: min(calc(60 / 1280 * 100vw), 6.0rem);
        font-weight: 900;
        letter-spacing: 0.02em;
        padding: 0 min(calc(10 / 1280 * 100vw), 10px);
        display: inline-block;
        background:linear-gradient(transparent 50%, var(--color-solor-marker) 50%);

        @media only screen and (max-width: 750px) {
            font-size: min(calc(42 / 390 * 100vw), 4.2rem);
            font-weight: 700;
        }

        .estimate & {
            font-size: min(calc(42 / 1280 * 100vw), 4.2rem);
            letter-spacing: 0.1em;

            @media only screen and (max-width: 750px) {
                font-size: min(calc(32 / 390 * 100vw), 3.2rem);
            }
        }

        &.mini {
            font-size: min(calc(32 / 1280 * 100vw), 3.2rem);
            font-weight: 700;
            padding: 0 min(calc(4 / 1280 * 100vw), 4px);
            margin-left: min(calc(4 / 1280 * 100vw), 4px);

            @media only screen and (max-width: 750px) {
                font-size: min(calc(26 / 390 * 100vw), 2.6rem);
            }

            &:first-letter {
                font-size: min(calc(40 / 1280 * 100vw), 4.0rem);

                @media only screen and (max-width: 750px) {
                    font-size: min(calc(46 / 390 * 100vw), 4.6rem);
                }
            }
        }

        &.balloon {
            text-align: center;
            font-size: min(calc(24 / 1280 * 100vw), 2.4rem);
            color: var(--color-solor-lightest);
            background: var(--color-solor-green);
            border-radius: 100vh;
            position: relative;
            padding: min(calc(6 / 1280 * 100vw), 6px) min(calc(18 / 1280 * 100vw), 18px);
            display: inline-block;
            margin-bottom: min(calc(10 / 1280 * 100vw), 10px);

            @media only screen and (max-width: 750px) {
                font-size: min(calc(16 / 390 * 100vw), 1.6rem);
                padding: min(calc(4 / 390 * 100vw), 4px) min(calc(18 / 390 * 100vw), 18px);
                margin-bottom: min(calc(10 / 390 * 100vw), 10px);
            }

            &::after {
                position: absolute;
                bottom: max(calc(-19 / 1280 * 100vw), -19px);
                left: 50%;
                transform: translateX(-50%) rotate(90deg);
                content: "";
                width: min(calc(10 / 1280 * 100vw), 10px);
                height: min(calc(28 / 1280 * 100vw), 28px);
                clip-path: polygon(0 0, 100% 50%, 0 100%);
                background-color: var(--color-solor-green);

                @media only screen and (max-width: 750px) {
                    bottom: max(calc(-18 / 390 * 100vw), -18px);
                    width: min(calc(10 / 390 * 100vw), 10px);
                    height: min(calc(28 / 390 * 100vw), 28px);
                }
            }
        }
    }

    small {
        font-size: 75%;
    }
}

.sec-ttl-sub {
    font-size: min(calc(48 / 1280 * 100vw), 4.8rem);
    font-weight: 900;
    line-height: 1.6;
    letter-spacing: 0.05em;
    text-align: center;

    @media only screen and (max-width: 750px) {
        font-size: min(calc(24 / 390 * 100vw), 2.4rem);
        padding: 0 min(calc(30 / 390 * 100vw), 30px);
        line-height: 1.3;
    }
}

@media only screen and (min-width: 751px) {
  img, source {
    width: auto;
  }
}

@media only screen and (min-width: 751px) {
  a[href*="tel:"] {
    pointer-events: none;
    cursor: default;
    text-decoration: none;
  }
}

/* テキストリンク */
.text-link a {
  text-decoration: none;
}

/* PC/SP出し分け */
.pc-only {
  display: block;

  @media only screen and (max-width: 750px) {
    display: none;
  }
}
.sp-only {
  display: none;

  @media only screen and (max-width: 750px) {
    display: block;
  }
}

/* ダミーエリア */
.dummy-area {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    font-size: 4rem;
    font-weight: 700;
    color: var(--color-solor-orange);
    background-color: var(--color-solor-lightest);
    position: relative;
    z-index: 1;
    
    @media only screen and (max-width: 750px) {
        font-size: 3rem;
    }
}

/* ---------------------------------------
ヘッダー
--------------------------------------- */
header {
    .header {
        width: 100%;

        .inner-header {
            width: var(--width-content);
            height: 90px;
            margin: 0 auto;
            display: flex;
            justify-content: space-between;
            align-items: center;

            @media only screen and (max-width: 750px) {
                width: 100%;
                height: calc(64 / 390 * 100vw);
                padding: 0 calc(8 / 390 * 100vw);
            }

            .logo {
                width: min(calc(420 / 1280 * 100vw), 420px);
                font-size: 1em;
                line-height: 1;
                margin: 0 0 0 30px;

                @media only screen and (max-width: 750px) {
                    width: calc(215 / 390 * 100vw);
                    margin: 0;
                }
            }

            .nav {
                display: flex;
                justify-content: space-between;
                align-items: center;
                gap: min(calc(40 / 1280 * 100vw), 40px);

                @media only screen and (max-width: 750px) {
                    gap: calc(8 / 390 * 100vw);
                }

                .nav-tel {
                    width: min(calc(240 / 1280 * 100vw), 240px);
                    text-align: center;

                    @media only screen and (max-width: 750px) {
                        width: auto;
                    }

                    p {
                        font-size: min(calc(12 / 1280 * 100vw), 1.2rem);
                        font-weight: 700;
                        line-height: 1.3;
                        color: var(--color-solor-brown);

                        &.tel {
                            a {
                                font-size: min(calc(24 / 1280 * 100vw), 2.4rem);
                                font-weight: 900;
                                color: var(--color-solor-brown);
                            }
                        }
                    }

                    a {
                        @media only screen and (max-width: 750px) {
                            display: flex;
                            justify-content: center;
                            align-items: center;
                            width: calc(40 / 390 * 100vw);
                            height: calc(40 / 390 * 100vw);
                            background-color: var(--color-solor-orange);
                            border-radius: 100vh;
                        }
                    }
                }

                .nav-web {
                    a {
                        display: block;
                        height: min(calc(62 / 1280 * 100vw), 62px);
                        background-color: var(--color-solor-orange);
                        border: var(--color-solor-orange) solid 1px;
                        border-radius: 100vh;
                        padding: 0 min(calc(16 / 1280 * 100vw), 16px) 0 min(calc(64 / 1280 * 100vw), 64px);
                        color: var(--color-solor-lightest);
                        font-size: min(calc(16 / 1280 * 100vw), 1.6rem);
                        font-weight: 700;
                        line-height: 1.6;
                        letter-spacing: 0.08em;
                        display: flex;
                        justify-content: center;
                        flex-direction: column;
                        position: relative;
                        transition: all 300ms;

                        @media only screen and (max-width: 750px) {
                            height: calc(40 / 390 * 100vw);
                            display: flex;
                            align-items: center;
                            padding: 0;
                            width: calc(93 / 390 * 100vw);
                            height: calc(40 / 390 * 100vw);
                            font-size: calc(14 / 390 * 100vw);
                        }

                        &::before {
                            position: absolute;
                            top: 50%;
                            left: min(calc(16 / 1280 * 100vw), 16px);
                            transform: translateY(-50%);
                            content: "";
                            width: min(calc(40 / 1280 * 100vw), 40px);
                            height: min(calc(40 / 1280 * 100vw), 40px);
                            background: var(--color-solor-lightest) url(img/solor/ico_web_orange.svg) center/20px 19px no-repeat;
                            border-radius: 50%;
                            transition: all 300ms;

                            @media only screen and (max-width: 750px) {
                                display: none;
                            }
                        }

                        &:hover {
                            background-color: var(--color-solor-lightest);
                            border-color: var(--color-solor-orange);
                            color: var(--color-solor-orange);
                            opacity: 1;

                            @media only screen and (max-width: 1023px) {
                                background-color: var(--color-solor-orange);
                                border-color: var(--color-solor-lightest);
                                color: var(--color-solor-lightest);
                            }

                            &::before {
                                background-color: var(--color-solor-orange);
                                background-image: url(img/solor/ico_web_white.svg);
                            }
                        }

                        span {
                            font-size: 1.2rem;
                            display: block;
                        }
                    }
                }
            }
        }
    }
}

/* ---------------------------------------
fv-area
--------------------------------------- */
.fv-area {
    width: 100%;
    height: min(calc(600 / 1280 * 100vw), 600px);
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--color-solor-light-orange) url(img/solor/bg_fv.webp) bottom center/cover no-repeat;

    @media only screen and (max-width: 750px) {
        height: auto;
        background-image: none;
    }

    picture {
        width: min(calc(860 / 1280 * 100vw), 860px);

        @media only screen and (max-width: 750px) {
            width: 100%;
        }
    }
}

/* ---------------------------------------
subsidy
--------------------------------------- */
.subsidy {
    width: 100%;
    background-color: var(--color-solor-orange);
    position: relative;

    &.subsidy01 {
        @media only screen and (max-width: 750px) {
            background: url("img/solor/bg_subsidy01_sp.webp") top left/cover no-repeat;
            height: auto;
            padding-bottom: min(calc(10 / 390 * 100vw), 10px);
        }
    }

    &.subsidy02 {
        @media only screen and (max-width: 750px) {
            background: url("img/solor/bg_subsidy02_sp.webp") top left/cover no-repeat;
            height: calc(292 / 390 * 100vw);
            overflow: hidden;
        }

        &::after {
            @media only screen and (max-width: 750px) {
                right: min(calc(-20 / 390 * 100vw), -20px);
                bottom: min(calc(-50 / 390 * 100vw), -50px);
                width: min(calc(115 / 390 * 100vw), 120px);
                height: min(calc(300 / 390 * 100vw), 300px);
                background: url("img/solor/img_character.webp") bottom right/contain no-repeat;
            }
        }
    }

    &::after {
        @media only screen and (max-width: 750px) {
            position: absolute;
            right: 0;
            bottom:0;
            content: "";
            width: min(calc(71 / 390 * 100vw), 71px);
            height: min(calc(140 / 390 * 100vw), 140px);
            background: url("img/solor/img_character_sp.webp") bottom right/contain no-repeat;
        }
    }

    .inner-subsidy {
        width: var(--width-content);
        margin: 0 auto;
        padding: min(calc(76 / 1280 * 100vw), 76px) 0 0;
        position: relative;

        @media only screen and (max-width: 750px) {
            padding: 0;
            width: 100%;
            height: auto;
            display: flex;
            justify-content: center;
            align-items: flex-start;
            padding-top: min(calc(74 / 390 * 100vw), 74px);
            position: static;
        }

        .subsidy02 & {
            padding: min(calc(90 / 1280 * 100vw), 90px) 0 min(calc(20 / 1280 * 100vw), 20px);

            @media only screen and (max-width: 750px) {
                padding: min(calc(77 / 390 * 100vw), 77px) 0 0;
            }
        }

        &::before {
            position: absolute;
            top: 0;
            right: calc(50% + min(calc(350 / 1280 * 100vw), 350px));
            content: "";
            width: 100%;
            height: 100%;
            z-index: 0;

            @media only screen and (max-width: 750px) {
                display: none;
            }
        }

        .subsidy01 &::before {
            background: url("img/solor/bg_subsidy01_left.webp") top right/contain no-repeat;
        }
        .subsidy02 &::before {
            background: url("img/solor/bg_subsidy02_left.webp") top right/contain no-repeat;
        }

        &::after {
            position: absolute;
            top: 0;
            left: calc(50% + min(calc(350 / 1280 * 100vw), 350px));
            content: "";
            width: 100%;
            height: 100%;
            z-index: 0;

            @media only screen and (max-width: 750px) {
                display: none;
            }
        }

        .subsidy01 &::after {
            background: url("img/solor/bg_subsidy01_right.webp") top left/contain no-repeat;
        }
        .subsidy02 &::after {
            background: url("img/solor/bg_subsidy02_right.webp") top left/contain no-repeat;
        }

        h2 {
            font-size: min(calc(48 / 1280 * 100vw), 4.8rem);
            font-weight: 900;
            line-height: 1;
            letter-spacing: 0.2em;
            color: var(--color-solor-lightest);
            position: relative;
            left: 50%;
            margin: 0;
            text-align: center;
            transform: translateX(-50%);
            z-index: 1;
            display: inline-block;

            @media only screen and (max-width: 750px) {
               font-size: 2.7rem;
               font-weight: 700;
               line-height: 1.2;
               position: static;
               left: 0;
               transform: translateX(0);
            }

            .subsidy01 & {
                &::before {
                    position: absolute;
                    top: 42%;
                    left: calc(50% - min(calc(610 / 1280 * 100vw), 610px));
                    transform: translateY(-50%);
                    content: "";
                    width: min(calc(264 / 1280 * 100vw), 264px);
                    height: min(calc(254 / 1280 * 100vw), 254px);
                    background: url("img/solor/img_hourglass.webp") center/contain no-repeat;

                    @media only screen and (max-width: 750px) {
                        display: none;
                    }
                }

                &::after {
                    position: absolute;
                    top: 38%;
                    right: calc(50% - min(calc(640 / 1280 * 100vw), 640px));
                    transform: translateY(-50%);
                    content: "";
                    width: min(calc(240 / 1280 * 100vw), 240px);
                    height: min(calc(372 / 1280 * 100vw), 372px);
                    background: url("img/solor/img_character.webp") center/contain no-repeat;

                    @media only screen and (max-width: 750px) {
                        display: none;
                    }
                }
            }

            .subsidy02 & {
                font-size: min(calc(46 / 1280 * 100vw), 4.6rem);
                line-height: 1.2;

                @media only screen and (max-width: 750px) {
                    font-size: min(calc(27 / 390 * 100vw), 2.7rem);
                }

                &::before {
                    position: absolute;
                    top: 37%;
                    left: max(calc(-248 / 1280 * 100vw), -248px);
                    transform: translateY(-50%);
                    content: "";
                    width: min(calc(238 / 1280 * 100vw), 238px);
                    height: min(calc(243 / 1280 * 100vw), 243px);
                    background: url("img/solor/img_hourglass.webp") center/contain no-repeat;

                    @media only screen and (max-width: 750px) {
                        display: none;
                    }
                }

                &::after {
                    position: absolute;
                    top: 40%;
                    right: max(calc(-250 / 1280 * 100vw), -250px);
                    transform: translateY(-50%);
                    content: "";
                    width: min(calc(200 / 1280 * 100vw), 200px);
                    height: min(calc(310 / 1280 * 100vw), 310px);
                    background: url("img/solor/img_character.webp") center/contain no-repeat;
 
                    @media only screen and (max-width: 750px) {
                        display: none;
                    }
                }
            }

            .label {
                position: absolute;
                top: max(calc(-140 / 1280 * 100vw), -140px);
                left: calc(50% - 296px);
                transform: translateX(-50%);
                content: "";
                width: min(calc(326 / 1280 * 100vw), 326px);

                @media only screen and (max-width: 750px){
                    top: max(calc(-110 / 390 * 100vw), -110px);
                    left: max(calc(20 / 390 * 100vw), 20px);
                    transform: translateX(0);
                    width: min(calc(128 / 390 * 100vw), 128px);
                    height: min(calc(74 / 390 * 100vw), 74px);
                }
            }
            .balloon {
                position: absolute;
                top: max(calc(-60 / 1280 * 100vw), -60px);
                right: calc(50% - min(calc(210 / 1280 * 100vw), 210px));
                transform: translateX(50%);
                content: "";
                width: min(calc(223 / 1280 * 100vw), 223px);
                height: min(calc(47 / 1280 * 100vw), 47px);

                @media only screen and (max-width: 750px){
                    top: max(calc(-42 / 390 * 100vw), -42px);
                    right: 50%;
                    width: min(calc(187 / 390 * 100vw), 187px);
                    height: min(calc(42 / 390 * 100vw), 42px);
                }

                .subsidy02 & {
                    top: min(calc(-50 / 1280 * 100vw), -50px);
                    right: 50%;

                    @media only screen and (max-width: 750px){
                        width: min(calc(223 / 390 * 100vw), 223px);
                        height: min(calc(47 / 390 * 100vw), 47px);
                    }
                }
            }
            .million {
                display: block;
                width: min(calc(562 / 1280 * 100vw), 562px);
                margin: min(calc(18 / 1280 * 100vw), 18px) auto;
                padding-right: min(calc(26 / 1280 * 100vw), 26px);

                @media only screen and (max-width: 750px){
                    width: max(calc(279 / 390 * 100vw), 279px);
                    margin: min(calc(10 / 390 * 100vw), 10px) auto min(calc(16 / 390 * 100vw), 16px);
                }

                .subsidy02 & {
                    @media only screen and (max-width: 750px){
                        transform: translateX(min(calc(-20 / 390 * 100vw), -20px)) translateY(min(calc(10 / 390 * 100vw), 10px));
                    }
                }
            }
            .chance {
                font-size: min(calc(60 / 1280 * 100vw), 6.0rem);
                letter-spacing: 0.06em;
                padding-left: min(calc(60 / 1280 * 100vw), 60px);
                position: relative;

                span {
                    @media only screen and (max-width: 750px){
                        padding-right: 1em;
                    }
                }

                @media only screen and (max-width: 750px){
                    font-size: 2.7rem;
                    padding-left: 0;
                    text-align: center;
                    letter-spacing: 0.15em;
                }
            }
            .exclamation {
                display: inline-block;
                width: min(calc(93 / 1280 * 100vw), 93px);
                position: relative;
                top: -30px;
                left: -30px;

                @media only screen and (max-width: 1512px) and (min-width: 751px) {
                    top: max(calc(-25 / 1280 * 100vw), -25px);
                    left: max(calc(-25 / 1280 * 100vw), -25px);
                }

                @media only screen and (max-width: 750px){
                    width: min(calc(40 / 390 * 100vw), 40px);
                    height: min(calc(40 / 390 * 100vw), 40px);
                    top: max(calc(-3 / 390 * 100vw), -3px);
                    left: max(calc(-6 / 390 * 100vw), -6px);
                }
            }

            .comparison {
                font-size: min(calc(24 / 1280 * 100vw), 2.4rem);
                font-weight: 700;
                padding: min(calc(5 / 1280 * 100vw), 5px) min(calc(10 / 1280 * 100vw), 10px);
                border-radius: min(calc(6 / 1280 * 100vw), 6px);
                background-color: var(--color-solor-lightest);
                display: inline-block;
                color: var(--color-solor-orange);
                letter-spacing: 0.08em;
                transform: translateY(-35px);

                @media only screen and (max-width: 1512px) and (min-width: 751px) {
                    transform: translateY(-20px);
                }

                @media only screen and (max-width: 750px){
                    font-size: min(calc(12 / 390 * 100vw), 1.2rem);
                    border-radius: min(calc(2 / 390 * 100vw), 2px);
                    padding: min(calc(4 / 390 * 100vw), 4px) min(calc(10 / 390 * 100vw), 10px);
                    transform: translateY(0);
                    display: block;
                }

                .brown, .green {
                    font-size: 130%;
                }

                .brown {
                    color: #734822;
                }

                .green {
                    color: #1D8B45;
                }
            }
        }
    }
}

/* ---------------------------------------
業界最安値
--------------------------------------- */
.chepest-price {
    width: 100%;
    height: min(calc(241 / 1280 * 100vw), 241px);
    background: url("img/solor/bg_cheapest-price.webp") bottom center/cover no-repeat;
    margin-bottom: min(calc(40 / 1280 * 100vw), 40px);
    padding-top: min(calc(20 / 1280 * 100vw), 20px);

    @media only screen and (max-width: 750px){
        height: calc(128 / 390 * 100vw);
        background-image: url("img/solor/bg_cheapest-price_sp.webp");
        padding-top: min(calc(10 / 390 * 100vw), 10px);
    }

    h2 {
        font-size: min(calc(80 / 1280 * 100vw), 8.0rem);
        font-weight: 700;
        line-height: 1.4;
        text-align: center;
        position: relative;
        margin: 0;

        @media only screen and (max-width: 750px){
            font-size: min(calc(42 / 390 * 100vw), 4.2rem);
        }

        .balloon {
            position: relative;
            top: 0;
            display: inline-block;
            width: min(calc(108 / 1280 * 100vw), 108px);
            height: min(calc(108 / 1280 * 100vw), 108px);

            @media only screen and (max-width: 750px){
                width: min(calc(60 / 390 * 100vw), 70px);
                height: min(calc(60 / 390 * 100vw), 70px);
            }
        }

        small {
            font-size: min(calc(35 / 1280 * 100vw), 3.5rem);
            letter-spacing: 0.2em;
            display: block;
            padding-left: min(calc(50 / 1280 * 100vw), 50px);

            @media only screen and (max-width: 750px){
                font-size: min(calc(20 / 390 * 100vw), 2.0rem);
            }
        }
    }
}

/* ---------------------------------------
東京都の補助金
--------------------------------------- */
.support {
    width: 100%;
    background-color: var(--color-solor-light-green);
    padding: min(calc(90 / 1280 * 100vw), 90px) 0;

    @media only screen and (max-width: 750px){
        padding: min(calc(55 / 390 * 100vw), 55px) 0 0;
    }

    .inner-support {
        width: min(calc(1280 / 1280 * 100vw), 1280px);
        margin: 0 auto;

        @media only screen and (max-width: 1512px) and (min-width: 751px) {
            width: 100%;
        }

        @media only screen and (max-width: 750px){
            width: 100%;
        }

        .support-content {
            width: 100%;
            padding: min(calc(70 / 1280 * 100vw), 70px) min(calc(40 / 1280 * 100vw), 40px) min(calc(40 / 1280 * 100vw), 40px);
            background-color: var(--color-solor-lightest);
            border: #80AC90 solid min(calc(6 / 1280 * 100vw), 6px);
            border-radius: min(calc(16 / 1280 * 100vw), 16px);
            margin-top: min(calc(50 / 1280 * 100vw), 50px);
            box-sizing: border-box;

            @media only screen and (max-width: 1512px) and (min-width: 751px) {
                width: auto;
                margin-left: min(calc(30 / 1280 * 100vw), 30px);
                margin-right: min(calc(30 / 1280 * 100vw), 30px);
            }

            @media only screen and (max-width: 750px){
                padding: min(calc(25 / 390 * 100vw), 25px) min(calc(20 / 390 * 100vw), 20px) min(calc(40 / 390 * 100vw), 40px);
                border-width: min(calc(4 / 390 * 100vw), 4px) 0 0;
                border-radius: 0;
                margin-top: min(calc(30 / 390 * 100vw), 30px);
            }

            h3 {
                font-size: min(calc(56 / 1280 * 100vw), 5.6rem);
                font-weight: 900;
                line-height: 1.8;
                letter-spacing: 0.1em;
                color: var(--color-solor-green);
                text-align: center;
                margin: 0 0 min(calc(20 / 1280 * 100vw), 20px);

                @media only screen and (max-width: 750px){
                    font-size: min(calc(31 / 390 * 100vw), 3.1rem);
                    letter-spacing: 0.05em;
                    margin: 0 0 min(calc(10 / 390 * 100vw), 10px);
                }

                span {
                    position: relative;

                    &::before {
                        position: absolute;
                        top: -10px;
                        left: calc(50% - 0.05em);
                        transform: translateX(-50%);
                        content: "";
                        width: min(calc(16 / 1280 * 100vw), 16px);
                        height: min(calc(16 / 1280 * 100vw), 16px);
                        background-color: #FA5254;
                        border-radius: 50%;

                        @-moz-document url-prefix() {
                            top: -20px;
                        }

                        @media only screen and (max-width: 750px){
                            top: min(calc(-4 / 390 * 100vw), -4px);
                            width: min(calc(8 / 390 * 100vw), 8px);
                            height: min(calc(8 / 390 * 100vw), 8px);
                        }
                    }
                }
            }

            h4 {
                font-size: min(calc(40 / 1280 * 100vw), 4.0rem);
                font-weight: 900;
                line-height: 1.3;
                letter-spacing: 0.1em;
                text-align: center;
                margin: 0 0 min(calc(20 / 1280 * 100vw), 20px);
                position: relative;

                @media only screen and (max-width: 750px){
                    font-size: min(calc(20 / 390 * 100vw), 2.0rem);
                    line-height: 1.2;
                    letter-spacing: 0.05em;
                    margin: 0 0 min(calc(30 / 390 * 100vw), 30px);
                }

                &::before, &::after {
                    position: absolute;
                    top: 50%;
                    content: "";
                    width: min(calc(41 / 1280 * 100vw), 41px);
                    height: min(calc(77 / 1280 * 100vw), 77px);
                    background: url("img/solor/ico_shine.svg") center/contain no-repeat;

                    @media only screen and (max-width: 750px){
                        top: auto;
                        bottom: 0;
                        width: min(calc(20 / 390 * 100vw), 20px);
                        height: min(calc(18 / 390 * 100vw), 18px);
                        background: url("img/solor/ico_shine_sp.svg") center/contain no-repeat;
                    }
                }

                &::before {
                    left: 0;
                    transform: translateY(-50%);
                }

                @media only screen and (max-width: 1512px) and (min-width: 751px) {
                    &::before {
                        left: -10px;
                    }
                }

                &::after {
                    right: 0;
                    transform: translateY(-50%) scaleX(-1);
                }
                
                @media only screen and (max-width: 1512px) and (min-width: 751px) {
                    &::after {
                        right: -10px;
                    }
                }

                span {
                    color: #FA5254;
                }
            }

            .support-list {
                display: flex;
                justify-content: space-between;
                margin-bottom: min(calc(40 / 1280 * 100vw), 40px);

                @media only screen and (max-width: 750px){
                    margin-bottom: min(calc(30 / 390 * 100vw), 30px);
                    flex-direction: column;
                    gap: min(calc(40 / 390 * 100vw), 40px);
                }

                li {
                    width: min(calc(352 / 1280 * 100vw), 352px);
                    height: min(calc(220 / 1280 * 100vw), 220px);
                    background-color: var(--color-solor-orange);
                    color: var(--color-solor-lightest);
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    font-size: min(calc(56 / 1280 * 100vw), 5.6rem);
                    font-weight: 900;
                    letter-spacing: 0.05em;
                    line-height: 1.2;
                    border-radius: min(calc(8 / 1280 * 100vw), 8px);
                    text-align: center;
                    position: relative;

                    @media only screen and (max-width: 1512px) and (min-width: 751px) {
                        width: min(calc(340 / 1280 * 100vw), 340px);
                        font-size: min(calc(50 / 1280 * 100vw), 5.0rem);
                    }

                    @media only screen and (max-width: 750px){
                        width: 100%;
                        height: min(calc(180 / 390 * 100vw), 180px);
                        font-size: min(calc(32 / 390 * 100vw), 3.2rem);
                        border-radius: min(calc(8 / 390 * 100vw), 8px);
                    }

                    &::after {
                        position: absolute;
                        top: 50%;
                        right: max(calc(-50 / 1280 * 100vw), -50px);
                        transform: translateY(-50%);
                        content: "";
                        width: min(calc(32 / 1280 * 100vw), 40px);
                        height: min(calc(32 / 1280 * 100vw), 40px);
                        background: url("img/solor/ico_plus.svg") center/contain no-repeat;
                    }

                    @media only screen and (max-width: 1512px) and (min-width: 751px) {
                        &::after {
                            right: max(calc(-43 / 1280 * 100vw), -40px);
                        }
                    }

                    @media only screen and (max-width: 750px) {
                        &::after {
                            top: auto;
                            bottom: max(calc(-38 / 390 * 100vw), -38px);
                            right: 50%;
                            transform: translateX(50%) translateY(-50%);
                            width: min(calc(18 / 390 * 100vw), 18px);
                            height: min(calc(18 / 390 * 100vw), 18px);    
                        }
                    }

                    &:last-of-type {
                        &::after {
                            display: none;
                        }
                    }
                }
            }

            .description {
                width: 100%;
                display: flex;
                justify-content: space-between;
                padding: 0 min(calc(40 / 1280 * 100vw), 40px);

                @media only screen and (max-width: 750px){
                    padding: 0;
                    flex-direction: column;
                    gap: min(calc(20 / 390 * 100vw), 20px);
                }

                p {
                    font-size: min(calc(40 / 1280 * 100vw), 4.0rem);
                    font-weight: 900;
                    line-height: 1.4;
                    width: min(calc(803 / 1280 * 100vw), 803px);

                    @media only screen and (max-width: 750px){
                        font-size: min(calc(20 / 390 * 100vw), 2.0rem);
                        line-height: 1.8;
                        width: 100%;
                        text-align: center;
                    }

                    .green {
                        font-size: min(calc(56 / 1280 * 100vw), 5.6rem);
                        line-height: 1.4;
                        color: var(--color-solor-green);

                        @media only screen and (max-width: 1512px) and (min-width: 751px) {
                            font-size: min(calc(52 / 1280 * 100vw), 5.2rem);
                        }

                        @media only screen and (max-width: 750px){
                            font-size: min(calc(30 / 390 * 100vw), 3.0rem);
                        }

                        &:nth-of-type(2) {
                            @media only screen and (max-width: 750px){
                                font-size: min(calc(24 / 390 * 100vw), 2.4rem);
                            }
                        }

                        &:nth-of-type(3) {
                            @media only screen and (max-width: 750px){
                                font-feature-settings: "palt";
                            }
                        }
                    }

                    .exclamation {
                        width: min(calc(54 / 1280 * 100vw), 54px);
                        height: min(calc(76 / 1280 * 100vw), 76px);
                        display: inline-block;
                        transform: translateY(min(calc(-5 / 1280 * 100vw), -5px));

                        @media only screen and (max-width: 750px){
                            width: min(calc(20 / 390 * 100vw), 20px);
                            height: min(calc(30 / 390 * 100vw), 30px);
                            transform: translateY(min(calc(-5 / 390 * 100vw), -5px));
                        }

                        img {
                            vertical-align: middle;
                        }
                    }
                }

                .pic-box {
                    width: min(calc(276 / 1280 * 100vw), 276px);

                    @media only screen and (max-width: 750px){
                        width: min(calc(220 / 390 * 100vw), 220px);
                        margin: 0 auto;
                    }
                }
            }
        }
    }
}

/* ---------------------------------------
相場価格とは？
--------------------------------------- */
.market-price {
    width: 100%;
    background-color: var(--color-solor-light-orange);

    .inner-market-price {
        width: min(100%, 1280px);
        padding: min(calc(90 / 1280 * 100vw), 90px) 0;
        margin: 0 auto;

        @media only screen and (max-width: 1512px) and (min-width: 751px) {
            padding-left: min(calc(30 / 1280 * 100vw), 30px);
            padding-right: min(calc(30 / 1280 * 100vw), 30px);
        }

        @media only screen and (max-width: 750px) {
            padding: min(calc(50 / 390 * 100vw), 50px) min(calc(15 / 390 * 100vw), 15px);
        }

        .price-area {
            .price-list {
                display: flex;
                justify-content: space-between;
                gap: min(calc(70 / 1280 * 100vw), 70px);
                margin-bottom: min(calc(20 / 1280 * 100vw), 20px);
                position: relative;

                @media only screen and (max-width: 750px) {
                    gap: min(calc(34 / 390 * 100vw), 34px);
                }

                &:first-of-type {
                    margin-bottom: min(calc(110 / 1280 * 100vw), 110px);

                    @media only screen and (max-width: 750px) {
                        margin-bottom: min(calc(70 / 390 * 100vw), 70px);
                    }

                    &::before {
                        position: absolute;
                        top: 44%;
                        left: 50%;
                        transform: translate(-50%);
                        content: "";
                        width: min(calc(30 / 1280 * 100vw), 30px);
                        height: min(calc(30 / 1280 * 100vw), 30px);
                        background: url("img/solor/ico_multiplication.svg") center/contain no-repeat;

                        @media only screen and (max-width: 750px) {
                            width: min(calc(17 / 390 * 100vw), 30px);
                            height: min(calc(17 / 390 * 100vw), 30px);
                        }
                    }

                    &::after {
                        position: absolute;
                        bottom: max(calc(-86 / 1280 * 100vw), -86px);
                        left: 50%;
                        transform: translateX(-50%);
                        content: "";
                        width: min(calc(12 / 1280 * 100vw), 12px);
                        height: min(calc(60 / 1280 * 100vw), 60px);
                        background: url("img/solor/ico_market-price_flow.svg") center/contain no-repeat;

                        @media only screen and (max-width: 750px) {
                            width: min(calc(8 / 390 * 100vw), 8px);
                            height: min(calc(80 / 390 * 100vw), 80px);
                            bottom: max(calc(-75 / 390 * 100vw), -75px);
                        }
                    }
                }

                &:nth-of-type(2) {
                    li {
                        h3 {
                            font-size: min(calc(40 / 1280 * 100vw), 4.0rem);

                            @media only screen and (max-width: 750px) {
                                font-size: min(calc(24 / 390 * 100vw), 2.4rem);
                            }
                        }

                        .price {
                            @media only screen and (max-width: 1279px) {
                                padding: min(calc(30 / 390 * 100vw), 30px) min(calc(10 / 390 * 100vw), 10px);
                            }

                            p {
                                @media only screen and (max-width: 750px) {
                                    font-size: min(calc(32 / 390 * 100vw), 3.2rem);
                                }

                                span {
                                    @media only screen and (max-width: 750px) {
                                        font-size: min(calc(16 / 390 * 100vw), 1.6rem);
                                        font-weight: 700;
                                    }
                                }
                            }
                        }
                    }
                }

                li {
                    width: 100%;
                    border: var(--color-solor-orange) solid min(calc(6 / 1280 * 100vw), 6px);
                    border-radius: min(calc(14 / 1280 * 100vw), 14px);
                    background-color: var(--color-solor-lightest);
                    text-align: center;
                    position: relative;

                    @media only screen and (max-width: 750px) {
                        border-width: 6px;
                        border-radius: min(calc(8 / 390 * 100vw), 8px);
                    }

                    h3 {
                        margin: 0;
                        font-size: min(calc(28 / 1280 * 100vw), 2.8rem);
                        font-weight: 700;
                        color: var(--color-solor-lightest);
                        padding: min(calc(18 / 1280 * 100vw), 18px);
                        background-color: var(--color-solor-orange);

                        @media only screen and (max-width: 750px) {
                            font-size: min(calc(18 / 390 * 100vw), 1.8rem);
                            padding: min(calc(6 / 390 * 100vw), 6px);
                        }
                    }
                    .price {
                        padding: 36px;

                            @media only screen and (max-width: 1279px) {
                                padding: min(calc(34 / 390 * 100vw), 34px) min(calc(10 / 390 * 100vw), 10px);
                            }

                        p {
                            font-size: min(calc(56 / 1280 * 100vw), 5.6rem);
                            font-weight: 900;
                            line-height: 1.3;
                            color: var(--color-solor-orange);

                            @media only screen and (max-width: 750px) {
                                font-size: min(calc(28 / 390 * 100vw), 2.8rem);
                                font-weight: 700;
                            }

                                span {
                                    font-size: min(calc(20 / 1280 * 100vw), 2.0rem);
                                    font-weight: 700;
                                    display: block;

                                    @media only screen and (max-width: 750px) {
                                        font-size: min(calc(12 / 390 * 100vw), 1.2rem);
                                    }
                                }
                        }
                    }
                }
            }

            .note {
                font-size: min(calc(30 / 1280 * 100vw), 3.0rem);
                font-weight: 700;
                line-height: 1.4;
                text-align: center;

                @media only screen and (max-width: 750px) {
                    font-size: min(calc(18 / 390 * 100vw), 1.8rem);
                    margin-top: min(calc(30 / 390 * 100vw), 30px);
                }
            }
        }
    }
}

/* ---------------------------------------
3つのメリット
--------------------------------------- */
.merit {
    width: 100%;
    background-color: var(--color-solor-light-green);

    .inner-merit {
        width: min(100%, 1280px);
        margin: 0 auto;
        padding: min(calc(100 / 1280 * 100vw), 100px) 0 min(calc(60 / 1280 * 100vw), 60px);

        @media only screen and (max-width: 1290px) {
            padding: min(calc(60 / 390 * 100vw), 60px) min(calc(30 / 1280 * 100vw), 30px) min(calc(30 / 390 * 100vw), 30px);
        }
     
        @media only screen and (max-width: 750px) {
            padding-left: min(calc(15 / 390 * 100vw), 15px);
            padding-right: min(calc(15 / 390 * 100vw), 15px);
        }
        
        .merit-list {
            display: flex;
            justify-content: space-between;
            gap: min(calc(30 / 1280 * 100vw), 30px);
            margin: min(calc(132 / 1280 * 100vw), 132px) auto min(calc(200 / 1280 * 100vw), 200px);
            padding: 0;

            @media only screen and (max-width: 750px) {
                flex-direction: column;
                gap: min(calc(70 / 390 * 100vw), 70px);
                margin: min(calc(80 / 390 * 100vw), 80px) 0 min(calc(40 / 390 * 100vw), 40px);
            }

            li {
                width: 100%;
                position: relative;
                border: var(--color-solor-green) solid 6px;
                border-radius: 8px;
                background-color: var(--color-solor-lightest);
                padding: min(calc(48 / 1280 * 100vw), 48px) min(calc(16 / 1280 * 100vw), 16px) min(calc(20 / 1280 * 100vw), 20px);

                @media only screen and (max-width: 750px) {
                    padding: min(calc(40 / 390 * 100vw), 40px) min(calc(10 / 390 * 100vw), 10px) min(calc(20 / 390 * 100vw), 20px);
                    border-radius: min(calc(12 / 390 * 100vw), 12px);
                }

                .merit-num {
                    position: absolute;
                    top: max(calc(-75 / 1280 * 100vw), -75px);
                    left: 50%;
                    transform: translateX(-50%);
                    width: min(calc(100 / 1280 * 100vw), 100px);
                    height: min(calc(100 / 1280 * 100vw), 100px);
                    background-color: var(--color-solor-green);
                    border-radius: 50%;
                    color: var(--color-solor-lightest);
                    font-size: min(calc(20 / 1280 * 100vw), 2.0rem);
                    font-weight: 900;
                    line-height: 1.0;
                    letter-spacing: 0.15em;
                    text-align: center;
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    flex-direction: column;

                    @media only screen and (max-width: 750px) {
                        top: max(calc(-64 / 390 * 100vw), -64px);
                        width: min(calc(90 / 390 * 100vw), 90px);
                        height: min(calc(90 / 390 * 100vw), 90px);
                        font-size: min(calc(18 / 390 * 100vw), 1.8rem);
                    }

                    &::after {
                        position: absolute;
                        bottom:  -15px;
                        left: 50%;
                        transform: translateX(-50%) rotate(90deg);
                        content: "";
                        width: min(calc(15 / 1280 * 100vw), 15px);
                        height: min(calc(25 / 1280 * 100vw), 25px);
                        clip-path: polygon(0 0, 100% 50%, 0 100%);
                        background-color: var(--color-solor-green);

                        @media only screen and (max-width: 750px) {
                            bottom:  -10px;
                            width: min(calc(10 / 390 * 100vw), 20px);
                            height: min(calc(20 / 390 * 100vw), 16px);
                        }
                    }

                    @media only screen and (max-width: 1512px) and (min-width: 751px) {
                        &::after {
                            bottom:  -11px;
                        }
                    }

                    span {
                        font-size: min(calc(30 / 1280 * 100vw), 3.0rem);
                        display: block;

                        @media only screen and (max-width: 750px) {
                            font-size: min(calc(30 / 390 * 100vw), 3.0rem);
                        }

                    }
                }

                h3 {
                    margin: 0 0 min(calc(16 / 1280 * 100vw), 16px);
                    font-size: min(calc(24 / 1280 * 100vw), 2.4rem);
                    font-weight: 900;
                    line-height: 1.4;
                    letter-spacing: 0.15em;
                    text-align: center;
                    color: var(--color-solor-green);

                    @media only screen and (max-width: 750px) {
                        font-size: min(calc(18 / 390 * 100vw), 1.8rem);
                        margin-bottom: min(calc(14 / 390 * 100vw), 14px);
                    }

                    span {
                        font-size: min(calc(27 / 1280 * 100vw), 2.8rem);
                        font-weight: 900;
                        letter-spacing: 0.1em;
                        display: inline-block;
                        background: linear-gradient(transparent 50%, var(--color-solor-marker) 50%);

                        @media only screen and (max-width: 750px) {
                            font-size: min(calc(24 / 390 * 100vw), 2.4rem);
                            display: inline;
                        }
                    }
                }

                .img-box {
                    width: min(calc(300 / 1280 * 100vw), 300px);
                    height: min(calc(245 / 1280 * 100vw), 245px);
                    margin: 0 auto min(calc(16 / 1280 * 100vw), 16px);
                    text-align: center;

                    @media only screen and (max-width: 750px){
                        width: min(calc(240 / 390 * 100vw), 240px);
                        height: min(calc(196 / 390 * 100vw), 196px);
                        margin-bottom: min(calc(10 / 390 * 100vw), 10px);
                    }

                    img {
                        height: 100%;
                    }
                }

                p {
                    font-size: min(calc(16 / 1280 * 100vw), 1.6rem);
                    font-weight: 400;
                    line-height: 1.5;
                    letter-spacing: 0.15em;
                    
                    @media only screen and (max-width: 750px) {
                        font-size: min(calc(14 / 390 * 100vw), 1.4rem);
                        font-weight: 700;
                        line-height: 1.7;
                    }
                }
            }
        }

        .reduction {
            width: min(calc(1200 / 1280 * 100vw), 1200px);
            height: min(calc(286 / 1280 * 100vw), 286px);
            margin: 0 auto min(calc(238 / 1280 * 100vw), 238px);
            padding: min(calc(24 / 1280 * 100vw), 24px) min(calc(35 / 1280 * 100vw), 35px);
            background-color: var(--color-solor-marker);
            border-radius: 100vh;
            position: relative;

            @media only screen and (max-width: 750px){
                width: 100%;
                height: min(calc(230 / 390 * 100vw), 230px);
                margin-bottom: min(calc(140 / 390 * 100vw), 140px);
            }

            &::after {
                position: absolute;
                bottom: max(calc(-239 / 1280 * 100vw), -239px);
                left: 50%;
                transform: translateX(-50%);
                content: "";
                width: min(calc(410 / 1280 * 100vw), 410px);
                height: min(calc(296 / 1280 * 100vw), 296px);
                background: url("img/solor/pic_reduction.webp") center/contain no-repeat;

                @media only screen and (max-width: 750px) {
                    bottom: max(calc(-140 / 390 * 100vw), -140px);
                    width: min(calc(290 / 390 * 100vw), 290px);
                    height: min(calc(160 / 390 * 100vw), 160px);
                }
            }

            .inner-reduction {
                width: 100%;
                height: 100%;
                background-color: var(--color-solor-lightest);
                border-radius: 100vh;
                display: flex;
                justify-content: center;
                align-items: center;
                text-align: center;
                padding-bottom: min(calc(20 / 1280 * 100vw), 20px);

                @media only screen and (max-width: 750px) {
                    padding: min(calc(20 / 390 * 100vw), 20px) min(calc(10 / 390 * 100vw), 10px);
                }

                p {
                    font-size: min(calc(50 / 1280 * 100vw), 5rem);
                    font-weight: 900;
                    line-height: 1.3;
                    letter-spacing: 0.05em;

                    @media only screen and (max-width: 750px) {
                        font-size: min(calc(33 / 390 * 100vw), 3.3rem);
                        letter-spacing: 0.02em;
                    }

                    .yen {
                        font-size: min(calc(60 / 1280 * 100vw), 6rem);
                        letter-spacing: 0.1em;
                        color: #FA5254;

                        @media only screen and (max-width: 750px) {
                            font-size: min(calc(35 / 390 * 100vw), 3.5rem);
                            line-height: 1;
                        }
                    }
                    .reduction-text {
                        font-size: min(calc(36 / 1280 * 100vw), 3.6rem);
                        font-weight: 700;

                        @media only screen and (max-width: 750px) {
                            font-size: min(calc(25 / 390 * 100vw), 2.5rem);
                            letter-spacing: 0.2em;
                        }
                    }
                }
            }
        }
    }
}

/* ---------------------------------------
主要メーカー
--------------------------------------- */
.maker {
    width: 100%;

    .inner-maker {
        width: min(100%, 1280px);
        padding: min(calc(90 / 1280 * 100vw), 90px) 0 min(calc(100 / 1280 * 100vw), 100px);
        margin: 0 auto;

        @media only screen and (max-width: 1512px) and (min-width: 751px) {
            padding-left: min(calc(30 / 1280 * 100vw), 30px);
            padding-right: min(calc(30 / 1280 * 100vw), 30px);
        }

        @media only screen and (max-width: 750px) {
            padding: min(calc(50 / 390 * 100vw), 50px) min(calc(20 / 390 * 100vw), 20px) min(calc(100 / 390 * 100vw), 100px);
        }

        .maker-list {
            width: 100%;
            display: flex;
            flex-direction: column;
            gap: min(calc(40 / 1280 * 100vw), 40px);

            @media only screen and (max-width: 750px) {
                gap: min(calc(64 / 390 * 100vw), 64px);
            }

            li {
                display: flex;
                justify-content: space-between;
                align-items: center;
                gap: min(calc(40 / 1280 * 100vw), 40px);

                @media only screen and (max-width: 750px) {
                    align-items: flex-start;
                    flex-direction: column;
                    gap: min(calc(20 / 390 * 100vw), 20px);
                }

                .logo-box {
                    width: min(calc(380 / 1280 * 100vw), 380px);

                    @media only screen and (max-width: 750px) {
                        width: 100%;
                    }
                }

                .txt-box {
                    width: min(calc(860 / 1280 * 100vw), 860px);

                    @media only screen and (max-width: 750px) {
                        width: 100%;
                    }

                    h3 {
                        margin: 0 0 min(calc(16 / 1280 * 100vw), 16px);
                        font-size: min(calc(32 / 1280 * 100vw), 3.2rem);
                        font-weight: 900;
                        letter-spacing: 0.1em;
                        color: var(--color-solor-orange);

                        @media only screen and (max-width: 750px) {
                            font-size: min(calc(24 / 390 * 100vw), 2.4rem);
                            margin-bottom: min(calc(10 / 390 * 100vw), 10px);
                        }
                    }

                    p {
                        color: #4E453D;
                        font-size: min(calc(20 / 1280 * 100vw), 2rem);
                        font-weight: 400;
                        line-height: 1.5;
                        letter-spacing: 0.08em;

                        @media only screen and (max-width: 750px) {
                            font-size: min(calc(14 / 390 * 100vw), 1.4rem);
                            font-weight: 700;
                            line-height: 1.7;
                        }
                    }

                    .detail {
                        padding: min(calc(52 / 1280 * 100vw), 52px) min(calc(20 / 1280 * 100vw), 20px);
                        margin-top: min(calc(16 / 1280 * 100vw), 16px);
                        background-color: var(--color-solor-light-orange);

                        @media only screen and (max-width: 750px) {
                            padding: min(calc(20 / 390 * 100vw), 20px) min(calc(16 / 390 * 100vw), 16px);
                            margin-top: min(calc(16 / 390 * 100vw), 16px);
                        }

                        .pickup {
                            font-size: min(calc(19 / 1280 * 100vw), 1.9rem);
                            font-weight: 700;
                            letter-spacing: 0.1em;
                            color: var(--color-solor-orange);
                            position: relative;
                            padding-left: min(calc(80 / 1280 * 100vw), 80px);
                            margin-bottom: min(calc(40 / 1280 * 100vw), 40px);

                            @media only screen and (max-width: 750px) {
                                font-size: min(calc(14 / 390 * 100vw), 1.4rem);
                                padding-left: min(calc(58 / 390 * 100vw), 58px);
                            }

                            &::before {
                                position: absolute;
                                top: 50%;
                                left: 0;
                                transform: translateY(-50%);
                                content: "";
                                width: min(calc(74 / 1280 * 100vw), 74px);
                                height: min(calc(74 / 1280 * 100vw), 74px);
                                background: url("img/solor/ico_picup.svg") center/contain no-repeat;

                                @media only screen and (max-width: 750px) {
                                    width: min(calc(54 / 390 * 100vw), 54px);
                                    height: min(calc(54 / 390 * 100vw), 54px);
                                }
                            }
                        }

                        .explanation {
                            font-size: min(calc(19 / 1280 * 100vw), 1.9rem);
                            font-weight: 700;
                            letter-spacing: 0.1em;

                            @media only screen and (max-width: 750px) {
                                font-size: min(calc(14 / 390 * 100vw), 1.4rem);
                            }
                        }
                    }
                }
            }
        }
    }
}

/* ---------------------------------------
一括見積もり可能！
--------------------------------------- */
.estimate {
    width: 100%;
    padding: min(calc(90 / 1280 * 100vw), 90px) 0 min(calc(60 / 1280 * 100vw), 60px);
    background-color: var(--color-solor-light-green);

    @media only screen and (max-width: 750px) {
        padding: min(calc(60 / 390 * 100vw), 60px) 0 min(calc(60 / 390 * 100vw), 60px);
    }

    .inner-estimate {
        width: min(100%, 1280px);
        margin: 0 auto;

        @media only screen and (max-width: 1512px) and (min-width: 751px) {
            padding-left: min(calc(30 / 1280 * 100vw), 30px);
            padding-right: min(calc(30 / 1280 * 100vw), 30px);
        }

        @media only screen and (max-width: 750px) {
            padding-left: min(calc(20 / 390 * 100vw), 20px);
            padding-right: min(calc(20 / 390 * 100vw), 20px);
        }

        .step-list {
            margin-bottom: min(calc(70 / 1280 * 100vw), 70px);

            ol {
                list-style: none;
                counter-reset: number;
                display: flex;
                justify-content: space-between;
                padding: 0;
                gap: min(calc(100 / 1280 * 100vw), 100px);

                @media only screen and (max-width: 750px) {
                    flex-direction: column;
                    gap: min(calc(20 / 390 * 100vw), 20px);
                }

                li {
                    position: relative;
                    padding: min(calc(46 / 1280 * 100vw), 46px) min(calc(33 / 1280 * 100vw), 33px) min(calc(260 / 1280 * 100vw), 26px);
                    width: min(calc(360 / 1280 * 100vw), 360px);
                    background-color: var(--color-solor-lightest);
                    border: var(--color-solor-orange) solid min(calc(4 / 1280 * 100vw), 4px);
                    border-radius: min(calc(8 / 1280 * 100vw), 8px);
                    text-align: center;
                    box-shadow: 0px min(calc(6 / 390 * 100vw), 6px) min(calc(12 / 390 * 100vw), 12px) 0px rgba(0, 0, 0, 0.1);

                    @media only screen and (max-width: 750px) {
                        width: 100%;
                        padding: min(calc(48 / 390 * 100vw), 48px) min(calc(16 / 390 * 100vw), 16px) min(calc(20 / 390 * 100vw), 20px);
                        border-width: min(calc(6 / 390 * 100vw), 6px);
                        border-radius: min(calc(8 / 390 * 100vw), 8px);
                    }

                    &::before {
                        counter-increment: number;
                        content: counter(number);
                        position: absolute;
                        top: min(calc(-3 / 1280 * 100vw), -3px);
                        left: min(calc(-3 / 1280 * 100vw), -3px);
                        width: min(calc(74 / 1280 * 100vw), 74px);
                        height: min(calc(60 / 1280 * 100vw), 60px);
                        border-radius: min(calc(8 / 1280 * 100vw), 8px) 0;
                        display: flex;
                        justify-content: center;
                        align-items: center;
                        background-color: var(--color-solor-orange);
                        font-size: min(calc(30 / 1280 * 100vw), 3rem);
                        font-weight: 900;
                        color: var(--color-solor-lightest);

                        @media only screen and (max-width: 750px) {
                            top: min(calc(-4 / 390 * 100vw), -4px);
                            left: min(calc(-4 / 390 * 100vw), -4px);
                            width: min(calc(48 / 390 * 100vw), 48px);
                            height: min(calc(48 / 390 * 100vw), 48px);
                            border-radius: min(calc(8 / 390 * 100vw), 8px) 0;
                            font-size: min(calc(24 / 390 * 100vw), 2.4rem);
                            font-weight: 700;
                        }
                    }

                    &::after {
                        position: absolute;
                        top: 50%;
                        right: max(calc(-74 / 1280 * 100vw), -74px);
                        transform: translateY(-50%);
                        content: "";
                        width: min(calc(40 / 1280 * 100vw), 40px);
                        height: min(calc(40 / 1280 * 100vw), 40px);
                        background: url("img/solor/ico_estimate-arrow.svg") center/contain no-repeat;

                        @media only screen and (max-width: 750px) {
                            display: none;
                        }
                    }

                    &:last-of-type {
                        &::after {
                            display: none;
                        }
                    }

                    h3 {
                        margin: 0 0 10px;
                        font-size: min(calc(30 / 1280 * 100vw), 3rem);
                        font-weight: 900;
                        line-height: 1.4;
                        color: var(--color-solor-orange);

                        @media only screen and (max-width: 750px) {
                            font-size: min(calc(24 / 390 * 100vw), 2.4rem);
                            font-weight: 700;
                        }
                    }

                    p {
                        font-size: min(calc(18 / 1280 * 100vw), 1.8rem);
                        font-weight: 700;
                        line-height: 1.4;

                        @media only screen and (max-width: 750px) {
                            font-size: min(calc(16 / 390 * 100vw), 1.6rem);
                        }
                    }
                    .pic-box {
                        margin-top: min(calc(16 / 1280 * 100vw), 16px);

                        @media only screen and (max-width: 750px) {
                            height: min(calc(220 / 390 * 100vw), 220px);
                            overflow: hidden;
                        }

                        img {
                            object-fit: cover;
                            height: min(calc(220 / 390 * 100vw), 220px);
                        }
                    }
                }
            }
        }
    }
}

/* ---------------------------------------
5つの安心
--------------------------------------- */
.pease-mind {
    width: 100%;

    @media only screen and (max-width: 750px) {
        margin-bottom: min(calc(30 / 390 * 100vw), 30px);
    }

    .inner-pease-mind {
        width: min(100%, 1280px);
        margin: 0 auto;
        padding: min(calc(90 / 1280 * 100vw), 90px) 0 min(calc(70 / 1280 * 100vw), 70px);

        @media only screen and (max-width: 750px) {
            padding-left: min(calc(30 / 1280 * 100vw), 30px);
            padding-right: min(calc(30 / 1280 * 100vw), 30px);
        }

        .pease-list {
            ol {
                display: flex;
                flex-direction: column;
                gap: min(calc(45 / 1280 * 100vw), 45px);
                padding: 0;

                @media only screen and (max-width: 750px) {
                    gap: min(calc(45 / 390 * 100vw), 45px);
                }

                li {
                    width: 100%;
                    padding: min(calc(4 / 1280 * 100vw), 4px) min(calc(89 / 1280 * 100vw), 89px) min(calc(30 / 1280 * 100vw), 30px);
                    background-color: var(--color-solor-light-orange);
                    display: flex;
                    justify-content: space-between;
                    gap: min(calc(40 / 1280 * 100vw), 40px);

                    @media only screen and (max-width: 750px) {
                        flex-direction: column;
                        padding: min(calc(20 / 390 * 100vw), 20px) min(calc(30 / 390 * 100vw), 30px);
                    }

                    &:nth-of-type(2n) {
                        flex-direction: row-reverse;

                        @media only screen and (max-width: 750px) {
                            flex-direction: column;
                        }
                    }

                    .txt-box {
                        width: min(calc(600 / 1280 * 100vw), 600px);

                        @media only screen and (max-width: 750px) {
                            width: 100%;
                        }

                        h3 {
                            margin: 0 0 min(calc(20 / 1280 * 100vw), 20px);
                            font-size: min(calc(30 / 1280 * 100vw), 3rem);
                            font-weight: 700;
                            line-height: 1.2;
                            color: var(--color-solor-orange);

                            @media only screen and (max-width: 750px) {
                                font-size: min(calc(24 / 390 * 100vw), 2.4rem);
                                text-align: center;
                                margin-bottom: min(calc(20 / 390 * 100vw), 20px);
                            }

                            span {
                                font-size: min(calc(80 / 1280 * 100vw), 8rem);
                                font-weight: 900;
                                display: block;

                                @media only screen and (max-width: 750px) {
                                    font-size: min(calc(56 / 390 * 100vw), 5.6rem);
                                }
                            }
                        }

                        p {
                            font-size: min(calc(16 / 1280 * 100vw), 1.6rem);
                            font-weight: 400;
                            line-height: 1.95;
                            letter-spacing: 0.18em;

                            @media only screen and (max-width: 750px) {
                                font-size: min(calc(16 / 390 * 100vw), 1.6rem);
                                font-weight: 700;
                            }
                        }
                    }

                    .pic-box {
                        width: min(calc(472 / 1280 * 100vw), 472px);
                        margin-top: min(calc(20 / 1280 * 100vw), 20px);

                        @media only screen and (max-width: 750px) {
                            width: 100%;
                        }
                    }
                }
            }
        }
    }
}

/* ---------------------------------------
1社だけの見積もりは損してるかも!?
--------------------------------------- */
.reason {
    width: min(100%, 1512px);
    margin: 0 auto;

    @media only screen and (max-width: 1512px) and (min-width: 751px) {
        padding-left: min(calc(30 / 1280 * 100vw), 30px);
        padding-right: min(calc(30 / 1280 * 100vw), 30px);
    }

    @media only screen and (max-width: 750px) {
        padding-left: 0;
        padding-right: 0;
    }

    h2 {
        height: min(calc(210 / 1280 * 100vw), 210px);
        margin: 0;
        border-radius: min(calc(40 / 1280 * 100vw), 40px) min(calc(40 / 1280 * 100vw), 40px) 0 0;
        background-color: var(--color-solor-green02); 
        display: flex;
        justify-content: center;
        align-items: center;
        position: relative;

        @media only screen and (max-width: 750px) {
            height: min(calc(102 / 390 * 100vw), 102px);
        }

        &::after {
            position: absolute;
            bottom: -66px;
            left: 50%;
            transform: translateX(-50%) rotate(90deg);
            content: "";
            width: min(calc(49 / 1280 * 100vw), 49px);
            height: min(calc(84 / 1280 * 100vw), 84px);
            clip-path: polygon(0 0, 100% 50%, 0 100%);
            background-color: var(--color-solor-green02);

            @media only screen and (max-width: 750px) {
                bottom: max(calc(-52 / 390 * 100vw), -52px);
                width: min(calc(24 / 390 * 100vw), 24px);
                height: min(calc(84 / 390 * 100vw), 84px);
            }
        }

        img {
            width: min(calc(875 / 1280 * 100vw), 875px);

            @media only screen and (max-width: 750px) {
                width: min(calc(350 / 390 * 100vw), 350px);
            }
        }
    }

    .inner-reason {
        width: min(100%, 1512px);
        margin: 0 auto;
        padding-top: min(calc(80 / 1280 * 100vw), 80px);
        padding-bottom: min(calc(90 / 1280 * 100vw), 90px);
        background-color: var(--color-solor-light-green);

        @media only screen and (max-width: 1512px) and (min-width: 751px) {
            padding-left: min(calc(30 / 1280 * 100vw), 30px);
            padding-right: min(calc(30 / 1280 * 100vw), 30px);
        }

        @media only screen and (max-width: 750px) {
            padding: min(calc(56 / 390 * 100vw), 56px) min(calc(20 / 390 * 100vw), 20px) min(calc(48 / 390 * 100vw), 48px);
        }

        h3 {
            margin: 0 auto min(calc(50 / 1280 * 100vw), 50px);
            line-height: 1.8;
            width: min(calc(770 / 1280 * 100vw), 770px);
            text-align: center;

            @media only screen and (max-width: 750px) {
                width: 100%;
                margin-bottom: min(calc(40 / 390 * 100vw), 40px);
            }

            span {
                font-size: min(calc(43 / 1280 * 100vw), 4.3rem);
                font-weight: 700;
                letter-spacing: 0.08em;
                margin-top: min(calc(10 / 1280 * 100vw), 10px);
                display: inline-block;
                background:linear-gradient(transparent 50%, var(--color-solor-marker) 50%);

                @media only screen and (max-width: 750px) {
                    font-size: min(calc(20 / 390 * 100vw), 2.0rem);
                    margin-top: min(calc(20 / 390 * 100vw), 20px);
                }
            }
        }

        .reason-list {
            display: flex;
            justify-content: space-between;
            gap: min(calc(40 / 1280 * 100vw), 40px);
            width: min(100%, 1280px);
            margin: 0 auto min(calc(40 / 1280 * 100vw), 40px);

            @media only screen and (max-width: 750px) {
                flex-direction: column;
                gap: min(calc(20 / 390 * 100vw), 20px);
                margin-bottom: min(calc(30 / 390 * 100vw), 30px);
            }

            li {
                width: 100%;
                background-color: var(--color-solor-lightest);
                border: var(--color-solor-green) solid min(calc(5 / 1280 * 100vw), 5px);
                border-radius: min(calc(32 / 1280 * 100vw), 32px);
                padding: min(calc(100 / 1280 * 100vw), 100px) min(calc(30 / 1280 * 100vw), 30px) min(calc(20 / 1280 * 100vw), 20px); 
                text-align: center;

                @media only screen and (max-width: 750px) {
                    border-width: min(calc(5 / 390 * 100vw), 5px);
                    border-radius: min(calc(32 / 390 * 100vw), 32px);
                    min-height: min(calc(198 / 390 * 100vw), 198px);
                    padding: min(calc(100 / 390 * 100vw), 100px) min(calc(30 / 390 * 100vw), 30px) min(calc(20 / 390 * 100vw), 20px);
                    display: flex;
                    justify-content: center;
                    align-items: center;
                }

                span {
                    display: inline-block;
                    font-size: min(calc(28 / 1280 * 100vw), 2.8rem);
                    font-weight: 700;
                    line-height: 1.3;
                    letter-spacing: 0.02em;
                    position: relative;

                    @media only screen and (max-width: 750px) {
                        font-size: min(calc(24 / 390 * 100vw), 2.4rem);
                    }

                    &::before {
                        position: absolute;
                        top: max(calc(-80 / 1280 * 100vw), -80px);
                        left: 50%;
                        transform: translateX(-50%);
                        content: "";
                        width: min(calc(60 / 1280 * 100vw), 60px);
                        height: min(calc(60 / 1280 * 100vw), 60px);
                        background: url("img/solor/ico_check.svg") center/contain no-repeat;

                        @media only screen and (max-width: 750px) {
                            top: max(calc(-70 / 390 * 100vw), -80px);
                            width: min(calc(60 / 390 * 100vw), 60px);
                            height: min(calc(60 / 390 * 100vw), 60px);
                        }
                    }
                }
            }
        }

        .special-price {
            font-size: min(calc(43 / 1280 * 100vw), 4.3rem);
            font-weight: 700;
            line-height: 1.7;
            letter-spacing: 0.08em;
            text-align: center;
            margin-bottom: min(calc(190 / 1280 * 100vw), 190px);
            position: relative;
            left: 50%;
            transform: translateX(-50%);

            @media only screen and (max-width: 750px) {
                font-size: min(calc(32 / 390 * 100vw), 3.2rem);
                margin-bottom: min(calc(180 / 390 * 100vw), 180px);
                display: block;
                line-height: 1.4;
            }

            &::before {
                position: absolute;
                top: 96%;
                right: calc(50% - min(calc(580 / 1280 * 100vw), 620px));
                transform: translateY(-50%);
                content: "";
                width: min(calc(220 / 1280 * 100vw), 249px);
                height: min(calc(250 / 1280 * 100vw), 250px);
                background: url("img/solor/pic_reason.svg") center/contain no-repeat;

                @media only screen and (max-width: 750px) {
                    width: min(calc(138 / 390 * 100vw), 138px);
                    height: min(calc(139 / 390 * 100vw), 139px);
                    top: auto;
                    bottom: min(calc(-245 / 390 * 100vw), -245px);
                    right: min(calc(-20 / 390 * 100vw), -20px);
                    z-index: -1;
                }
            }

            &::after {
                position: absolute;
                bottom: max(calc(-160 / 1280 * 100vw), -160px);
                left: 50%;
                transform: translateX(-50%);
                content: "";
                width: min(calc(292 / 1280 * 100vw), 292px);
                height: min(calc(123 / 1280 * 100vw), 123px);
                background: url("img/solor/ico_reason_flow.svg") center/contain no-repeat;

                @media only screen and (max-width: 750px) {
                    bottom: max(calc(-120 / 390 * 100vw), -120px);
                    width: min(calc(180 / 390 * 100vw), 180px);
                    height: min(calc(76 / 390 * 100vw), 76px);
                }
            }

            .impact1 {
                font-size: min(calc(49 / 1280 * 100vw), 4.9rem);
                letter-spacing: 0.01em;
                margin-bottom: min(calc(20 / 1280 * 100vw), 20px);
                display: inline-block;
                background:linear-gradient(transparent 50%, var(--color-solor-marker) 50%);

                @media only screen and (max-width: 750px) {
                    font-size: min(calc(32 / 390 * 100vw), 3.2rem);
                    line-height: 1.4;
                    background: none;
                    letter-spacing: 0.06em;
                }

                span {
                    @media only screen and (max-width: 750px) {
                        display: inline;
                        background:linear-gradient(transparent 50%, var(--color-solor-marker) 50%);
                    }
                }
            }

            .impact2 {
                display: inline-block;
                margin-bottom: min(calc(10 / 1280 * 100vw), 10px);

                @media only screen and (max-width: 750px) {
                    margin-top: min(calc(26 / 390 * 100vw), 26px);
                    margin-bottom: min(calc(10 / 390 * 100vw), 10px);
                    width: min(calc(260 / 390 * 100vw), 260px);
                }
            }
            .marker {
                display: inline-block;
                background:linear-gradient(transparent 50%, var(--color-solor-marker) 50%);
            }
        }
    }
}

/* ---------------------------------------
フッター
--------------------------------------- */
footer {
    .footer-bottom-content {
        width: 100%;
        background-color: var(--color-solor-orange);
        padding: min(calc(20 / 1280 * 100vw), 20px) 0;

        .inner-footer {
            width: min(calc(1000 / 1280 * 100vw), 1000px);
            margin: 0 auto;

            @media only screen and (max-width: 750px) {
                width: 100%;
                padding: calc(40 / 390 * 100vw);
            }

            nav {
                ul {
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    gap: min(calc(50 / 1280 * 100vw), 50px);

                    @media only screen and (max-width: 750px) {
                        flex-direction: column;
                        align-items: flex-start;
                        gap: min(calc(24 / 390 * 100vw), 24px);
                        margin-bottom: min(calc(34 / 390 * 100vw), 34px);
                    }

                    li {
                        display: flex;
                        align-items: center;

                        a {
                            font-size: min(calc(14 / 1280 * 100vw), 1.4rem);
                            color: var(--color-solor-lightest);
                            position: relative;

                            @media only screen and (max-width: 750px) {
                                font-size: min(calc(14 / 390 * 100vw), 1.4rem);
                            }

                            &:after {
                                position: absolute;
                                top: 50%;
                                right: max(calc(-25 / 1280 * 100vw), -25px);
                                transform: translateY(-50%);
                                content: "/";
                                font-size: min(calc(14.4 / 1280 * 100vw), 1.44rem);
                                color: var(--color-solor-lightest);

                                @media only screen and (max-width: 750px) {
                                    display: none;
                                }
                            }
                        }

                        &:last-of-type {
                            a::after {
                                content: "";
                            }
                        }
                    }
                }
            }

            .copyright {
                p {
                    font-size: min(calc(12 / 1280 * 100vw), 1.2rem);
                    font-weight: 700;
                    font-family: var(--font-meiryo);
                    color: var(--color-solor-lightest);
                    text-align: center;
                    margin-top: min(calc(16 / 1280 * 100vw), 16px);

                    @media only screen and (max-width: 750px) {
                        font-size: min(calc(11 / 390 * 100vw), 1.1rem);
                    }
                }
            }
        }
    }
}

/*============================================================
コンタクトフォーム-スマホ
==============================================================*/

	.form {
    max-width: 100%;
    display: inline-block;
}
    .form__item {
        display: block;
    }
    .form__term {
    width: 46%;
}
.form__term.is-required {
    font-weight: bold;
    margin-top: 2em;
    margin-bottom: 0.5em;
}
   /* .wpcf7{
        padding-bottom: 2em;
    } */
/*
	label{
        display: block;
    text-align: left;
    margin: 0.5em 0;
    }
*/
  .form__term {
    width: 100%;
}  
  .form__desc {
    width: 100%;
}
    .form * {
    box-sizing: border-box;
        margin: 0;
    }
/*
	.wrap-contact {
    padding: 1em;
    background: #fff;
      text-align: center;
}  
*/    
    .form__term.is-required {
    font-weight: bold;
    margin-top: 0;
    margin-bottom: 0.5em;
    text-align: center;
      font-size: 17px;
}
    
.form__desc select{
    width: 100%;
    text-align: center;
        padding: 2em 0;
}
.form__term.is-required {
    font-weight: bold;
    margin-top: 0;
    margin-bottom: 0.5em;
    text-align: center;
    font-size: 17px;
}
    .menu-footer{
        padding: 0;
    }
.bottom-link>div:first-child {
    margin-right: 0;
}
    .bottom-link>div{
        padding: 1em 0;
        text-align: center;
    }
.bottom-link a {
    text-align: center;
}
.bottom-link>div {
    padding: 0;
    }
    
.copy {
    font-size: 0.5rem;
}
    .content2 .tac,.content-point p,.hojokin p{
        text-align: left;
    }
    section.content2 h3 {
        text-align: center;
    }

}
@media screen and (max-width: 767px) {
	
	.white{
		position:absolute;
		top:50%;
		right:2px;
		transform:translateY(-50%);
	}
	.contact-box .contact-btn {
justify-content:space-between;
}
}

@media screen and (max-width: 450px) {
		#logo{
		width:55%;
	}
	/* #logo .logo__link {
    flex-direction: column;
} */
}

@media screen and (max-width: 350px) {
	.contact-box .contact-btn {
    padding-left: 1em;
	padding-right :1em;
		min-width:220px;
		display:flex;
		justify-content:space-between;
}
.contact-box .contact-btn .muryo {
    font-size: .9rem;
}
	
.contact-box .contact-btn .muryo {
    width: 45px;
    height: 45px;
}
	.contact-box .contact-btn .txt {
    font-size: .8rem;
}
	.contact-box .contact-btn .txt span {
    font-size: 0.7rem;
 }
	.contact-box .contact-btn .mitumori {
    font-size: .7rem;
}
	.contact-box .contact-btn .txt .red {
    font-size: .8rem;
}
	.white {
    font-size: .6rem;
		margin-top:.1rem;
}
}


/*****************************   from keyframes.css    ******************************/
@keyframes  hidden-anm {
	0% {
		opacity:1;
	}
	100% {
		opacity:0;
	}
}

@keyframes  show-anm {
	0% {
		opacity:0;
	}
	100% {
		opacity:1;
	}
}

/***** from CSSエディッタ　******/
.is-hidden {
  visibility:hidden;
  animation-name: hidden-anm;
	animation-duration: 0.5s;
	animation-fill-mode: forwards;
}

.is-show {
  animation-name: show-anm;
	animation-duration: 0.5s;	
	animation-fill-mode: forwards;
}

/*****************  from style.css ****************************************/
/************************************
** footer-contents
************************************/

@media screen and (max-width: 600px) {

 /* 2023.6 追記　※footerを表示できるように修正 */	
  .footer-bottom {
/*     display: none; */
  }
	
/*
	.footer{
	height: 200px;
	margin-bottom: 80px;
	}
*/
		
  #mobile-footer-custom-button {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 100;
    margin-bottom: 0;
	opacity: 0;
	transition: 0.7s;
	padding: 0;
  }

  .flowting-box {
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .flowting-box div {
    text-decoration: none;
    color: #ffffff;
  }

  .flowting-box div i {
    padding: 0.5em;
  }

  .flowting-box .left {
    width: 100%;
    padding: 5px;
    text-align: center;
    background: rgb(255 255 255 / 70%);
  }

  .flowting-box .right {
    width: 50%;
    padding: 5px;
    text-align: center;
    background: rgb(255 255 255 / 70%);
  }

}

/************************************
** トップへ戻るボタン
************************************/

.go-to-top-button {
  width: 60px;
  height: 60px;
  border-radius: 0px;
  font-size: 30px;
}

/************************************
** contact 
************************************/

/* from cocoon-master/skins/silk/style.css */
.article h3 {
	padding: 0.2em 0.5em;
	font-size: 1.25em;
	border-width: 0 0 0 5px;
	border-style: solid;
	border-color: #ffcc54;
	margin-bottom: 1.62em;
}

    @media only screen and (max-width: 750px) {
#cf_step2 h3{
    /* margin-top: 1.8em; */
}
    }

/* from cocoon-master/skins/silk/style.css */
/*
.contact-step * {
	padding: 0;
    margin: 0;
    box-sizing: border-box;
    word-wrap: break-word;
    overflow-wrap: break-word;
}
*/

#cf_step2 .cf_step2__heading-lv3{
    /* margin-top: 3.6em; */
    color:#ffffff;
    background-color:#f0882d;
}
#cf_step2 .cf_step2__pra{
    /* font-size: 18px; */
    font-size: 20px;
    color: #ff0000;
    text-align: center;
    margin-top: 1.5rem;
    font-weight: bold;
}


    @media only screen and (max-width: 750px) {

#cf_step2 .cf_step2__pra{
    font-size: 14px;
    margin-top: .7rem;
}
    }

    .zip-address{
    white-space: nowrap;
    margin-right: 10px;
    position: relative;
    top: 5px;
    }
    .input-address{
        width: 100%;
    }


.article h3 {
	line-height: 1.25;
}
.contact-step {
	padding: 0;
	margin: 0;
	width: 100%;
	height: 100%;
	background: transparent;
	z-index: 0;
    padding: 20px 29px;
	border: 1px solid transparent;
	/* border-radius: 4px; */
    position: relative;
    box-sizing: border-box;
    overflow-wrap: break-word;
    display: block;
    line-height: 1.8;
}
@media screen and (max-width: 890px) {
	.contact-step {
		padding: 16px;
	}
}
.contact-step form{
	padding: 0;
	margin: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M0 0h12v12H0V0z' fill='%23fafafa'/%3E%3Cpath d='M0 0h1v12H0V0zm0 0v1h12V0H0z' fill='%23c8c8c8' fill-opacity='0.3'/%3E%3C/svg%3E");
    /* background: #FFFBEC; */
}

.contact-step .wrap-contact{
	padding: 0;
    /* background: #fff; */
}

.qs_submit__pra{
    font-size: 13px;
    color: #008A3F;
    margin-bottom: 20px;
}
.qs_submit__link{
    text-decoration: underline;
    color: #008A3F!important;

}
.qs_submit__link:link{
    color: #008A3F;
}


/* from cocoon-master/style.css */
.contact-step table{
	/* margin-bottom: 1.8em; */
    /* margin-bottom: 3.6em; */
    margin-bottom: 60px;
	max-width: 100%;
	width: 100%;
	border-collapse: collapse;
	border-spacing: 0;
}
    @media only screen and (max-width: 750px) {
.contact-step table{
    margin-bottom: 30px;
}
    }

.contact-step select{
	background: rgba(255,255,255,.8);
	border-radius: 2px;
	border-width: 2px;
	border-color: rgba(153, 153, 153, 0.4);
	padding: 11px;
	width: 100%;
	margin: 0;
	font-size: 18px
}

.contact-step th,td {
	padding: 12px 6px;
}
.contact-step table p {
	/* margin-bottom: 1.8em;*/
	margin: 0 0 1.8em 0;

}


.contact-step input.wpcf7-form-control {
	background: rgba(255,255,255,.8);
	border-radius: 2px;
	border-width: 2px;
	border-color: rgba(153, 153, 153, 0.4);
	padding: 11px;
	font-size: 18px;
	box-sizing: border-box;
	width: 100%;
	margin: 0;
}

.contact-step table textarea {
    background: rgba(255,255,255,.8);
	border-radius: 2px;
    border-width: 2px;
    border-color: rgba(153, 153, 153, 0.4);
    padding: 11px;
    font-size: 20px;
	box-sizing: border-box;
    width: 100%;
}
/*****************************************************/
.inquiry tbody{

}


.inquiry th {
  text-align: left;
  font-size: 20px;
  color: #444;
  padding-right: 5px;
  width: 30%;
/*   background: #f7f7f7; */
	/* background:#ebf8ef;
  border: solid 1px #d7d7d7; */
}
.inquiry th.baseline{
    vertical-align: baseline;
}

.inquiry td {
  font-size: 20px;
  /* border: solid 1px #d7d7d7; */
}

.haveto {
  font-size: 13px;
  padding: 3px 5px;
  /* background: #ff9393; */
  background: #BC2800;
  color: #fff;
  border-radius: 2px;
  margin-right: 5px;
  /* position: relative; */
  bottom: 4px;
}
.entered {
  font-size: 13px;
  padding: 5px;
  /* background: #ff9393; */
  background: #30b76d;
  color: #fff;
  border-radius: 2px;
  margin-right: 5px;
  position: relative;
  bottom: 4px;
}

.any {
  font-size: 13px;
  padding: 5px;
  background: #93c9ff;
  color: #fff;
  border-radius: 2px;
  margin-right: 5px;
  position: relative;
  bottom: 4px;
}

#formbtn {
    display: block;
    padding: 1em 0;
    margin-top: 0;
    width: 80%;
    background: #ffaa56;
    color: #fff;
    font-size: 22px;
    font-weight: bold;
    border-radius: 25px;
    border: none;
    margin-bottom: 40px;
    cursor: pointer;
    transition: all 0.2s ease;
    transform: translateY(0);
    box-shadow: 0 4px 8px rgba(255, 170, 86, 0.3);
}
#formbtn:hover {
    background: #ffc994;
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 6px 12px rgba(255, 170, 86, 0.4);
}
#formbtn:active {
    transform: translateY(1px);
    box-shadow: 0 2px 4px rgba(255, 170, 86, 0.3);
}

        @media only screen and (max-width: 750px) {
#formbtn {
    margin-bottom: 0px;
}
        }

/* add 20231207 */
#formbtn2 {
    display: block;
    padding: 1em 0;
    margin-top: 0;
    width: 80%;
    background: #ffaa56;
    color: #fff;
    font-size: 22px;
    font-weight: bold;
    border-radius: 25px;
    border: none;
    margin-bottom: 40px;
    cursor: pointer;
    transition: all 0.2s ease;
    transform: translateY(0);
    box-shadow: 0 4px 8px rgba(255, 170, 86, 0.3);
}
#formbtn2:hover {
  background: #ffc994;
  color: #fff;
}

#formbtn2:active {
    transform: translateY(1px);
    box-shadow: 0 2px 4px rgba(255, 170, 86, 0.3);
}

    @media only screen and (max-width: 750px) {
#formbtn2 {
  margin-bottom: 0px;
}
    }

/* add 20231207 コンタクトフォームの逐次表示用 */
.cf_hidden {
	display: none;
}

.how-to-mitsumori {
  /* display: flex; */
  margin-bottom: 10px;
}

.how-to-mitsumori .box-left {
  /* width: 23%; */
}

.how-to-mitsumori .box-right {
  /* width: 77%; */
	font-size: .9em;
	padding: 0 1em;
}

.white{
	font-size:.8rem;
}

@media screen and (max-width: 600px) {
  .inquiry th {
    width: 100%;
    font-size: 18px;
  }

  .inquiry tr {
    display: flex;
    flex-wrap: wrap;
  }

  .inquiry td {
    width: 100%;
    font-size: 18px;
  }

  .how-to-mitsumori {
    display: block;
  }

  .how-to-mitsumori .box-left, 
  .how-to-mitsumori .box-right {
       /* width: 100%; */
  }

}

/* front-page content-contact */
.content-contact .wrap {
	max-width: 1024px;
}

.box-container{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	font-weight: bold;
}

.form-box form .box-1,
.form-box form .box-2 {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;	
}


@media screen and (max-width: 600px) {
	.form-box form .box-1 {
		margin: 0.5em;
		width 100%;
	}   
	.form-box form .box-2 {
		margin: 0.5em;
		width 100%
	} 	
}
@media screen and (min-width:600px) and ( max-width:890px) {
	.form-box form .box-1 {
		margin: 0.5em;
		width 100%;
	}   
	.form-box form .box-2 {
		margin: 0.5em;
		width 100%
	} 	
}
@media screen and (min-width:890px) {
	.form-box form .box-1 {
		margin: 0.5em 1em 0.5em auto;
	}   
	.form-box form .box-2 {
		margin: 0.5em 1em 0.5em 0;
	} 
}


.box-1 p,
.box-2 p {
	vertical-align:middle;
	margin: 0;
	font-size: 1.1rem;
/*
	text-align: left;
  width: 90%;
  font-size: 22px;
  padding: 0;
*/
}
.box-1 p {

	margin: 0 8px 0 0;
	text-align: right;
	vertical-align: middle;

/*
	text-align: left;
  width: 90%;

  padding: 0;
*/
}
.box-2 p {
	margin: 0 8px 0 0;

/*
	text-align: left;
  width: 90%;
  padding: 0;
*/
}

.box-1 select,
.box-2 input {
	margin: 0;
	font-size: 18px;
	
 /*
	margin-bottom: 10px;
  width: 90%;
  padding: 11px;
  font-size: 16px;
  border-radius: 3px;
  border: 2px solid #ddd;
*/
}

.box-button {
	margin: 30px 0 0 0;
}

.box-button button#btn {
	background-color: #fff;
	border-width: 0px;
}

/*
.form-box form .box-1::before,
.form-box form .box-2::before {
  content: '';
  top: 0;
  height: 0px;
  width: 0;
  border-top: 60px solid transparent;
  border-bottom: 60px solid transparent;
  position: absolute;
  right: -39px;
  border-left: 40px solid #eafff8;
  z-index: 11;
}

.form-box form .box-1::after,
.form-box form .box-2::after {
  content: '';
  top: 0;
  height: 0px;
  width: 0;
  border-top: 60px solid transparent;
  border-bottom: 61px solid transparent;
  position:
    absolute;
  right: -40px;
  border-left: 40px solid #ddd;
  z-index: 10;
}
*/

/*** for thanks-page ***/
.content-thx {
    width: 70%;
    margin: 70px auto;
    padding: 20px;
    padding-bottom: 0;
	max-width: 1280px;
}
@media screen and (max-width: 600px) {
.content-thx {
    width: 90%;
    margin: 50px auto;
    padding: 10px;
}
}

/*** for contact-form ***/
/*
@media screen and (max-width: 480px) {
    #mobile-footer-custom-button {
        display: none;
    }
    .level-2 {
    display: none;
    }
}
*/
/*** 問い合わせの最大幅を指定 ***/
.contact-step {
	max-width: 1200px;
	margin: 0 auto;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M0 0h12v12H0V0z' fill='%23fafafa'/%3E%3Cpath d='M0 0h1v12H0V0zm0 0v1h12V0H0z' fill='%23c8c8c8' fill-opacity='0.3'/%3E%3C/svg%3E");

    /* background: #FFFBEC; */
}

/** スマホ横 **/

@media (orientation: landscape) {
/* 	section.fv .txt4{
		left:7rem;
	} */
}

/** 追加 **/
#countermeasures{
    box-sizing: border-box;
}

#countermeasures .p-countermeasures{
    position: relative;
    display: flex;
    align-items: end;

}
        @media screen and (max-width:1200px) {
            #countermeasures .p-countermeasures{
                flex-direction: column-reverse;
                align-items: center;
}
    }

    @media screen and (max-width:1200px) {
#countermeasures .p-countermeasures__txt{
    width: 90%;
}
    }


#countermeasures .p-countermeasures__img{
    width: 30%;
}
    @media screen and (max-width:1200px) {
    #countermeasures .p-countermeasures__img{
    width: auto;
}
    }

#countermeasures .p-countermeasures__img img{
    width: 100%;
    margin: 0;
}
    @media screen and (max-width:1200px) {
#countermeasures .p-countermeasures__img img{
 width: 500px;
}
    }

.min684{
    min-width: 684px;
}
    @media screen and (max-width:1199px) {
.min684{
    min-width: auto;
    width: 100%;
}

    }

/** 仮 **/
.wrap img.sample{
    width: 900px;
}

/**

共通

**/

.inner{
    max-width: 1000px;
    margin: 0 auto;
}
.heading-lv2{
  position: relative;
  text-align: center;
  font-size: 2.5rem;
  letter-spacing: 2px;
}
    @media only screen and (max-width: 750px) {
.heading-lv2{
  font-size: 1.3rem;
}

    }

.heading-lv2::before {
    background-color: #36A34D;
    bottom: -10px;
    content: "";
    height: 2px;
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    width: 180px;
}
.heading-lv3 {
    margin: 0;
  position: relative;
  text-align: center;
  font-size: 1.5rem;
}

    @media only screen and (max-width: 750px) {
.heading-lv3 {
  font-size: 1.1rem;
}

    }

    .marker {
    background: linear-gradient(transparent 60%, rgb(255, 224, 11) 50%);
    display: inline;
    background-repeat: no-repeat;
}
.orange-gra{
    font-size: 3.125rem;
    background:linear-gradient(0deg, #f75720, #ff891d);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    position: relative;
    z-index: 1;
}
/* .orange-gra::before{
    content: "太陽光発電";
    position: absolute;
    -webkit-text-stroke: 4px #fff;
    z-index: -1;

} */
.orange-gra span {
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    -webkit-text-stroke: 5px #fff;
    z-index: -1;
}
    @media only screen and (max-width: 750px) {
        .orange-gra{
         display: inline;
    line-height: 1.3;
    font-size: 1.9rem;
        }
    }

/** 

introduction

**/
.introduction,.introduction h2,.introduction h3,.introduction p{
    margin: 0 auto;
    padding: 0;
}

.introduction{
    padding:5rem 20px;
}


.p-introduction__content {
}
.p-introduction__txt {
    margin-top: 2rem;
    text-align: left;
}
.orange {
  color:#ff6502;
}
.orange-underline {
  border-bottom: 1px solid #ff6502;
}

.black-underline {
  border-bottom: 1px solid #000;
}

.p-introduction__heading-lv3{
    display: inline-block;

}

.p-introduction__heading-lv3::before,.p-introduction__heading-lv3::after {
    content: ""; 
    position: absolute;
    width: 20px;
    height: 20px;
    top: 50%;
    background-image:url(img/i-arrow-double.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100%;
}

.p-introduction__heading-lv3::before {
        left: -25px;
        transform: translateY(-50%);
}
.p-introduction__heading-lv3::after {
    right: -25px;
  transform: translateY(-50%) rotate(180deg);
}
.p-introduction__content-caution{
  background-color: #ebebeb;
  border-radius: 50px;
  margin-top: 7rem;
  padding: 4rem 3rem;
  position: relative;
  max-width: 1280px;
  width: 80%;
  margin-left: auto;
  margin-right: auto;
text-align: center;
}

.p-introduction__content-caution br{
    display: none;
}
    @media only screen and (max-width: 750px) {
        .p-introduction__content-caution br{
    display: block;
}

    }
.p-introduction__content-caution::before{
  content: "";
  position: absolute;
  top: -10px;
  left: 20px;
  width: 134px;
  height: 55px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
  transform: translateX(-50%) rotate(-15deg);
}

    @media only screen and (max-width: 750px) {

         .p-introduction__content-caution::before{
            width: 120px;
            top: -25px;
            left: 40px;
} 


    }
.p-introduction__content-caution::before{
    background-image:url(img/i-caution.png);
}
/* .p-introduction__content-caution::after{
    background-image:url(img/i-caution.png);
} */


.p-introduction__content-caution h3,.p-introduction__content-caution p{
 max-width: 720px;
 margin: 0 auto;
}
    @media only screen and (max-width: 750px) {
.p-introduction__content-caution h3,.p-introduction__content-caution p{
 max-width: 520px;

}
    }

.p-introduction__content-caution p{
padding: 0 2rem;

 letter-spacing: .1em;

}

    @media only screen and (max-width: 750px) {
.p-introduction__content-caution p{
padding: 0;

}
    }


/* ---------------------------------------
フォーム タブ
--------------------------------------- */
.tab-wrap {
    width: min(calc(1000 / 1280 * 100vw), 1000px);
    margin: 0 auto min(calc(40 / 1280 * 100vw), 40px);

    @media only screen and (max-width: 750px) {
        width: min(calc(350 / 390 * 100vw), 350px);
        margin: 0 auto min(calc(20 / 390 * 100vw), 20px);
    }
}
#tab01,
#tab02 {
  position: relative;
}

.tab {
    background: var(--color-solor-lightest);

    ul {
        padding-inline-start: 0px;
    }

    p {
        display: block;
        margin-block-start: 0em;
        margin-block-end: 0em;
        margin-inline-start: 0px;
        margin-inline-end: 0px;
    }

    button {
        background: #fff;
        border: none;
        cursor: pointer;
    }

    input[type="text" i] {
        padding-block: 0px;
        padding-inline: 0px;
        margin-bottom: 10px;
        width: 250px;
        padding: 13px;
        font-size: 15px;
        border-radius: 3px;
        border: 1px solid #707070;
        position: relative;
        bottom: 4px;
        margin-left: 6px;

        @media only screen and (max-width: 750px) {
            margin-bottom: 0px;
            padding: 5px;
        }
    }

    .red {
        font-size: 13px;

        @media only screen and (max-width: 750px) {
            font-size: 12px;
        }
    }

    .orange {
        font-size: 28px;
    }

    input[type="checkbox"] {
        accent-color: #dd7a23;
        transform: scale(1.5);
    }

    label {
        font-size: 18px;
        
        @media only screen and (max-width: 750px) {
            font-size: 14px;
        }
    }

    .tab__menu {
        display: flex;
        justify-content: center;
        margin-block-start: 0;
        margin-block-end: 0;

        .tab__menu-item {
            list-style: none;
            width: 100%;
            height: min(calc(70 / 1280 * 100vw), 70px);
            background-color: #F7F7F7;
            text-align: center;
            cursor: pointer;
            color: rgba(51, 51, 51, 30%);
            display: flex;
            align-items: center;
            justify-content: center;

            @media only screen and (max-width: 750px) {
                height: min(calc(70 / 390 * 100vw), 70px);
            }

            p {
                font-size: min(calc(32 / 1280 * 100vw), 3.2rem);
                font-weight: 700;
                line-height: 1;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                letter-spacing: 0.15em;

                @media only screen and (max-width: 750px) {
                    font-size: min(calc(24 / 390 * 100vw), 2.4rem);
                    flex-direction: column;
                    gap: min(calc(10 / 390 * 100vw), 10px);
                    letter-spacing: 0.1em;
                }

                small {
                    font-size: min(calc(20 / 1280 * 100vw), 2.0rem);

                    @media only screen and (max-width: 750px) {
                        font-size: min(calc(12 / 390 * 100vw), 1.2rem);
                    }
                }
            }
        }

        .tab01, .tab02 {
            color: var(--color-solor-brown);
            background-color: var(--color-solor-light-orange);

            &.is-active {
                color: var(--color-solor-lightest);
                background-color: var(--color-solor-orange);
            }
        }

        .tab01 {
            width: min(calc(700 / 1280 * 100vw), 700px);

            @media only screen and (max-width: 750px) {
                width: 50%;
            }
        }
        .tab02 {
            width: min(calc(300 / 1280 * 100vw), 300px);

            @media only screen and (max-width: 750px) {
                width: 50%;
            }
        }
    }

    .tab__content {
        margin-block-start: 0;
        margin-block-end: 0;

        .tab__content-item {
            padding: 25px;
            display: none;
            background-color: #fff;
            border: var(--color-solor-orange) solid min(calc(6 / 1280 * 100vw), 6px);

            @media only screen and (max-width: 750px) {
                border-width: min(calc(4 / 390 * 100vw), 4px);
            }

            &.is-active {
                display: block;
            }
        }

        .form__thumb {
            display: flex;
        }
    }
}

@media only screen and (max-width: 750px) {
  .form__img {
    display: none;
  }
}

.form__txt {
  text-align: left;
  margin-left: 30px;
}

@media only screen and (max-width: 750px) {
  .form__txt {
    margin-left: 0px;
    font-size: 16px;
  }
  .form__txt span.tab02-red {
    display: block;
    margin: 0 auto;
    font-size: 12px;
    margin-top: 10px;
  }
}

.form__flexbox {
  display: flex;
}

@media only screen and (max-width: 750px) {
  .form__flexbox {
    flex-direction: column;
  }
}

.form__checkbox {
  margin-left: 20px;
  margin-top: 7px;
}

@media only screen and (max-width: 750px) {
  .form__checkbox {
    margin-left: 0px;
    margin-top: 0;
  }
}

/* #tab02 p {
  font-size: 24px;
  color: #2F70BA;
  line-height: 1.5;
} */

@media only screen and (max-width: 750px) {
  #tab02 p {
    font-size: 13px;
  }
}

/* #tab02 span {
  font-size: 18px;
  color: #fff;
  background-color: #BC2701;
  border-radius: 10px;
  padding: 10px 10px;
  line-height: 1;
  display: inline-block;
  margin-bottom: 15px;
} */

@media only screen and (max-width: 750px) {
  #tab02 span {
    font-size: 15px;
  }
}


/** サンクスページ **/
.thanks {
}
.inner {
}
.thanks__thumb {
  display: flex;
}

    @media only screen and (max-width: 750px) {
.thanks__thumb {
  flex-direction: column;
}
    }
.thanks__lead {
}
.thanks__heading-lv2 {
  font-size: 35px;
}

    @media only screen and (max-width: 750px) {
.thanks__heading-lv2 {
  font-size: 25px;
}
    }
.thanks__lead-txt {
}
.thanks__img {
    height: inherit;
    width: 30%;
    margin-left: 100px;
}
    @media only screen and (max-width: 750px) {
.thanks__img {
    width: 200px;
    margin: 0 auto;
    margin-top: 20px;
}
    }

.thanks__txt {
  text-align: center;
  margin-top: 100px;
}

    @media only screen and (max-width: 750px) {
.thanks__txt {
margin-top: 0;
}
    }
.thanks__heading-lv3 {
    font-size: 25px;
}
    @media only screen and (max-width: 750px) {
.thanks__heading-lv3 {
    font-size: 20px;
}
    }
.thanks__pra {
}

/* add 20240713 google隠し文字用 */
.google_hidden {
	display: none;
}

/**

会社概要

**/

.heading__ttl {
  height: 430px;
  text-align: center;
}
.heading__ttl._company {
    background: url(img/img-new17.jpg) no-repeat;
    background-position: center;
    background-size: cover;
}
.heading__ttl._policy {
      background: url(img/img-new16.jpg) no-repeat;
      background-position: center;
      background-size: cover;
}
.heading__ttl h2{
    font-size: 36px;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgba(255,255,255,0.6);
}
.company__wrap {
  padding-top: 70px;
  padding-bottom: 70px;
}
.company__content {
  display: flex;
  justify-content: space-between;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
  @media screen and (max-width:768px) {
    flex-direction: column;

}
}
.company__content div{
  width: calc((100% - 20px)/2);
  @media screen and (max-width:768px) {
    width: 100%;
}
}
.company__map {

}
.company__map iframe{
    width: 100%;
}
.company__detail {
}
.company__detail h3{
    position: relative;
    margin: 0;
    font-size: 1.5em;
    font-weight: 500;
    background: transparent;
    border-width: 0 0 4px 0;
    border-style: solid;
    border-color: rgba(204, 204, 204, 0.4);
    border-radius: 0;
}

.company__detail h3::after{
  background: #F0882D;
    position: absolute;
    content: "";
    width: 20%;
    height: 4px;
    left: 0;
    bottom: -4px;
}

.company__detail table{
    border-top: 1px solid rgba(204, 204, 204, 0.8);
    border-left: 1px solid rgba(204, 204, 204, 0.8);
    border-right: 1px solid rgba(204, 204, 204, 0.8);
    width: 100%;
    margin-top: 30px;
}

.company__detail th{
    background:rgba(204, 204, 204, 0.15);
    width: 30%;
    font-weight: bold;
    text-align: center;
    padding: 19px;
    border-bottom:1px solid rgba(204, 204, 204,1);
}

.company__detail td {
    padding: 19px;
    padding-left: 1em;
    border-left:1px solid rgba(204, 204, 204,1);
    border-bottom:1px solid rgba(204, 204, 204,1);
}

/**

利用規約・プライバシーポリシー

**/
.policy__wrap{
    max-width: 1200px;
    margin: 0 auto;
    padding:0 20px;
}

.policy__wrap h2 {
    position: relative;
    padding: 0.2em;
    font-size: 1.5em;
    background: transparent;
    border-width: 0 0 4px 0;
    border-style: solid;
    border-color: rgba(204, 204, 204, 0.8);
    border-radius: 0;
}

.policy__wrap h3 {
    padding: 0.2em 0.5em;
    font-size: 1.25em;
    border-left:5px solid #F0882D;
}

.policy__wrap p{
    letter-spacing: 0.1em;
    margin-top: 2rem;
    margin-bottom: 2rem;
    line-height: 2;
}


/**

eco-sumai 追加レイアウト調整　問い合わせ

**/

#request-bottom{
    transform: scale(1.5);
    accent-color: #6FC843;
    color: var(--p, #4E453D);
    font-family: "Noto Sans JP";
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

#btn.btn04 {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 20px;
    background-color: #6FC843;
    border: none;
    border-radius: 5px;
    color: white;
    cursor: pointer;
}
.now {
    font-size: 16px;
}

.featured {
    text-emphasis: filled;
    -webkit-text-emphasis: filled;
    color:#FFD500;
}

/* デフォルトはデスクトップ表示 */
.desktop-only {
    display: block;
}

.mobile-only {
    display: none;
}

/* スマホサイズでの切り替え */
@media (max-width: 768px) {
    .desktop-only {
        display: none !important; /* フォームを非表示 */
    }
    
    .mobile-only {
        display: block; /* スマホ用要素を表示 */
    }
}