@charset "utf-8";

/*--- tb ---*/
@media screen and (min-width: 768px) and (max-width: 979px) {
    #contents div.h1_basic02Wrap.bdn {
        height: auto;
        width: auto;
        margin: 0 20px 0;
    }

    #contents div.h1_basic01Wrap.short {
        width: 100%;
        height: 146px;

    }
}

@media screen and (min-width: 768px) and (max-width: 979px) {


    .tabmenu01Wrap {
        margin: 30px 0 0 0;
    }

    .tabmenu_csr {
        display: table;
        width: 100%;
        border-right: none;
        box-sizing: border-box;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        margin-bottom: 30px;
    }

    /* 7月までメニュー項目3
    .tabmenu_csr>li {
        display: table-cell;
        min-height: 38px;
        border-left: 1px solid #ccc;
        width: 33.333%;
    }

    .tabmenu_csr>li:nth-child(1) {
        display: table-cell;
        min-height: 38px;
        border-left: none;
        width: 33.333%;
    } */

    /* 8月からメニュー項目4*/
    .tabmenu_csr>li {
        display: table-cell;
        min-height: 38px;
        border-left: 1px solid #ccc;
        width: 25%;
    }

    .tabmenu_csr>li:nth-child(1) {
        display: table-cell;
        min-height: 38px;
        border-left: none;
        width: 25%;
    }

    .tabmenu_csr>li a {
        display: flex;
        align-items: flex-start;
        justify-content: center;
        padding: 6px 20px 6px 10px;
        background-color: #fff;
        color: #333;
        font-size: 100%;
        text-decoration: none;
        text-align: left;
    }

    .tabmenu_csr>li a:hover,
    .tabmenu_csr>li a:focus {
        background-color: #ffffff;
    }

    .tabmenu_csr>li.current a {
        background-color: #ffffff;
    }

    .tabmenu_csr>li a img {
        padding: 6px 10px;
        text-align: center;
    }

    /* ---------- #indexSec00 top_section_enviroment ---------- */
    #index_01 {
        width: 100%;
        height: auto;
        position: relative;
        padding: 15px;
        box-sizing: border-box;
        margin-top: 0px;
        margin-bottom: 20px;
    }

    #index_01>.top_section_enviroment {
        width: 100%;
        height: 100%;
        display: block;
        position: absolute;
        overflow: hidden;
        box-sizing: border-box;
        top: 0;
        left: 0;
        padding: 15px;
    }

    #index_01>.top_section_enviroment a::after {
        width: 100%;
        height: 100%;
        display: block;
        top: 0;
        left: 0;
        position: absolute;
        content: "";
        background-image: url(/csr/images/top/top_section_enviroment_sp.jpg);
        background-repeat: no-repeat;
        background-position: 0 -30px;
        background-size: cover;
        transform: scale(1);

    }

    #index_01>.top_section_enviroment a:hover::after {
        transform: scale(1);
        opacity: 1;
    }

    /* ---------- #indexSec00 top_section_society ---------- */
    #index_02 {
        width: 100%;
        height: auto;
        position: relative;
        padding: 15px;
        box-sizing: border-box;
        display: flex;
        flex-direction: row-reverse;
        margin-top: 20px;
    }

    #index_02>.top_section_society {
        width: 100%;
        height: 100%;
        display: block;
        position: absolute;
        overflow: hidden;
        box-sizing: border-box;
        padding: 15px;
        top: 0;
        left: 0;
    }

    #index_02>.top_section_society a::after {
        width: 100%;
        height: 100%;
        display: block;
        top: 0;
        left: 0;
        position: absolute;
        content: "";
        background-image: url(/csr/images/top/top_section_society_sp.jpg);
        background-repeat: no-repeat;
        background-position: 0 -180px;
        background-size: cover;
        transform: scale(1);

    }

    #index_02>.top_section_society a:hover::after {
        transform: scale(1);
        opacity: 1;
    }


    /* ---------- #indexSec03 top_section_governance ---------- */
    #index_03 {
        width: 100%;
        height: auto;
        position: relative;
        padding: 15px;
        box-sizing: border-box;
        margin-top: 20px;
    }

    #index_03>.top_section_governance {
        width: 100%;
        height: 100%;
        display: block;
        position: absolute;
        overflow: hidden;
        box-sizing: border-box;
        padding: 15px;
        top: 0;
        left: 0;
    }

    #index_03>.top_section_governance a::after {
        width: 100%;
        height: 100%;
        display: block;
        top: 0;
        left: 0;
        position: absolute;
        content: "";
        background-image: url(/csr/images/top/top_section_governance_sp.jpg);
        background-repeat: no-repeat;
        background-position: 0 -55px;
        background-size: cover;
        transform: scale(1);

    }

    #index_03>.top_section_governance a:hover::after {
        transform: scale(1);
        opacity: 1;
    }

    /* section left*/
    .text-block_l {
        width: 100%;
        height: auto;
        min-height: auto;
        padding: 40px 15px;
        background-color: #fff;
        box-sizing: border-box;
        z-index: 1;
        display: block;
        position: relative;
        margin-top: 250px;
    }

    .text-block_l h3 {
        font-size: 18px;
        margin-bottom: 15px;
        line-height: 1;
        font-weight: 600 !important;
    }

    .text-block_l p {
        font-size: 14px;
        line-height: 30px;
        margin-bottom: 25px;
    }

    .text-block_l ul {
        margin: 0px;
        margin-bottom: -15px;
    }

    .text-block_l ul li {
        margin-right: 20px;
        margin-bottom: 10px;
        font-weight: normal;
        position: relative;
        padding-left: 15px;
        padding-right: 0 !important;
        font-weight: 600 !important;
    }

    .text-block_l ul li:last-child::after {
        border-right: none;
    }

    .text-block_l ul li a {
        transition: all.3s ease;
    }

    .text-block_l ul li a:hover {
        color: #f40004;
        text-decoration: none;
    }

    .text-block_l ul li a:visited {
        color: none;
        text-decoration: none;
    }

    .text-block_l ul li a:visited {
        color: none;
        text-decoration: none;
    }

    .text-block_l div.btn_rw {
        width: fit-content;
        display: inline-block;
        font-weight: 600 !important;
    }

    .text-block_l div.btn_rw a {
        color: none;
        text-decoration: none;
    }

    .text-block_l div.btn_rw a:visited {
        color: none;
        text-decoration: none;
    }

    /* section right*/
    .text-block_r {
        width: 100%;
        height: auto;
        min-height: auto;
        padding: 40px 15px;
        background-color: #fff;
        box-sizing: border-box;
        z-index: 1;
        display: block;
        position: relative;
        margin-top: 250px;
    }

    .text-block_r::after {
        clear: both;
    }

    .text-block_r h3 {
        font-size: 18px;
        margin-bottom: 25px;
        line-height: 1;
        font-weight: 600 !important;
    }

    .text-block_r p {
        font-size: 14px;
        line-height: 30px;
        margin-bottom: 25px;
    }

    .text-block_r ul {
        margin: 0px;
        margin-bottom: -15px;
    }

    .text-block_r ul li {
        margin-right: 20px;
        margin-bottom: 10px;
        font-weight: normal;
        position: relative;
        padding-left: 15px;
        padding-right: 0 !important;
        font-weight: 600 !important;
    }

    .text-block_r ul li a {
        transition: all.3s ease;
    }

    .text-block_r ul li a:hover {
        color: #f40004;
        text-decoration: none;
    }

    .text-block_r ul li a:visited {
        color: none;
        text-decoration: none;
    }

    .text-block_r ul li:last-child::after {
        border-right: none;
    }

    .text-block_r div.btn_rw {
        width: fit-content;
        display: inline-block;
        font-weight: 600 !important;
    }

    .text-block_r div.btn_rw a {
        color: none;
        text-decoration: none;
    }

    .text-block_r div.btn_rw a:visited {
        color: none;
        text-decoration: none;
    }

    /* --- btn ---*/

    .imgHero_btn_l {
        position: relative;
        width: auto;
        transform: scale(0.8);
        left: -15px;
        bottom: 0;
    }

    a div.imgHero_btn {
        width: fit-content;
        padding: 13px 12px 13px 20px;
        border-radius: 30px;
        background-color: #fff;
        border: solid 1px #ccc;
        align-items: center;
        justify-content: flex-start;
        font-size: 16px;
        line-height: 1;
        z-index: 1;
        margin: 0 0 40px 0;
        font-weight: 600 !important;
    }

    a div.imgHero_btn span {
        padding: 0;
        color: #333;
        line-height: 1;
        transition: all.3s ease;
    }

    a div.imgHero_btn span:nth-child(2) {
        padding: 0;
        margin-left: 15px;
        color: #999999;
        transition: all.3s ease;
        line-height: 1;
    }

    a:hover div .imgHero_btn span {
        padding: 0;
        color: #f40004;
        text-decoration: none;
        line-height: 1;
    }

    a:hover div .imgHero_btn span:nth-child(2) {
        padding: 0;
        margin-left: 15px;
        color: #f40004;
        line-height: 1;
    }

    a:hover div .imgHero_btn span {
        padding: 0;
        color: #333;
        text-decoration: none;
        line-height: 1;
    }

    a:hover div .imgHero_btn span:nth-child(2) {
        padding: 0;
        margin-left: 15px;
        color: #999999;
        line-height: 1;
    }


    /* !topics
---------------------------------------------------------- */
    .indexSec03_bg {
        background-color: #f3f3f3;
        padding-bottom: 60px;
        min-width: auto;
    }

    .topics_block {
        width: auto;
        margin: 0 auto;
        text-align: left;
    }

    .h2_basic_wide_Wrap {
        margin-bottom: 10px;
        padding: 0px 0 9px;
        background: url(/common/images/bg_h2_border_wide.gif) no-repeat left bottom;
    }

    #indexSec03 .indexBox01Wrap>ul.col4 {
        margin-left: -20px;
    }

    #indexSec03 .indexBox01Wrap>ul.col4>li {
        width: calc(25% - 20px);
        margin-left: 20px;
        box-sizing: border-box;
    }

    .hr {
        border: solid 1px #cccccc;
    }

    .indexSec01 .indexSec01_in {
        position: relative;
        width: 100%;
        max-width: 1536px;
        margin: 0 auto;
        transition: top .5s;
    }

    .indexSec01 .indexSec01_in {
        width: calc(100% - 10%);
    }

    /* !#indexSec03
---------------------------------------------------------- */
    #indexSec03 {
        margin-top: 0px;
        padding: 40px 20px;
    }

    .h2_basic_wide_Wrap {
        margin-bottom: 30px;
        padding: 0px 0 9px;
        background: url(/common/images/bg_h2_border_wide.gif) no-repeat left bottom;
    }

    .news_thumbnail {
        width: calc(100% / 3 - 20px);
        margin-left: 20px;
        position: relative;
        margin-bottom: 50px;
    }

    #indexSec03 .indexBox01Wrap .col4 .indexBox01 {
        padding-top: 10px;
        padding-bottom: 10px;
        height: 46px;
        display: flex;
        align-items: center;
    }

    #indexSec03 .indexBox01Wrap .col4 .indexBox01 .h3_arrow01 {
        display: table;
        background-position: left center;
        min-height: 30px;
    }

    #indexSec03 .indexBox01Wrap .col4 .indexBox01 .h3_arrow01 a {
        display: table-cell;
        vertical-align: middle;
    }

    .border01 {
        margin: 0 !important;
    }

    #breadcrumb.breadcrumb-wide ul {
        width: auto !important;
    }
}