@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@600;700&display=swap');

/*-----------------------------------------------------------------------font-----

font-family: "Belleza", sans-serif;
font-family: 'Raleway', sans-serif;
font-family: 'Roboto', sans-serif;
font-family: 'Shippori Mincho', serif;
font-family: 'Playfair Display', serif;

-------------------------------------------------------------------------font-----*/

.text{
    font-size: 15px;
    font-size: 1.5rem;
    line-height: 1.7;
    font-family: 'Shippori Mincho', serif;
}

.text .note{
    font-size: 12px;
    font-size: 1.2rem;
}

.sec-product{
    margin-bottom: 140px;
}

.sec-product .flexBox{
    display: flex;
    justify-content: space-between;
    align-items: baseline;
}

.sec-product .flexBox .ttl{
    width: 40%;
    margin-right: 5%;
}

.sec-product .flexBox .ttl .headBig{
    font-size: 90px;
    font-size: 9.0rem;
    font-weight: 500;
    line-height: 1.2;
    font-family: "Belleza", sans-serif;
}

.sec-product .flexBox .ttl small{
    border-bottom: 1px solid #000;
    font-size: 21px;
    font-size: 2.1rem;
    font-family: 'Shippori Mincho', serif;
    display: inline-block;
    margin-bottom: 20px;
}

.sec-product .flexBox .detail{
    width: 55%;
}

.sec-product .flexBox .detail .head01{
    font-size: 21px;
    font-size: 2.1rem;
    line-height: 1.7;
    font-family: 'Shippori Mincho', serif;
    font-weight: 500;
    margin-bottom: 30px;
}

.mainImg {
    width: 100%;
    margin-bottom: 140px;
}

.mainImg img {
    width: 100%;
}

.productList .hairCare{
    border-bottom: 1px solid #dddddd;
    margin-bottom: 90px;
    padding-bottom: 80px;
}

.productList .color{
    margin-bottom: 140px;
}

.productList .head02{
    font-size: 32px;
    font-size: 3.2rem;
    font-family: 'Shippori Mincho', serif;
    margin-bottom: 110px;
    text-align: center
}

.productList .head02 small{
    display: block;
    font-family: "Belleza", sans-serif;
    font-size: 14px;
    font-size: 1.4rem;
}

.productList ul .flexBox{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 60px;
}

.productList ul .flexBox .img{
    width: 48%;
}

.productList ul .flexBox .detail{
    width: 48%;
}

.productList ul .flexBox .head03{
    font-size: 32px;
    font-size: 3.2rem;
    font-family: 'Playfair Display', serif;
    font-weight: bold;
    text-align: center;
    margin-bottom: 50px;
}

.productList ul .flexBox .head03 small{
    display: block;
    font-size: 14px;
    font-size: 1.4rem;
    font-family: 'Shippori Mincho', serif;
    font-weight: 500;
}

.productList ul .flexBox .detail .head04{
    font-size: 21px;
    font-size: 2.1rem;
    font-family: 'Shippori Mincho', serif;
    font-weight: 500;
    text-align: center;
    margin-bottom: 30px;
}



@media screen and (max-width: 1245px){
.sec-product .flexBox .ttl .headBig {
    font-size: 8.0rem;
}

.productList ul .flexBox .detail .head04 {
    font-size: 1.8rem;
}

}

@media screen and (max-width: 1120px) {

.sec-product {
    margin-bottom: 80px;
}

.mainImg {
    margin-bottom: 80px;
}

.productList .hairCare {
    margin-bottom: 60px;
    padding-bottom: 20px;
}

.productList .color {
    margin-bottom: 100px;
}

.productList .head02 {
    font-size: 2.6rem;
    margin-bottom: 40px;
}

.sec-product .flexBox .ttl .headBig {
    font-size: 7rem;
}

.productList ul .flexBox {
    margin-bottom: 40px;
}
}

@media screen and (max-width: 990px) {

.sec-product .flexBox .ttl {
    width: 45%;
    margin-right: 2%;
}

.sec-product .flexBox .detail {
    width: 53%;
}

.sec-product .flexBox .ttl small {
    font-size: 1.8rem;
}    

.sec-product .flexBox .ttl .headBig {
    font-size: 6.3rem;
}

.productList ul .flexBox .head03 {
    margin-bottom: 30px;
}
}

@media screen and (max-width: 834px) {

.sec-product {
    margin-bottom: 30px;
}

.sec-product .flexBox .ttl .headBig {
    font-size: 3.6rem;
}

.sec-product .flexBox .ttl small {
    font-size: 1.3rem;
}

.sec-product .flexBox .detail .head01 {
    font-size: 1.8rem;
}    

.mainImg {
    margin-bottom: 60px;
    height: 200px;
}

.mainImg .slick-slide{
    height: 200px;
}

.mainImg img {
    height: 200px;
    width: auto;
}

.productList .head02 {
    font-size: 2.2rem;
}

.sec-product .flexBox {
    display: block;
}

.sec-product .flexBox .ttl {
    width: 100%;
    margin: 0 0 25px;
}

.sec-product .flexBox .detail {
    width: 100%;
}

.productList ul .flexBox {
    display: block;
}

.productList ul .flexBox .img {
    margin-bottom: 25px;
    width: 100%;
}

.productList ul .flexBox .img img{
    width: 100%;
}

.productList ul .flexBox .detail {
    width: 100%;
}

.productList ul .flexBox .detail .head04 {
    font-size: 1.6rem;
    margin-bottom: 20px;
}

.productList ul .flexBox .head03 {
    font-size: 2.4rem;
    margin-bottom: 20px;
}    

}

@media screen and (max-width: 675px) {


}