@charset "UTF-8";

.highbolt-title{
    background-color: #ffffff;
    text-align: center;
    margin: auto;
    padding: 30px 15px 30px 15px;
}

.highbolt-background-color{
    background-color: #d9f2d0;
}
.highbolt-title h1{
    font-size: 28px;
}
.highbolt-subtitle{
    padding: 20px 0 15px 0;
}
.highbolt-subtitle h2{
    font-size: 24px;
    border: 5px solid #28a44a;
    width: fit-content;
    border-radius: 5px;
    padding: 2px 7px;
    text-align: center;
    margin: auto;
}
.highbolt-img-position01{
    margin: 0 30px;
}
.highbolt-img01, .highbolt-img02{
    border-radius: 8px;
}
.highbolt-content01{
    padding: 15px 30px 80px 30px;
}
.highbolt-advice{
    padding: 15px 0;
}
.highbolt-subtitle h3{
    font-size: 24px;
    border: 5px solid #28a44a;
    width: fit-content;
    border-radius: 5px;
    padding: 2px 10px;
    text-align: center;
    margin: auto;
}
.highbolt-center{
    text-align: center;
    justify-content: center;
    margin: auto;
}
.highbolt-list{
    text-align: left;
    display: inline-block;
    padding: 5px 0 80px 0;
    list-style-position: inside;
}
.highbolt-content02{
    padding: 10px 30px 20px 30px;
}
.highbolt-img-position02{
    margin: 0 30px 20px 30px;
    padding-bottom: 20px;
}
.highbolt-content03{
    padding: 10px 30px 45px 30px;
}

/*デスクトップ*/
@media (min-width: 1281px){

.highbolt-title h1{
    font-size: 38px;
}
.highbolt-subtitle{
    padding: 50px 0 30px 0;
}
.highbolt-advice{
    padding: 0;
}
.highbolt-subtitle h2, .highbolt-subtitle h3{
    font-size: 30px;
}
.highbolt-content01 p, .highbolt-list li, .highbolt-content02 p, .highbolt-content03 p{
    font-size: 24px;    
}
.highbolt-list{
    padding-left: 40px;
}
.highbolt-img-position01, .highbolt-img-position02{
    margin-top: 20px;
}

.highbolt-flex01, .highbolt-flex02{
    display: flex;
    justify-content: center;
    margin: auto;
    max-width: 1300px;
}
.highbolt-img01, .highbolt-img02{
    max-width: 500px;
}
.highbolt-content03{
    margin: auto;
    max-width: 1300px;
}

.highbolt-flex01, .highbolt-flex02, .highbolt-advice{
    padding-bottom: 40px;
}
.highbolt-content03{
    padding-bottom: 80px;
}

}
/*タブレット*/
@media screen and (min-width:700px) and ( max-width:1280px) {

.highbolt-title h1{
    font-size: 32px;
}
.highbolt-subtitle{
    padding: 40px 0 20px 0;
}
.highbolt-subtitle h2, .highbolt-subtitle h3{
    font-size: 28px;
}
.highbolt-content01 p, .highbolt-list li, .highbolt-content02 p, .highbolt-content03 p{
    font-size: 24px;    
}
.highbolt-list{
    padding-left: 40px;
}
.highbolt-img-position01, .highbolt-img-position02{
    margin-top: 20px;
}
.highbolt-flex01, .highbolt-flex02{
    display: flex;
    justify-content: center;
    margin: auto;
    max-width: 900px;
}
.highbolt-img01, .highbolt-img02{
    max-width: 350px;
}
.highbolt-content03{
    margin: auto;
    max-width: 900px;
}

}