@charset "utf-8";
/* CSS Document */
@charset "UTF-8"; 
     
     
.tab-container {
    display: flex;
    flex-wrap: wrap;
    max-width: 100%;
    margin: 5px;
}
.tab-container input[type="radio"] {
    display: none;
}
.tab-container label {
    flex: 1;
    padding: 10px;
    background-color: #f1f1f1;
    text-align: center;
    cursor: pointer;
    border: 1px solid #ccc;
    border-radius:10px 10px 0 0;
}
.tab-container label:hover {
    background-color: #ddd;
}
.tab-content {
    display: none;
    flex-basis: 100%;
    padding: 10px 10px 3px 10px;
    border: 1px solid #ccc;
    border-top: none;
}
.tab-container input[type="radio"]:checked + label {
    background-color: #fff;
    border-bottom: none;
}
#tab1-1:checked ~ #content1,
#tab1-2:checked ~ #content2,
#tab1-3:checked ~ #content3,
#tab1-4:checked ~ #content4,
#tab1-5:checked ~ #content5,
#tab1-6:checked ~ #content6,
#tab1-7:checked ~ #content7,
#tab2-1:checked ~ #content1,
#tab2-2:checked ~ #content2,
#tab2-3:checked ~ #content3,
#tab2-4:checked ~ #content4,
#tab2-5:checked ~ #content5,
#tab2-6:checked ~ #content6,
#tab2-7:checked ~ #content7{
    display: block;
}
/* パーツ２　ここまで　*/
/* パーツ３　ここから　*/
/* レスポンシブ対応 */
@media (max-width: 600px) {
/*    .tab-container label:nth-of-type(n+3),
    .tab-container input:nth-of-type(n+3) {
        display: none;
    }*/
/*　スマホで縦表示にするなら消す
    .tab-container label { flex: 1 1 50%;　}
スマホで縦表示にするなら消す　*/
}
/* パーツ３　ここまで　*/


/* 料金真ん中 */
.tab-container .tengah{
	text-align:center !important;
}



.tab-container #content1 h1,.tab-container #content2 h1,.tab-container #content3 h1 ,.tab-container #content4 h1,.tab-container #content5 h1,.tab-container #content6 h1,.tab-container #content7 h1{
  position: relative;
  padding-left: 25px;

}

.tab-container #content1 h1:before {
  position: absolute;
  content: '';
  bottom: -3px;
  left: 0;
  width: 0;
  height: 0;
  border: none;
  border-left: solid 15px transparent;
  border-bottom: solid 15px #4b2e00;
}
.tab-container #content1 h1:after {
  position: absolute;
  content: '';
  bottom: -3px;
  left: 10px;
  width: 100%;
  border-bottom: solid 3px #4b2e00;
}




.tab-container #content2 h1:before {
  position: absolute;
  content: '';
  bottom: -3px;
  left: 0;
  width: 0;
  height: 0;
  border: none;
  border-left: solid 15px transparent;
  border-bottom: solid 15px #7e3b00;
}
.tab-container #content2 h1:after {
  position: absolute;
  content: '';
  bottom: -3px;
  left: 10px;
  width: 100%;
  border-bottom: solid 3px #7e3b00;
}



.tab-container #content3 h1:before {
  position: absolute;
  content: '';
  bottom: -3px;
  left: 0;
  width: 0;
  height: 0;
  border: none;
  border-left: solid 15px transparent;
  border-bottom: solid 15px #a34900;
}
.tab-container #content3 h1:after {
  position: absolute;
  content: '';
  bottom: -3px;
  left: 10px;
  width: 100%;
  border-bottom: solid 3px #a34900;
}



.tab-container #content4 h1:before {
  position: absolute;
  content: '';
  bottom: -3px;
  left: 0;
  width: 0;
  height: 0;
  border: none;
  border-left: solid 15px transparent;
  border-bottom: solid 15px #bc5f00;
}
.tab-container #content4 h1:after {
  position: absolute;
  content: '';
  bottom: -3px;
  left: 10px;
  width: 100%;
  border-bottom: solid 3px #bc5f00;
}


.tab-container #content5 h1:before {
  position: absolute;
  content: '';
  bottom: -3px;
  left: 0;
  width: 0;
  height: 0;
  border: none;
  border-left: solid 15px transparent;
  border-bottom: solid 15px #d67800;
}
.tab-container #content5 h1:after {
  position: absolute;
  content: '';
  bottom: -3px;
  left: 10px;
  width: 100%;
  border-bottom: solid 3px #d67800;
}


.tab-container #content6 h1:before {
  position: absolute;
  content: '';
  bottom: -3px;
  left: 0;
  width: 0;
  height: 0;
  border: none;
  border-left: solid 15px transparent;
  border-bottom: solid 15px #f29e00;
}
.tab-container #content6 h1:after {
  position: absolute;
  content: '';
  bottom: -3px;
  left: 10px;
  width: 100%;
  border-bottom: solid 3px #f29e00;
}

.tab-container #content7 h1:before {
  position: absolute;
  content: '';
  bottom: -3px;
  left: 0;
  width: 0;
  height: 0;
  border: none;
  border-left: solid 15px transparent;
  border-bottom: solid 15px #f2c94c;
}
.tab-container #content7 h1:after {
  position: absolute;
  content: '';
  bottom: -3px;
  left: 10px;
  width: 100%;
  border-bottom: solid 3px #f2c94c;
}