﻿.maindesign {
font-family:"Noto Sans JP","ＭＳ Ｐゴシック","MS PGothic",verdana,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,Sans-Serif;
}
.maindesign h1 img{
width:100%;
}
.maindesign h1 span{
    color: #fff;
    text-align: left;
    font-weight: bold;
    position: absolute;
    transform: translatey(-50%);
    font-feature-settings: "palt" 1;
    text-shadow: 1px 1px 5px #000000;
}

.maindesign h1 span.heading01{
font-size: 4em;
    line-height: 1.2;
    top: 50%;
    left: 2%;
    width: 64%;
}
.maindesign h1 span.heading01.shop_title {
    font-size: 4em;
    top: 40%;
}
.maindesign h1 span.heading01-sub{
    top: 70%;
    left: 3%;
    font-size: 2em;
}
.wrap .maindesign h1 span.heading01-sub{
    top: 80%;
    left: 3%;
    font-size: 2em;
}
.maindesign h1 span.heading01-sub.shop_title  {
    font-size: 1.5em;
}

@media screen and (max-width: 767px){
.maindesign h1 span.heading01{
font-size: 7.5vw;
    top: 50%;
    line-height: 1.2;
    width: 50%;
}
.maindesign h1 span.heading01-sub{
top: 74%;
    left: 3%;
    font-size: 4.5vw;
    width: 45%;
    line-height: 1.2;
}
}
.maindesign .arrow-r::after {
    border-top: 2px solid #b6b6b6;
    border-right: 2px solid #b6b6b6;
}
.maindesign .default-btn.arrow-r::after {
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
}

.maindesign .help-control-box {
border: 1px solid #B70B17;
padding: 0.8rem 1rem;
margin: 2.5rem 0 3.5rem;
box-sizing: border-box;
}

.maindesign .help-control-box p {
line-height: 1.5;
}

.maindesign .active-text-red {
    color: #B70B17;
}
@media screen and (min-width: 768px){
.feat-art .goods-list-area .item {
    width: calc((100% - 80px) / 4);
    width: -webkit-calc((100% - 80px) / 4);
    width: -moz-calc((100% - 80px) / 4);
}

.feat-art .goods-list-area .item:nth-child(4n) {
    margin-right: 0;
}

.feat-art .goods-list-area .item:nth-child(5n) {
    margin: 30px 20px 0 0;
}
}
.feat-art .goods-list-area {
    margin: 0 auto 3em;
}

.feat-art .more-btn-area {
   margin: 0 auto 3em;
}

.maindesign .monooki_select{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.maindesign .monooki_select li{
    width: calc(50% - 10px);
    border: 1px solid #ccc;
    border-radius: 5px;
    overflow: hidden;
    margin: 0 0 20px;
}

.maindesign .monooki_select li a{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    padding: 10px;
height: 100%;
    box-sizing: border-box;
position: relative;
}
.maindesign .monooki_select li a .monooki_ex--img span{
          margin: 10px 0 0;
    display: block;
}
.maindesign .monooki_ex--img span svg{
    margin-right: 0.1em;
}
.maindesign .monooki_select li a .monooki_ex--img span svg{
    width: 1em;
}

@media screen and (max-width: 767px){
.maindesign .monooki_select li a{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    padding: 10px;
    height: 100%;
    box-sizing: border-box;
    align-content: flex-start;
    flex-direction: column;
}
.maindesign .monooki_select li a .monooki_ex--img {
    width: 100%;
}
.maindesign .monooki_select li a .monooki_ex--img span {
    min-height: 2em;
}
.maindesign .monooki_select li a .monooki_ex--img span.door_color{
min-height: auto;

}
.maindesign .monooki_select li a .monooki_ex--img span svg {
    width: 6vw;
}
.maindesign .monooki_select li a .monooki_ex--txt {
    width: 100%;
    height: auto;
    padding: 0px;
    box-sizing: border-box;
    margin: 10px 0 auto;
}
}

.maindesign .fs-large {
    font-size: 1.2em;
    padding: 1.05rem 1rem;
}

.maindesign .monooki_ex{
        display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    border: 1px solid #ccc;
    padding: 10px;
    box-sizing: border-box;
margin: 30px 0 0;
}
.maindesign .monooki_ex--box{
        width: 70%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
.maindesign .monooki_ex--box .monooki_ex--title{
      font-weight: bold;
      font-size: 1.25em;
    width: 100%;
}
.maindesign .monooki_ex--img{
       width: 25%;
}
.maindesign .monooki_ex--img img{
      width: 100%;
    height: auto;
}

.maindesign .monooki_ex--img span{
display: flex;
    flex-wrap: wrap;
    align-items: center;
}
.maindesign .monooki_ex--img span.door_color{
width: 100%;

}
.maindesign  span.door_color-box{
margin: 10px 0;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}
.maindesign  span.door_color-box svg{
margin-right: 0.1em;
}
.incl-area .maindesign .monooki_ex--img span{
      margin: 10px 0;
}

.maindesign .monooki_ex--txt{
      width: 75%;
    height: 100%;
    display: flex;
    padding: 10px 20px;
    box-sizing: border-box;
    flex-direction: column;
    justify-content: flex-start;
}
.maindesign .monooki_ex--title{
      font-weight: bold;
      font-size: 1.25em;
}
.maindesign .monooki_ex--txt img{
       width: 100%;
    height: auto;
flex-shrink: 0
}

.maindesign img.maker_logo{
position: absolute;
    bottom: 0;
    right: 0;
    margin: 0 0 0 auto;
    width: 150px;
    height: auto;
    display: block;
}
.maindesign .monooki_ex--txt img.maker_logo {
      position: relative;
    bottom: 0;
    right: 0;
    margin: 0 auto 0 0;
    width: 150px;
    height: auto;
    display: block;
}
.maindesign .monooki_ex--txt p{
       line-height: 1.2;
    margin: 10px 0;
}
.maindesign .monooki_ex--detail_btn{
       width: 30%;
}

@media screen and (max-width: 767px){
.maindesign .monooki_ex--box {
    width: 100%;
    justify-content: space-between;
margin: 0 0 10px;
}
.maindesign .monooki_ex--img {
    width: calc(50% - 5px);
}
.maindesign .monooki_ex--txt {
    width: calc(50% - 10px);
    padding: 0px;
    margin: 10px 0;
}
.maindesign .monooki_ex--title {
    font-weight: bold;
    font-size: 0.9em;
    font-feature-settings: "palt" 1;
    margin: 0 0 5px;
}
.maindesign .monooki_ex--detail_btn {
    width: 100%;
}

.incl-area .maindesign .monooki_ex--img span svg {
    width: 6vw;
    margin-right: 0.1em;
}
.maindesign img.maker_logo{
position: static;
    bottom: auto;
    right: auto;
    margin: 0 auto;
    max-width: 150px;
    width: 100%;
    height: auto;
    display: block;
}
}





.maindesign .color_ball--frame{
    fill: #7F7F7F;
}
.maindesign .color_ball--komeri_c01{
    fill: #40382f;
}
.maindesign .color_ball--komeri_c02{
    fill: #30343f;
}
.maindesign .color_ball--takubo_c01{
    fill: #e7e4d5;
}
.maindesign .color_ball--takubo_c02{
    fill: #857d70;
}
.maindesign .color_ball--takubo_c03{
    fill: #ce946e;
}
.maindesign .color_ball--takubo_c04{
    fill: #002f49;
}
.maindesign .color_ball--takubo_c05{
    fill: #f1f2ec;
}
.maindesign .color_ball--takubo_c06{
    fill: #1a3375;
}
.maindesign .color_ball--takubo_c07{
    fill: #daddcc;
}
.maindesign .color_ball--takubo_c08{
    fill: #887467;
}
.maindesign .color_ball--takubo_c09{
    fill: #092e4b;
}
.maindesign .color_ball--takubo_c10{
    fill: #c4865d;
}
.maindesign .color_ball--takubo_c11{
    fill: #d0cec3;
}
.maindesign .color_ball--takubo_lei{
    fill: #75835d;
}
.maindesign .color_ball--takubo_bel01{
    fill: #747a7f;
}
.maindesign .color_ball--takubo_bel02{
    fill: #babcbb;
}
.maindesign .color_ball--takubo_bel03{
    fill: #928b7e;
}
.maindesign .color_ball--inaba_c01{
    fill: #878988;
}
.maindesign .color_ball--inaba_c02{
    fill: #9ead82;
}
.maindesign .color_ball--inaba_c03{
    fill: #d6dbdf;
}
.maindesign .color_ball--inaba_c04{
    fill: #806c53;
}
.maindesign .color_ball--inaba_c05{
    fill: #6c7077;
}
.maindesign .color_ball--inaba_c06{
    fill: #b3bda0;
}
.maindesign .color_ball--inaba_c07{
    fill: #babcbd;
}
.maindesign .color_ball--inaba_c08{
    fill: #4e4941;
}
.maindesign .color_ball--inaba_c09{
    fill: #cfd2d5;
}
.maindesign .color_ball--inaba_c10{
    fill: #555c65;
}
.maindesign .color_ball--inaba_c11{
    fill: #525961;
}
.maindesign .color_ball--inaba_c12{
    fill: #d5dadc;
}
.maindesign .color_ball--yodo_c01{
    fill: #f2f1ed;
}
.maindesign .color_ball--yodo_c02{
    fill: #434540;
}
.maindesign .color_ball--yodo_c03{
    fill: #224d6f;
}
.maindesign .color_ball--yodo_c04{
    fill: #626665;
}
.maindesign .color_ball--yodo_c05{
    fill: #6a564d;
}
.maindesign .color_ball--yodo_c06{
    fill: #dad9d7;
}
.maindesign .color_ball--yodo_c07{
    fill: #2f3a3c;
}
.maindesign .color_ball--yodo_c08{
    fill: #95ab9e;
}
.maindesign .color_ball--yodo_c09{
    fill: #56493f;
}
.maindesign .color_ball--yodo_beams{
    fill: #2f2816;
}
.wrap .maindesign h1 span.heading01-sub{
    top: 80%;
    left: 3%;
    font-size: 1.5em;
}

#main.background .maindesign .more-btn-area a.btn{
    background-color: #FFF !important;
    border: 3px solid #3C2584 !important;
    border-radius: 10px !important;;
    box-sizing: border-box;
    color: #3C2584 !important;;
    cursor: pointer;
    display: inline-block;
    font-weight: 900;
    position: relative;
    text-align: center;
}