
/*　調整 */
@media (max-width:1350px) {
    .mainvisual-frame .mainvisual-subtitle-shape{
       display: none;
    }
}
@media (min-width:981px) {

    body{
      /*
        min-width: 1350px;
        */
    }

    /* mainvisual-frame */
    .mainvisual-frame{
        width:100vw;
        /*
        min-width: 1350px;
        */
        height: 620px;
        background:url(/wp/img/ethical/main-visual.png) no-repeat;
        background-size: cover;
        background-position: center bottom;
        position: relative;
    }


    .mainvisul-title-layout{
        position: absolute;
        /*height:22.31930103%;*/
        bottom:22.31930103%;
        max-width: 1350px;
    }


    .mainvisual-frame .mainvisual-title {
        font-size: 48px;
        color: rgb(16, 16, 16);
        font-weight: bold;
        line-height: 0.524;
        letter-spacing: 0.05em;

        position: relative;
        top:0;
        left: 115px;

    }


    .mainvisual-frame .mainvisual-subtitle-layout{
        display: flex;
        align-items: center;
        margin-top: 44px;

        position: relative;
        top:0;
        left: 88px;

    }
    .mainvisual-frame .mainvisual-subtitle {
        font-size: 48px;
        color: rgb(16, 16, 16);
        font-weight: bold;
        letter-spacing: 0.05em;
        line-height: 0.524;

    }

    .mainvisual-frame .mainvisual-subtitle .letter-sp{
        letter-spacing: -24px;
    }

    .mainvisual-frame .mainvisual-subtitle-shape{
        margin-left:49px;
        vertical-align: middle;
    }

    .mainvisual-frame .mainvisual-description {
        max-width:1350px;
        font-size: 20px;
        color: rgb(16, 16, 16);
        font-weight: bold;
        line-height: 1.35;
        letter-spacing: 0.05em;
        margin-top: 35px;

        position: relative;
        top:0;
        left: 105px;

    }
    .mainvisual-frame .mainvisual-description .bold{
    color: #c10000;
    }
    .mainvisual-frame .mainvisual-description .block-indent{
      padding-left: 10px;
    }
    /* mainvisual-frame */

    /* lca-frame */
    .lca-frame .lca-title {
        font-size: 36px;
        color: rgb(16, 16, 16);
        font-weight: bold;
        line-height: 0.532;
        letter-spacing: 0.05em;
    }
    .lca-frame .lca-contents .pc-only{
        display: flex;
        justify-content: center;
    }
    .lca-frame .lca-contents .top-size{
        width:50%;
    }
    .lca-frame .lca-contents-image{
        padding:0px 37px 0 33px;
    }
    .lca-frame .lca-description{
        font-size: 16px;
        color: rgb(16, 16, 16);
        line-height: 1.875;
        letter-spacing: 0.085em;
        padding:0px 24px 0 21px;
        margin-top:-7.5px;
    }

    .lca-frame .lca-description.margin{
        margin-top:20px;
        letter-spacing: 0.065em;
    }
    .lca-frame .bold{
        color: #c10000;
    }
    .lca-frame .break::before{
        content: "\A";
        white-space: pre;
    }

    /* lca-frame */


    /* co2-frame */
    .co2-frame{

    }
    .co2-frame .co2-title {
        font-size: 36px;
        color: rgb(16, 16, 16);
        font-weight: bold;
        line-height: 0.532;
        letter-spacing: 0.05em;
        padding-left: 11px;

    }
    .co2-frame .co2-title .bold{
        color: #c10000;
    }
    .co2-frame .co2-description{
        font-size: 16px;
        color: rgb(16, 16, 16);
        line-height: 1.875;
        letter-spacing: 0.025em;
    }
    .co2-frame .co2-description.top{
        position: relative;
        top: -7.5px;
    }
    .co2-frame .co2-description.top{
        margin-bottom: 13.5px;
    }
    .co2-frame .co2-description.bottom{
        margin-top: 50px;
    }

    .co2-frame .co2-image-area{
        position: relative;
    }
    .co2-frame .co2-contents-image{
        position: relative;
        left:204px;
    }

    .co2-frame .co2-image-source{
        position: absolute;
        bottom: 10px;
        right:17px;
        font-size: 1.1rem;
        color: rgb(16, 16, 16);
        line-height: 0.909;
        letter-spacing: 0.025rem;
    }


    /* co2-frame */

    /* ethical-frame */
    .ethical-frame{

    }
    .ethical-frame .ethical-title {
        font-size: 36px;
        color: rgb(16, 16, 16);
        font-weight: bold;
        line-height: 0.532;
        letter-spacing: 0.05em;

    }
    .ethical-frame .ethical-contents .pc-only{
        display: flex;
        justify-content: center;
    }
    .ethical-frame .ethical-contents .pc-only .top-size.left{
        min-width: 340px;
    }
    .ethical-frame .ethical-contents .pc-only .top-size.right{
        position: relative;
        top:-7.5px;
    }

    .ethical-frame .ethical-contents-image{
        margin-left: 45px   ;
        vertical-align: middle;
        display: block;
    }
    .ethical-frame .ethical-description{
        font-size: 16px;
        color: rgb(16, 16, 16);
        line-height: 1.875;
        letter-spacing: 0.025em;
        width:554.53px;

    }
    .ethical-frame .ethical-description.margin{
        margin-top:12.5px;
        width:557px;
    }
    .ethical-frame .ethical-description .half-s{
        font-size: 16px;
        padding: 0;
        width: 4px;
        position: relative;
        left: -10px;
        font-family: "YuGothic";
        letter-spacing: -12px;
    }
    .ethical-frame .ethical-description .va{
        letter-spacing: 0.045em;
    }
    .ethical-frame .bold{
        color: #c10000;
    }
    /* ethical-frame */


    /* sdgs-frame */
    .sdgs-frame{

    }
    .sdgs-frame .sdgs-title {
        font-size: 36px;
        color: rgb(16, 16, 16);
        font-weight: bold;
        line-height: 0.532;
        letter-spacing: 0.05em;
    }
    .sdgs-frame .sdgs-description{
        font-size: 16px;
        font-family: "YuGothic";
        color: rgb(16, 16, 16);
        line-height: 1.875;
        letter-spacing: 0.025em;
        margin-top: calc(30px - 7.5px);
    }
    .sdgs-frame .sdgs-description .bold{
        color: #c10000;
    }

    /* sdgs-frame */


    /* ethical-working-frame */
    .ethical-working-frame{

    }
    .ethical-working-frame .ethical-working-title {
        font-size: 36px;
        color: rgb(16, 16, 16);
        font-weight: bold;
        line-height: 0.532;
        letter-spacing: 0.05em;
    }
    .ethical-working-frame .ethical-working-title .bold{
        color: #c10000;
    }
    .ethical-working-frame .ethical-working-description{
        font-size: 16px;
        color: rgb(16, 16, 16);
        line-height: 1.875;
        letter-spacing: 0.025em;
    }
    .ethical-working-frame .ethical-working-description.top{
        margin-bottom:18px;
        position: relative;
        top:-7.5px;
    }
    .ethical-working-frame .ethical-working-description.center{
        margin-top:calc(31px - 10px);
    }

    .ethical-working-frame .ethical-working-description.bottom{
        margin:20px 0 18.5px;
    }
    .ethical-working-frame .ethical-contents-image{

    }
    .ethical-working-frame .ethical-contents-image.arrow{
        margin-top:50px;
        width: calc(100% + 40px);
        position: relative;
        left: -20px;
        display: block;
    }
    .ethical-working-frame .ethical-contents-topic-area{
        padding: 0px 51px 0 54px;
    }
    .ethical-working-frame .ethical-contents-torikumi{
        margin:32px 0 22px;
        color: rgb(16, 16, 16);
        font-weight: bold;
        font-size: 30px;
        line-height: 1;
        position: relative;
        top: -8px;
        display: flex;
        align-items: center;
    }

    .ethical-working-frame .ethical-contents-torikumi::before {
        font-size: 34px;
        content: "";
        background: url(/wp/img/ethical/arrow_left.png) no-repeat;
        background-size: contain;
        background-position: center center;
        position: relative;
        width: 20px;
        height: 20px;
        margin-right: 3px;
    }

    .ethical-working-frame .ethical-contents-torikumi::after {
        font-size: 34px;
        content: "";
        background: url(/wp/img/ethical/arrow_right.png) no-repeat;
        background-size: contain;
        background-position: center center;
        position: relative;
        width: 20px;
        height: 20px;
        margin-left: 3px;
    }
    .ethical-working-frame .ethical-contents-topic-unit{
    }
    .ethical-working-frame .ethical-contents-topic{
        border-style: solid;
        border-width: 2px;
        border-color: rgb(89, 87, 87);
        background-color: #f7f7f7;
        height:45px;
        font-size: 18px;
        color: rgb(16, 16, 16);
        font-weight: bold;
        line-height: 1.667;
        padding-left: 48px;
        display: flex;
        align-items: center;

    }
    .ethical-working-frame .ethical-contents-topic::before{
        content: "■";
        margin-right: 0.5em;
    }

    .ethical-working-frame .ethical-contents-topic-description{
        margin:10px 0 25px;
        font-size: 16px;
        font-family: "YuGothic";
        color: rgb(16, 16, 16);
        line-height: 1.5;
        letter-spacing: 0.025em;
    }
    /* ethical-working-frame */


    /* procut-frame */
    .procut-frame{

    }
    .procut-frame.contents-frame .contents-title-area{
        margin-bottom: 21px;
    }
    .procut-frame .procut-title {
        font-size: 36px;
        color: rgb(16, 16, 16);
        font-weight: bold;
        line-height: 0.532;
        letter-spacing: 0.05em;
    }
    .procut-frame .procut-title .bold{
        color: #c10000;
    }
    .procut-frame .procut-contents{
        display: flex;
        justify-content: center;
    }
    .procut-frame .products-unit{
        width:293px;
    }
    .procut-frame .products-unit.center{
        margin:0 30px;
    }
    .procut-frame .product-unit-link{
        margin-top:8px;
    }
    .procut-frame .product-unit-link.button-layout-more{
        width:100%;
        font-size: 18px;
        color: rgb(0, 0, 0);
        letter-spacing:0.025px;
        white-space: nowrap;
    }
    .procut-frame .product-unit-link .small{
        font-size: 14px;
    }
    .procut-frame .product-unit-link .half-s{
        font-size: 18px;
        padding: 0;
        width: 4px;
        position: relative;
        left: -12px;
        font-family: "YuGothic";
    }
    .procut-frame .product-unit-link .half-e{
        font-size: 18px;
        padding: 0;
        width: 4px;
        position: relative;
        left: -4px;
        font-family: "YuGothic";
    }
    .procut-frame .product-unit-link.button-layout-more.madoba{
        padding : 15px 10px 15px 5px;
    }
    .procut-frame .product-unit-link.button-layout-more.funiture{
        padding : 15px 10px 15px 5px;
    }
    .procut-frame .adwards-title {
        font-size: 30px;
        color: rgb(16, 16, 16);
        font-weight: bold;
        line-height: 1;
        display: flex;
        align-items: center;
        letter-spacing: 0.025em;
        margin-top: 70px;
    }
    .procut-frame .adwards-title::before {
        content: "";
        height: 30px;
        width: 7px;
        background: black;
        margin-right: 12px;
    }
    .procut-frame .adwards-title .bold{
        color: #c10000;
    }
    .procut-frame .adwards-contents {
        background-color: rgb(255, 255, 255);
        margin-top: 31px;
        padding: 12px 0;
    }
    .procut-frame .adwards-unit {
        margin: 0 0 12px 30px;
        width: 480px;
    }

    .procut-frame .adwards-unit.last{
        padding-bottom:0px;

    }
    .procut-frame .adwards-unit-link.button-layout-more::before{
        content: "・";
        margin-right: 3px;
    }
    .procut-frame .adwards-unit-link.button-layout-more {
        font-size: 16px;
        font-family: "YuGothic";
        color: rgb(16, 16, 16);
        font-weight: bold;
        line-height: 1.5;
        padding:10px 10px;
    }
    .procut-frame .button-layout-more{
        width:100%;
    }

    /* procut-frame */


    /* bottom-frame */
    .bottom-frame{
        position: relative;
        padding-bottom: 30px;
    }
    .bottom-frame .bottom-title {
        font-size: 36px;
        color: rgb(16, 16, 16);
        font-weight: bold;
        line-height: 0.532;
        letter-spacing: 0.05em;
    }

    .bottom-frame .bottom-title .bold{
        color: #c10000;
    }
    .bottom-frame .bottom-contents {
        display: flex;
        align-items: flex-end;
        justify-content: flex-end;
    }
    .bottom-frame .bottom-contents .facebook{
        width:43px;
    }
    .bottom-frame .bottom-contents .insta{
        margin-left: 20px;
        width:37px;
    }
    /* bottom-frame */
}
