@charset "utf-8";

/*===========================================================
伊賀牛のこだわり
===========================================================*/

.commitment01Block01 {
    position: relative;
}

.commitment01ImgBox {
    position: relative;
}

.commitment01ImgBox::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: rgba(85, 48, 12, .55);
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto;
}

.commitment01ImgBox01 {
    max-width: 707px;
    width: 80%;
}

.commitment01ImgBox01 img {
    display: block;
    width: 100%;
    height: auto;
}

.commitment01TitleBox01 {
    margin: -40px 0 0;
    text-align: right;
}

.commitment01Block02 {
    margin: 40px 0 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
}

.commitment01TitleBox02 {
    margin: -43px auto 0;
}

.commitment01ImgBox02 {
    max-width: 478px;
    width: 100%;
}

.commitment01TextBox02 {
    margin: 20px 0 0;
    max-width: 478px;
    width: 100%;
}

.commitment01Title02 {
    font-size: clamp(25px, 24.272px + 0.194vw, 28px);
    letter-spacing: 0.05em;
    font-family: var(--fontB);
}

.commitment01Title01 {
font-size: clamp(25px, 19.417px + 1.489vw, 48px);
    letter-spacing: 0.05em;
    font-family: var(--fontB);
}

.commitment01Title01 s{
    text-decoration: none;
    font-size: clamp(36px, 28.233px + 2.071vw, 68px);
}

.commitment02Block {
    margin: 60px 0 0;
}

.commitment02Block:first-child {
    margin: 0;
}

.commitment02Area {
    background-image: url(/system_panel/uploads/images/cmn_bg03.jpg);
    background-attachment: scroll;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
@media screen and (min-width:414px) {


    /*===========================================================

===========================================================*/



}

/* min-width: 414px ここまで */


/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
@media screen and (min-width:544px) {


    /*===========================================================

===========================================================*/



}

/* min-width: 544px ここまで */


/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
@media screen and (min-width: 768px) {


    /*===========================================================

===========================================================*/

    .commitment01ImgBox01 {
        width: 61%;
    }

    .commitment01TitleBox01 {
        position: absolute;
        right: 0;
        top: 72%;
        transform: translateY(-50%);
        text-align: left;
    }

    .commitment01Block02 {
        margin: -20px 0 0;
        padding: 0 8% 0 0;
        flex-direction: row-reverse;
        align-items: flex-end;
        justify-content: space-between;
    }

    .commitment01TitleBox02 {
        margin: 0;
        position: absolute;
        top: 5%;
        right: 0;
    }

    .commitment01ImgBox02 {
        max-width: 478px;
        width: 41.7%;
    }

    .commitment01TextBox02 {
        margin: 0 0 -2vw 0;
        max-width: 550px;
        width: 50%;
    }

    .commitment02Block {
        margin: 80px 0 0;
    }

}

/* min-width: 768px ここまで */


/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
@media screen and (min-width: 1024px) {


    /*===========================================================

===========================================================*/

    .commitment02Block {
        margin: 100px 0 0;
    }

    .commitment01TextBox02 {
        margin: 0;
    }

}

/* min-width: 1024px ここまで */


/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
@media screen and (min-width:1200px) {

    .commitment01TitleBox02 {
        top: 10%;
    }

    .commitment01Block02 {
        margin: -50px 0 0;
    }

    /*===========================================================

===========================================================*/



}

/* min-width: 1200px ここまで */


/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
@media screen and (min-width:1440px) {


    /*===========================================================

===========================================================*/



}

/* min-width: 1440px ここまで */


/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
@media screen and (min-width:1620px) {}

/* min-width: 1520px ここまで */

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */