/* form1 */
#index .row {
    margin-bottom: 15px;
    background-color: #fcfcfb;
    padding: 10px;
    border: #eee solid 3px;
}
#index #row1 {
    display: grid;
    grid-template-columns: 150px 1fr 1fr 1fr;
    gap: 5px;
}
#index #row2 {
    display: grid;
    grid-template-columns: 150px 1fr 1fr 1fr;
    gap: 5px;
}
#index #row3 {
    display: grid;
    grid-template-columns: 150px 1fr 1fr 1fr 1fr 1fr 1fr;
    gap: 5px;
}
#index #row4 {
    display: grid;
    grid-template-columns: 150px 1fr 1fr;
    gap: 5px;
}
#index #row5 {
    display: grid;
    grid-template-columns: 150px 1fr 1fr 1fr;
    gap: 5px;
}
#index .sel {
    border: 1px solid #000000;
    padding: 5px 0 5px 10px;
    margin-bottom: 0;
    font-family: sans-serif;
    font-size: 14px;
    position: relative;
    line-height: 4rem;
}
#index .sel input[type="checkbox"],.sel input[type="radio"]{
    position: absolute;
    left: 5px;
}
#index .sel.checked {
    background: #b3b3b3;
    color: white;
}

#index .g_col1{grid-column: 1;}
#index .g_col2{grid-column: 2;}
#index .g_col3{grid-column: 3;}
#index .g_col4{grid-column: 4;}
#index .g_col5{grid-column: 5;}
#index .ttl{
    font-size: 18px;
}
#no_kitchen{
    margin-top: 20px;
    display: none;
    border: 1px solid #000000;
    padding: 10px 15px;
    text-align: center;
}
#kita{
    font-size: 24px;
    top: 60px;
    left: 106px;
    position: absolute;
}
@media (max-width: 1023px) {
    #index.formInner{
        padding-top: 0;
    }
    #no_kitchen{
        margin-top: 40px;
    }
    #kita{
        font-size: 24px;
        top: -10px;
        left: 76px;
        position: absolute;
    }
}

/*index2*/
#index2{
    margin-top: 50px;
}
#index2 .row1 {
    height: 30px;
}
#index2 .row2 {
    height: 200px;
}
#index2 .row3 {
    height: 30px;
}
#index2 #main_box{
    display: grid;
    grid-template-columns: 200px 30px 200px 30px 100px auto;
    gap: 0;
}
#index2 #t11{grid-column: 1;grid-row: 1;}
#index2 #t12{grid-column: 2;grid-row: 1;}
#index2 #t13{grid-column: 3;grid-row: 1;height: 30px}
#index2 #t14{grid-column: 4;grid-row: 1;}
#index2 #t15{grid-column: 5;grid-row: 1;}
#index2 #t21{grid-column: 1;grid-row: 2;text-align: right}
#index2 #t21 input{margin-top: 90px;}
#index2 #t22{grid-column: 2;grid-row: 2;}
#index2 #t23{grid-column: 3;grid-row: 2;background-color: #E2EAD3}
#index2 #t24{grid-column: 4;grid-row: 2;}
#index2 #t25{grid-column: 5;grid-row: 2;text-align: left}
#index2 #t25 input{margin-top: 90px;}
#index2 #t31{grid-column: 1;grid-row: 3;}
#index2 #t32{grid-column: 2;grid-row: 3;}
#index2 #t33{grid-column: 3;grid-row: 3;}
#index2 #t34{grid-column: 4;grid-row: 3;}
#index2 #t35{grid-column: 5;grid-row: 3;}
#index2 #t16{
    grid-column: 6;grid-row: 1;text-align: left;grid-row-end: 4;padding: 100px 0 0 30px;
}
#index2 #sample{
    width: 70%;margin: 40px auto 0;
}
@media (max-width: 1023px) {
    #index2{
        margin-top: 0;
    }
    #index2 .row2 {
        height: auto;
    }
    #index2 #main_box {
        width: 90%;
        margin: 0 auto;
        grid-template-columns: 25% 30px 25% 30px 25%;
        grid-template-rows: 130px auto auto auto;
    }
    #index2 .row1{
        height: 30px;
    }
    #index2 #t11{grid-column: 1;grid-row: 2;}
    #index2 #t12{grid-column: 2;grid-row: 2;}
    #index2 #t13{grid-column: 3;grid-row: 2;height: 30px}
    #index2 #t14{grid-column: 4;grid-row: 2;}
    #index2 #t15{grid-column: 5;grid-row: 2;}
    #index2 #t21{grid-column: 1;grid-row: 3;text-align: right}
    #index2 #t21 input{margin-top: 90px;}
    #index2 #t22{grid-column: 2;grid-row: 3;}
    #index2 #t23{
        grid-column: 3;grid-row: 3;
        background-color: #E2EAD3;
        aspect-ratio: 1 / 1;
    }
    #index2 #t24{grid-column: 4;grid-row: 3;}
    #index2 #t25{grid-column: 5;grid-row: 3;text-align: left}
    #index2 #t25 input{margin-top: 30px;}
    #index2 #t31{grid-column: 1;grid-row: 4;}
    #index2 #t32{grid-column: 2;grid-row: 4;}
    #index2 #t33{grid-column: 3;grid-row: 4;}
    #index2 #t34{grid-column: 4;grid-row: 4;}
    #index2 #t35{grid-column: 5;grid-row: 4;}
    #index2 #t16{
        grid-column: 1/5;grid-row: 1;text-align: left;grid-row-end: 4;padding: 100px 0 0 30px;
    }

    #index2 #t21 input{margin-top: 28px;}
    #index2 #t25 input{margin-top: 28px;}
    #index2 #t16 {
        width: 100%;
        padding: 30px 0 0 0;
    }
    #index2 #sample{
        width: 100%;
        margin: 60px auto 0;
    }
}

/*index3*/
#index3{
    margin-top: 50px;
}
#index3 .grid{
    display: grid;
    grid-template-columns: 30% 30% 30%;
    gap: 3%
}
#index3 .row {
    background-color: #fcfcfb;
    padding: 0;
    border: #eee solid 3px;
    display: grid;
    width: 90%;
    margin: 0 auto 15px;
}
#index3 .row.active{
    border: #b3b3b3 5px solid;
    border-radius: 3px;
}

#index3 .plan_name{
    text-align: left;
    padding-left: 20px;
    font-size: 20px;
    font-weight: bold;
}
#index3 .plan_name:hover{
    text-decoration: none;
}
#index3 .plan_img{
    margin-top: 5px;
    text-align: right;
    padding-right: 5px;
}
#index3 .row a{
    padding: 10px;
    margin: 0;
    box-sizing:border-box;
    display: inline-block;
    width: 100%;
    height: 100%;
}
#index3 img {
    width: 80%;
    margin: 10px auto 5px;
}
@media (max-width: 1023px) {
    #index3 .grid {
        grid-template-columns: 50% 50%;
    }

    #index3 img.img_select{
        aspect-ratio: 1 / 1;
        border: 10px white solid;
    }
    #index3 img.active{
        border: #b3b3b3 10px solid;
        border-radius: 5px;
    }
    #index3 .t11{
        grid-column: 1;grid-row: 1;
    }
    #index3 .t12{
        grid-column: 2;grid-row: 1;
    }
    #index3 .t13{
        grid-column: 1;grid-row: 2;
    }
    #index3 .t14{
        grid-column: 2;grid-row: 2;
    }
    #index3 .t15{
        grid-column: 1;grid-row: 3;
    }
    #index3 .t16{
        grid-column: 2;grid-row: 3;
    }
}




/* index4 */
#index4{
    margin-top: 50px;
}
#index4 .grid{
    display: grid;
    grid-template-columns: 30% 30% 30%;
    gap: 0 3%
}
#index4 .row {
    background-color: #fcfcfb;
    padding: 0;
    border: #eee solid 3px;
    display: grid;
    width: 90%;
    margin: 0 auto 15px;
}
#index4 .row.active{
    border: #b3b3b3 5px solid;
    border-radius: 3px;
}

#index4 .plan_name{
    text-align: left;
    padding-left: 20px;
    font-size: 20px;
    font-weight: bold;
}
#index4 .plan_name:hover{
    text-decoration: none;
}
#index4 .plan_img{
    margin-top: 5px;
    text-align: right;
    padding-right: 5px;
}
#index4 .row a{
    padding: 10px;
    margin: 0;
    box-sizing:border-box;
    display: inline-block;
    width: 100%;
}
@media (max-width: 1023px) {
    #index4 .grid {
        grid-template-columns: 50% 50%;
    }
}

/*index5*/
#index5{
    margin-top: 50px;
}

#index5 li{
    display: inline-block;
    padding-right: 20px;
    font-size: 24px;
}
#index5 #sample_img{
    width: 600px;
}
#index5 .sub_ttl{
    margin-bottom: 0;
}
#index5 .img_box{
    margin-top: 20px;
}
#index5 .grid{
    display: grid;
    grid-template-columns: 33% 33% 33%;
    gap: 1%
}

#index5 .row {
    background-color: #fcfcfb;
    padding: 0 0 5px;
    border: #eee solid 3px;
    display: grid;
    width: 90%;
    margin: 0 auto 15px;
}
#index5 .row.active{
    border: #b3b3b3 5px solid;
    border-radius: 3px;
}
@media (max-width: 1023px) {
    #index5 {
        margin-top: 0;
    }
}

/*index6*/
#index6{
    margin-top: 50px;
}
#index6 li{
    display: inline-block;
    padding-right: 20px;
    font-size: 24px;
}
#index6 #sample_img{
    width: 600px;
}
#index6 .sub_ttl{
    margin-bottom: 0;
}
#index6 .img_box{
    margin-top: 20px;
}

#index6 .grid{
    display: grid;
    grid-template-columns: 33% 33% 33%;
    gap: 1%
}
#index6 .row {
    background-color: #fcfcfb;
    padding: 0 0 5px;
    border: #eee solid 3px;
    display: grid;
    width: 90%;
    margin: 0 auto 15px;
}
#index6 .row.active{
    border: #b3b3b3 5px solid;
    border-radius: 3px;
}
@media (max-width: 1023px) {
    #index6 {
        margin-top: 0;
    }
}
#ttl_plan_count{
    text-align: right
}
#ttl_plan_count span{
    font-size: 24px;
    font-weight: bold;
    display:inline-block;
    padding-left: 5px;
    padding-right: 5px;
}
#t16{
    position: relative;
}

#nodata{
    display: none;
    border: 1px solid #000000;
    padding: 10px 15px;
    text-align: center;
}
#kanryo{
    display: none;
    border: 1px solid #000000;
    padding: 10px 15px;
    text-align: center;
}

#inner_box{
    padding: 30px;
}
.btn_box{
    margin-top: 20px;
}
a.zoom{
    position: relative;
    display: inline-block;
}
a.zoom img.icon_zoom{
    position: absolute;
    right: 5px;
    bottom: 0;
    height: 15px;
    width: 15px;
}
.gn_list{
    border : 1px #888888 solid;
    font-size: 100%;
    margin: 0 10px 5px;
    text-align: left;
    padding: 0 5px;
}
.gn_list p {
    display: inline-block;
    margin-right: 20px;

}
@media (max-width: 1023px) {
    .btn1.btn-next{
        width: 100%;
        max-width: 200px;
    }
    #ttl_plan_count {
        padding-top: 100px;
    }
}