@charset "UTF-8";

/************************
エアコンページ
************************/
.airconpage .airconeabox{
border-radius: 8px;
padding: 2%;
background: #fff;
display:flex;
justify-content: space-between;
flex-wrap: wrap;
margin-bottom: 5%;
}

.airconpage .airconeaboxle{
width: 30%;

}

.airconpage .airconeaboxri{
width: 68%;

}
.airconpage .airconeaboxri table{
border: none;
}
.airconpage .airconeaboxri th{
padding: 1%;
font-size: 0.7rem;
color: #6c3b08;
font-weight: bold;
border-bottom: solid #ddd 1px;
width: 160px;
}

.airconpage .airconeaboxri td{
padding: 1%;
font-size: 0.7rem;
border-bottom: solid #ddd 1px;
vertical-align: middle;
}
.airconpage .airconeaboxri tr:first-child th,.airconpage .airconeaboxri tr:first-child td{
border-top: solid #ddd 1px;

}

.airconpage  .pric{
font-size:105%;
font-weight: bold;
color: #c53400;
}
.airconpage  .pricin{
font-size:270%;
font-weight: bold;
display: inline-block;
line-height: 1;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Noto Sans JP", Meiryo, sans-serif;
/*font-family: san-sarif;*/
}
.airconpage  .eatt{
font-size:115%;
color: #6c3b08;
font-weight:bold;
}
@media (max-width: 700px) {
.airconpage .airconeabox{
justify-content: center;
}
.airconpage .airconeaboxle{
width: 70%;
text-align: center;
margin-bottom: 3%;
}

.airconpage .airconeaboxri{
width: 100%;
}
.airconpage .pcenter{
text-align:center}
}
@media (max-width: 576px) {
.airconpage .airconeaboxri th,.airconpage .airconeaboxri td{
display: block;
width: 100%;
}

.airconpage .airconeaboxri th{
text-align:center;

}

.airconpage .airconeaboxri th,.airconpage .airconeaboxri td,.airconpage .airconeaboxri tr:first-child td{
border-top: none;
}
}


/************************
給湯器ページ
************************/


.kyutokipage .lineupbox{
display: flex;
justify-content: space-between;
background: #fff9c4;
padding: 3%;
margin-bottom: 5%;
flex-wrap: wrap;
}

.kyutokipage .lueabox{
 width: 49%;
 background: #fff;
 box-shadow: 0 0 2px #333, 2px 2px 2px #333;
 margin-bottom: 2%;
 cursor: pointer;
 padding: 3%;
 text-align: center;
 border:solid transparent 2px;
}
.kyutokipage .lueabox:hover{
 box-shadow: none;
 border:solid #6D3C09 2px;
}
.kyutokipage .lueabox:active{
 animation: osu ease 0.1s forwards;
}
@-webkit-keyframes osu {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  100% {
    -webkit-transform: translateY(10px);
            transform: translateY(10px);
  }
}

@keyframes osu {
  0% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  100% {
    -webkit-transform: translateY(10px);
            transform: translateY(10px);
  }
}
.kyutokipage .lueatt{
 font-weight: bold;
font-size: 1rem;
}
.kyutokipage .lueatt img{
padding-bottom: 3%;
}
.kyutokipage .ttin{
 display: inline-block;
}

.kyutokipage .sotott{
font-size: 1.5rem;
margin-bottom: 3%;
color: #c53400;
display: grid;
place-items:center;
font-weight: bold;
}
.kyutokipage .lineupbox .sotott{
 width: 100%;
}

.kyutokipage  .lupercent{
    padding: 2% 1%;
    font-weight: bold;
    font-size: 1.5rem;
    color: #fff;
    background: #c53400;
    margin-top: 2%;
    margin-bottom: 10%;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Noto Sans JP", Meiryo, sans-serif;
  /*  font-family: sans-serif;*/
 letter-spacing: 4px;
}

.kyutokipage  .lupric{
  font-size: 1.8rem;
font-weight: bold;
color:#c53400;
}

.kyutokipage .luhk{
 width: 100%;
 text-align: right;
font-size: 0.7rem;
}

.kyutokipage .kyutokieabox{
border-radius: 8px;
padding: 2%;
background: #fff;
display:flex;
justify-content: space-between;
flex-wrap: wrap;
margin-bottom: 5%;
}

.kyutokipage .kyutokitt{
font-weight:bold;
width: 100%;
margin-bottom: 3%;
}

.kyutokipage .kyutokieaboxle{
width: 30%;

}

.kyutokipage .kyutokieaboxri{
width: 68%;

}
.kyutokipage .kyutokieaboxri table{
border: none;
}
.kyutokipage .kyutokieaboxri th{
padding: 1%;
font-size: 0.7rem;
color: #6c3b08;
font-weight: bold;
border-bottom: solid #ddd 1px;
width: 160px;
}

.kyutokipage .kyutokieaboxri td{
padding: 1%;
font-size: 0.7rem;
border-bottom: solid #ddd 1px;
    vertical-align: middle;
}
.kyutokipage .kyutokieaboxri tr:first-child th,.kyutokipage .kyutokieaboxri tr:first-child td{
border-top: solid #ddd 1px;

}

.kyutokipage  .pric{
font-size:105%;
font-weight: bold;
color: #c53400;
}
.kyutokipage  .pricin{
font-size:270%;
font-weight: bold;
    display: inline-block;
    line-height: 1;
/*font-family:san-sarif;*/
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Noto Sans JP", Meiryo, sans-serif;
}
.kyutokipage  .eatt{
font-size:115%;
color: #6c3b08;
font-weight:bold;
}

.kyutokipage .percent{
 display: grid;
 place-items:center;
 padding: 2% 1%;
 font-weight:bold;
 font-size: 1.5rem;
 color: #fff;
 background: #c53400;
 margin-top: 2%;
 margin-bottom: 10%;
/*font-family: sans-serif;*/
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Noto Sans JP", Meiryo, sans-serif;
}
.kyutokipage .komimj{
font-size: 1rem;
font-weight: bold;
color: #6D3C09;
}

.kyutokipage .yaji{
padding-top: 20px;
width: 20px;
margin-left: 20%;
clip-path: polygon(0 100%, 100% 100%, 50% 0);
 background: #6D3C09;
}

.kyutokipage .allkomi{
 display: grid;
 place-items:center;
 padding: 2% 1%;
 font-weight:bold;
 font-size: 1rem;
 color: #fff;
 background: #6D3C09;
margin-top: -1px;
 margin-bottom: 2%;
/*font-family: sans-serif;*/
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Noto Sans JP", Meiryo, sans-serif;
}

.kyutokipage .kyutokieaboxri th.coltt{
background: #dddddd4f;
font-size: 1rem;
}

@media (max-width: 980px) {
.kyutokipage .anchorchosei{
margin-top: -160px;
padding-top: 160px;
}
}

@media (max-width: 700px) {

.kyutokipage  .lupercent{
letter-spacing: 2px;
font-size: 4.5vw;
}

.kyutokipage  .lupric{
font-size: 5.5vw;
}

.kyutokipage .kyutokieabox{
 justify-content: center;
}
.kyutokipage .kyutokieaboxle{
width: 70%;
text-align: center;
margin-bottom: 3%;
}

.kyutokipage .kyutokieaboxri{
width: 100%;
}
.kyutokipage .pcenter{
text-align:center}

.kyutokipage .komimj{
border:dashed #6D3C09 1px;
padding: 2%;
}
.kyutokipage .yaji{
display: none;
}

}
@media (max-width: 576px) {
.kyutokipage .kyutokieaboxri th,.kyutokipage .kyutokieaboxri td{
display: block;
width: 100%;
}

.kyutokipage .kyutokieaboxri th{
text-align:center;

}

.kyutokipage .kyutokieaboxri th,.kyutokipage .kyutokieaboxri td,.kyutokipage .kyutokieaboxri tr:first-child td{
border-top: none;
}

.kyutokipage .kyutokieaboxle{
width: 100%;
}

}
@media (max-width: 480px) {
.kyutokipage .anchorchosei{
margin-top: -30vw;
padding-top: 30vw;
}
}
