@charset "UTF-8";
@media screen and (min-width: 768px) {
    /*pc・タブレットcss*/
    section#kitchen-dl{
        padding: 42px 0;
    }
    section {
        padding: 0;
    }
    .group-image {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
    }
    .group-image img {
        max-width: 180px !important;
    }
    .construction_examples .main img {
        max-width: 1000px;
        margin: 0 auto;
        display: table;
    }
    /* .auto-wash {
        max-width: 800px;
        margin: 0 auto;
        clear: both;
        overflow: hidden;
    }
    .auto-wash img {
        float: right;
    } */
    .auto-wash section.content-image {
        width: 50%;
        margin-right: 0;
    }
    .auto-wash section.content-image img{ 
        width: 100%;
    }
    .auto-wash section.content-text {
        width: 40%;
    }
    .from-btn-Box button {
        padding: 0;
        background: none;
    }
    .padpc50 {
        padding: 50px;
    }
    .mtpc40 {
        margin-top: 40px;
    }
    .mtpc30 {
        margin-top: 30px;
    }
        /* kitchen-dl
    -------------------------------------*/
    #kitchen-dl .Box {
        width: 1000px;
        margin: 0 auto;
    }
    #kitchen-dl .Box .ttl-box {
        background: url(../images/kitchen_lineup/dl-ttl-bg.jpg) no-repeat left;
        font-weight: bold;
        line-height: 1.4;
        letter-spacing: 0;
        padding-left: 20px;
        margin-bottom: 55px;
    }
    #kitchen-dl .Box .ttl-box .ttl {
        font-size: 30px;
        color: #221815;
        border-bottom: 1px solid #000;
        margin-bottom: 5px;
    }
    #kitchen-dl .Box .ttl-box .txt {
        font-size: 23px;
        color: #1a7abe;
    }
    #kitchen-dl .Box .sis-pic {
        margin-bottom: 15px;
    }
    #kitchen-dl .Box .sis-pic img {
        max-height: 800px;
        width: auto;
    }
    #kitchen-dl .Box .taglist{
        width:740px;
        float:left;
        margin:0px 0px 10px 0px;
    }
    #kitchen-dl .Box .taglist li{
        background-color:#d4d4d4;
        float:left;
        font-size:16px;
        border-radius:20px 20px 20px 20px;
        margin: 0px 8px 10px 0;
    }
    #kitchen-dl .Box .taglist li a{
        display:block;
        padding:6px 20px 6px 20px;
    }
    #kitchen-dl .Box .list_price {
        font-weight: 500;
        letter-spacing: 0;
        color: #221815;
        margin-bottom: 28px;
    }
    #kitchen-dl .Box .list_price .main {
        font-size: 15px;
    }
    #kitchen-dl .Box .list_price .price {
        display: none;  
    }
    #kitchen-dl .Box .list_price .price2 {
        font-size: 28px;
    }
    #kitchen-dl .Box .list_price .price2::before {
        content: "￥";
        margin-right: .3em;
    }
    #kitchen-dl .Box .list_wysiwyg {
        font-size: 14px;
        line-height: 1.5;
        letter-spacing: 0;
        color: #221815;
        margin-bottom: 80px;
    }
    #kitchen-dl .Box .ttl02 {
        margin-bottom: 40px;
    }
    #kitchen-dl .Box .list li {
        width: 235px;
        line-height: 1.5;
        color: #221815;
        margin-right: 20px;
        margin-bottom: 45px;
        position: relative;
    }
    .chbox{ position: absolute; left: -10px; top: -10px; width: 20px; height: 20px; }
    #kitchen-dl .Box .list li .photo{
        width: 235px;
        height: 165px;
        overflow: hidden;text-align: center;
    }
    #kitchen-dl .Box .list li .photo img{
        max-height: 100%;
        max-width: 235px;
        width: auto;
        height: auto;
    }
    #kitchen-dl .Box .list li:nth-child(4n) {
        margin-right: 0px;
    }
    #kitchen-dl .Box .list li .txt02 {
        font-size: 16px;
        font-weight: bold;
        text-align: center;
        color: #fff;
        background-color: #221815;
        padding: 3px 0;
        margin-bottom: 8px;
    }
    #kitchen-dl .Box .list li .txt03 {
        font-size: 16px;
        position: relative;
        padding-bottom: 5px;
        margin-bottom: 10px;
    }
    #kitchen-dl .Box .list li .txt03::before {
        content: "";
        border-bottom: 1px solid #221815;
        width: 40px;
        position: absolute;
        bottom: 0px;
        left: 0;
        right: 0;
        margin-left: auto;
        margin-right: auto;
        text-align: center;
    }
    #kitchen-dl .Box .list li .txt04 {
        font-size: 14px;
        line-height: 1.5;
        color: #221815;
        margin-bottom: 5px;
    }
    #kitchen-dl .Box .list li .money {
        font-size: 16px;
        font-weight: bold;
        line-height: 1.5;
        color: #221815;
    }
    #kitchen-dl .Box .list li .money::before {
        content: "￥";
        margin-right: .3em;
    }
    #kitchen-dl .Box .total-price-bg-box {
        background: url(../images/kitchen_lineup/total-price-bg.jpg) repeat top;
        padding: 6px;
        border: 1px solid #a0a0a0;
        margin-bottom: 100px;
    }
    #kitchen-dl .Box .total-price-bg-box .wh-box {
        background-color: #fff;
    }
    #kitchen-dl .Box .total-price-bg-box .wh-box .icon {
        margin-left: 10px;
    }
    #kitchen-dl .Box .total-price-bg-box .wh-box .total-price-list .total-price {
        font-size: 50px;
        font-weight: bold;
        line-height: 1;
        color: #221815;
    }
    #kitchen-dl .Box .total-price-bg-box .wh-box .total-price-list .total-price::before {
        content: "￥";
    }
    #kitchen-dl .Box .total-price-bg-box .wh-box .total-price-list .tax {
        font-size: 16px;
        font-weight: bold;
        line-height: 1.5;
        color: #221815;
    }
    #kitchen-dl .Box .bnr01 {
        margin-bottom: 70px;
    }
    #kitchen-dl .Box .btn-list {
        width: 749px;
        margin: 0 auto;
    }
    #kitchen-dl .Box .btn-list li {
        width: 347px;
        text-align: center;
        border: 1px solid #a0a0a0;
        padding: 8px 6px;
        background-color: #fff;
        font-size: 16px;
        font-weight: bold;
        line-height: 1.5;
        letter-spacing: 0.05em;
        color: #221815;
    }
    #kitchen-dl .Box .btn-list li a {
        display: block;
        background-color: #f8f8f3;
        padding: 8px 0px;
    }
    #kitchen-dl .Box .btn-list li a::before {
        content: url(../images/kitchen_lineup/btn-icon01.png);
        margin-right: .3em;
        vertical-align: middle;
        display: inline-block;
    }
}
@media screen and (max-width: 767px) {
    /*pc・タブレット用cssを丸々コピーしたものを編集していく（スマホ用css）*/
    .kl2clm .custom-sp img {
        width: 100% !important;
    }
    section#kitchen-dl{
        padding: 42px 0;
    }
    section {
        padding: 0;
    }
    .padpc50 {
        padding: 0px;
    }
    .mtpc40 {
        margin-top: 0px;
    }
    .mtpc30 {
        margin-top: 0px;
    }
    .group-image img {
        max-width: 65px !important;
    }
        /* kitchen-dl
    -------------------------------------*/
    #kitchen-dl .Box {
        padding: 0 3%;
    }
    #kitchen-dl .Box .ttl-box {
        background: url(../images/kitchen_lineup/dl-ttl-bg.jpg) no-repeat left;
        font-weight: bold;
        line-height: 1.5;
        letter-spacing: 0;
        padding-left: 3%;
        margin-bottom: 8%;
    }
    #kitchen-dl .Box .ttl-box .ttl {
        font-size: 1.8rem;
        color: #221815;
        border-bottom: 1px solid #a0a0a0;
        margin-bottom: 5px;
        padding-left: 3%;
    }
    #kitchen-dl .Box .ttl-box .txt {
        font-size: 1.5rem;
        color: #1a7abe;
        padding-left: 3%;
    }
    #kitchen-dl .Box .sis-pic {
        margin-bottom: 4%;
    }
    #kitchen-dl .Box .taglist{
        margin:0px 0px 2% 0px;
    }
    #kitchen .Box .taglist h3{
        margin:0px 0 4% 0px;}

    #kitchen-dl .Box .taglist li{
        background-color:#d4d4d4;
        float:left;
        font-size:1.2rem;
        border-radius:20px 20px 20px 20px;
        margin: 0px 2% 2% 0;
    }
    #kitchen-dl .Box .taglist li a{
        display:block;
        padding:6px 20px 6px 20px;
    }
    #kitchen-dl .Box .list_price {
        font-weight: 500;
        letter-spacing: 0;
        color: #221815;
        margin-bottom: 28px;
    }
    #kitchen-dl .Box .list_price .main {
        font-size: 16px;
    }
    #kitchen-dl .Box .list_price .price {
        display: none;  }

    #kitchen-dl .Box .list_price .price2 {
        font-size: 28px;
    }
    #kitchen-dl .Box .list_price .price2::before {
        content: "￥";
        margin-right: .3em;
    }
    #kitchen-dl .Box .list_wysiwyg {
        font-size: 1.4rem;
        line-height: 1.5;
        letter-spacing: 0;
        color: #221815;
        margin-bottom: 80px;
    }
    #kitchen-dl .Box .ttl02 {
        margin-bottom: 40px;
    }
    #kitchen-dl .Box .list li {
        width: 48%;
        line-height: 1.5;
        color: #221815;
        margin-right: 4%;
        margin-bottom: 5%;
        position: relative;
    }
    .chbox{ position: absolute; left: -10px; top: -10px; width: 20px; height: 20px; }
    #kitchen-dl .Box .list li:nth-child(2n) {
        margin-right: 0px;
    }

    #kitchen-dl .Box .list li .photo{
        text-align: center;
    }
    #kitchen-dl .Box .list li .photo img{
        max-height: 120px;
        max-width: 100%;
        height: auto;
        width: auto;
    }
    #kitchen-dl .Box .list li .txt02 {
        font-size: 1.6rem;
        font-weight: bold;
        text-align: center;
        color: #fff;
        background-color: #221815;
        padding: 3px 0;
        margin-bottom: 8px;
    }
    #kitchen-dl .Box .list li .txt03 {
        font-size: 1.6rem;
        position: relative;
        padding-bottom: 5px;
        margin-bottom: 10px;
    }
    #kitchen-dl .Box .list li .txt03::before {
        content: "";
        border-bottom: 1px solid #221815;
        width: 40px;
        position: absolute;
        bottom: 0px;
        left: 0;
        right: 0;
        margin-left: auto;
        margin-right: auto;
        text-align: center;
    }
    #kitchen-dl .Box .list li .txt04 {
        font-size: 1.4rem;
        line-height: 1.5;
        color: #221815;
        margin-bottom: 5px;
    }
    #kitchen-dl .Box .list li .money {
        font-size: 1.6rem;
        font-weight: bold;
        line-height: 1.5;
        color: #221815;
    }
    #kitchen-dl .Box .list li .money::before {
        content: "￥";
        margin-right: .3em;
    }
    #kitchen-dl .Box .total-price-bg-box {
        background: url(../images/kitchen_lineup/total-price-bg.jpg) repeat top;
        padding: 6px;
        border: 1px solid #a0a0a0;
        margin-bottom: 10%;
    }
    #kitchen-dl .Box .total-price-bg-box .wh-box {
        background-color: #fff;
    }
    #kitchen-dl .Box .total-price-bg-box .wh-box .icon {
        margin-left: 10px;
        width: 19%;
    }
    #kitchen-dl .Box .total-price-bg-box .wh-box .total-price-list .total-price {
        font-size:3rem;
        font-weight: bold;
        line-height: 1;
        color: #221815;
    }
    #kitchen-dl .Box .total-price-bg-box .wh-box .total-price-list .total-price::before {
        content: "￥";
    }
    #kitchen-dl .Box .total-price-bg-box .wh-box .total-price-list .tax {
        font-size: 1.2rem;
        font-weight: bold;
        line-height: 1.5;
        color: #221815;
    }
    #kitchen-dl .Box .bnr01 {
        margin-bottom: 8%;
    }
    #kitchen-dl .Box .btn-list li {
        text-align: center;
        border: 1px solid #a0a0a0;
        padding: 8px 6px;
        background-color: #fff;
        font-size: 16px;
        font-weight: bold;
        line-height: 1.5;
        letter-spacing: 0.05em;
        color: #221815;
        margin-bottom: 3%;
    }
    #kitchen-dl .Box .btn-list li a {
        display: block;
        background-color: #f8f8f3;
        padding: 8px 0px;
    }
    #kitchen-dl .Box .btn-list li a::before {
        content: url(../images/kitchen_lineup/btn-icon01.png);
        margin-right: .3em;
        vertical-align: middle;
        display: inline-block;
    }
}
/* add details */
.klTtl { margin-bottom: 20px; font-size: 1.333em; font-weight: bold; letter-spacing:0.2em; line-height: 1.8;}
.kiTxt { margin-bottom: 40px; line-height: 1.8; letter-spacing: 0.1em; text-align:justify; text-justify:inter-ideograph;}
.klSpec dt { line-height: 1.8; font-size: 0.867em; padding-bottom: 10px; margin-bottom: 15px; border-bottom:1px dashed #221815;}
.klSpec dd { font-size: 0.8em; text-indent:-1em; margin-left: 1em;}
.klSpec dd:before { content:"□"; margin-right:2px;}
.klDetaiTtl { margin-bottom: 10px; font-weight: bold;}
.klDetaiTxt { font-size: 0.867em;/* text-align:justify; text-justify:inter-ideograph;*/ line-height:1.6;}
.klMeister { background:#e5dccb;}
.klMeisterPoint dt { margin-bottom: 20px;}
.klMeisterPoint dd { text-indent:-1em; margin-left: 1em; margin-bottom:10px;}
.klMeisterPoint dd:before { content:"□"; margin-right:2px;}
.txtNote { white-space:nowrap}
.klMeisterDetail { margin-bottom: 20px; overflow:hidden;}
.klDetail_h4{text-align: center; font-weight: bold; font-size: 1.333em; margin-bottom:30px;}
.ckCatch { width: 94%; margin: 0 auto 40px; font-size: 16px; line-height: 1.6; text-align: center;}
.mwform-checkbox-field { padding-left: 2em;}
.mwform-radio-field { padding-left: 2em;}
.know-list .mwform-checkbox-field, .mwform-checkbox-field:first-child,
.know-list .mwform-radio-field, .mwform-radio-field:first-child{ padding-left: 0;}
/* バナー追加 */
.bnBox { max-width:1000px; border:#ccc 1px solid; margin-bottom: 30px; box-sizing: border-box;}
.bnBox:hover{ opacity:0.5;}
.bnBox .fl,
.bnBox .fr{ width:50%;}

/* 価格追加 */
.red{color: #e80d00;}

@media screen and (min-width: 768px) {
    .pcNone { display:none}
    #kitchen-dl .Box .list_wysiwyg { margin-top: 32px;}
    .kl2clm { width:105%; margin-left:-2.5%; margin-right: -2.5%; overflow: hidden;}
    .kl2clm > section,
    .kl2clm > li { width:45%; margin-right:2.5%; margin-left:2.5%; float:left; overflow:hidden;}
    .kl2clm > section.klDetailWide { width:95%; margin:0 2.5% 30px; float:none;}
    .kl2clm > section:nth-of-type(2n+1),
    .kl2clm > li:nth-child(2n+1) { clear:both; float:left;}
        
    .kl2clm02 { width:105%; margin-left:-2.5%; margin-right: -2.5%; margin-bottom: 0; overflow: hidden;}
    .kl2clm02 h4{ margin:0 ;}
    .kl2clm02 > section,
    .kl2clm02 > li { width:45%; margin-right:2.5%; margin-left:2.5%; margin-bottom: 30px; float:left; overflow:hidden;}
    .kl2clm02 > section.klDetailWide { width:95%; margin:0 2.5% 30px; float:none;}
    .kl2clm02 > section:nth-of-type(2n+1),
    .kl2clm02 > li:nth-child(2n+1) { clear:both; float:left;}
    .kl2clm02 > section:nth-child(3n){ clear:both; float:right;}
        
    .klImg01 img { width:92%; height:auto; margin-bottom:40px;}
    .klImg02 { width:100%; text-align:right;}
    .klImg02 img { width:37.9%; height:auto;}

    .klDetailThumb{ width:35%; height:auto; float:left;}
    .klDetaiDescription{ width:62%; float:right;}

    .klMeister > section:first-of-type {  padding-left: 10px;}
    .klMeister > section:nth-of-type(2) {  padding: 30px 0 30px 0;}

    .klMeisterChart { overflow:hidden; margin-top: 20px;}
    .klMeisterChart dt { width:53%; float: left; padding-bottom: 7px; border-bottom:1px dashed #221815; font-weight: bold;}
    .klMeisterChart dd { width:44%; float:right;}
}

@media screen and (max-width: 767px) {
    .spNone { display:none;}
    .kl2clm > section,
    .kl2clm > li { width:100%; margin-right:0; margin-left:0; margin-bottom: 30px; float:none; overflow:hidden;}
    .kl2clm > section:nth-child(3n){float:none;}
    .kl2clm02 > section,
    .kl2clm02 > li { width:100%; margin-right:0; margin-left:0; margin-bottom: 30px; float:none; overflow:hidden;}
    .kl2clm02 > section:nth-child(3n){float:none;}
    .klImg01,.klImg02 { margin-bottom:15px; text-align:center;}
    .klImg02 img { width:37.9%!important; height:auto;}
    .list_wysiwyg img.klDetailThumb{ width:30%!important; height:auto; float:left;}
    .klDetaiDescription{ width:67%; float:right;}
    .klDetaiTtl { margin-bottom:3px;}

    .klMeister > section:first-of-type {  padding:0 15px;}
    .klMeister > section:nth-of-type(2) {  padding: 15px 15px 0;}
    .klMeisterPoint { margin-bottom: 20px;}
    .klMeisterChart dt { padding-bottom: 10px; margin-bottom:20px; border-bottom:1px dashed #221815; font-weight: bold}
    .klMeisterChart dd { text-align:center}
    .klMeisterChart dd img{ width:70%!important;}
    .list_wysiwyg{margin-bottom:60px;}	
    .list_wysiwyg .klMeisterDetail img.klDetailThumb{ width:40%!important;}
    .klMeisterDetail .klDetaiDescription{ width:57%;}
    .list_wysiwyg .klDetailWide img.klDetailThumb{ width:100%!important; height:auto; float:none; margin-bottom: 10px;}
    .klDetailWide .klDetaiDescription{ width:100%; float:none;}
}
@media (max-width:767px){
    .bnBox { max-width:100%;}
    .bnBox .fl,
    .bnBox .fr{ width:100%; float:none;}
}