@charset "UTF-8";

* {
    margin: 0;
    padding: 0;
}
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* SP版のみ適用
----------------------------------------------------------------------------- */
@media (max-width: 768px) {
  .hide-on-sp {
    display: none;
  }
}

/* common module css
----------------------------------------------------------------------------- */

.wrapper {
  width: 100%;
  margin: 0 auto;
}

@media (min-width: 768px) {
.wrapper {
max-width: 1060px;
}
}

.w-inner{
padding-right:5rem;
padding-left:5rem;
}


/* SP版のみ適用
----------------------------------------------------------------------------- */
@media screen and (max-width: 480px) {
  .wrapper {
    width: 100%;
  }
.w-inner{
padding-right:2rem;
padding-left:2rem;
}
}


/* モジュール確認用CSS */
.section-area_h1 {
  margin-bottom: 5rem;
  margin-top: 8rem;
}
.section-area_h2 {
  margin-bottom: 6rem;
}
.section-area_h3 {
  margin-bottom: 5rem;
}

@media screen and (max-width: 768px) {
.section-area_h1 {
  margin-bottom: 3rem;
  margin-top: 4rem;
}
}

/* pankuzu_color
----------------------------------------------------------------------------- */
.pankuzu_cl{
color:#0F0F0F;
}

.pankuzu_cl a{
color:#103861;
}

.pankuzu_cl a:hover{
color:#D7092F;
}


/* mod-title_h1
----------------------------------------------------------------------------- */

.mod-title_h1 {
  font-size: 3em;
  font-weight: bold;
  line-height: 1.5;
}

/*SP*/

@media screen and (max-width: 768px) {
  .mod-title_h1 {
    font-size: 1.85em;
  }
}


/* mod-title_h2
----------------------------------------------------------------------------- */

.mod-title_h2 {
  font-size: 2em;
  font-weight: bold;
  line-height: 3em;
  margin-bottom: 1rem;
}


/*SP*/

@media screen and (max-width: 768px) {
  .mod-title_h2 {
    font-size: 1.4em;
    margin-bottom: 3rem;
    line-height: 1.4em;
  }
}


/*SP*/


/* mod-list_number
----------------------------------------------------------------------------- */
.mod-list_number {
  list-style-type: none;
  counter-reset: number-first;
  padding-top:3rem;
  font-weight:bold;
}

.mod-list_number>li {
  position: relative;
  margin-bottom: 2rem;
  padding-left: 2rem;
}

.mod-list_number>li::before {
  position: absolute;
  display: block;
  text-align: right;
  content: counter(number-first)".";
  counter-increment: number-first;
  left: -0.8rem;
  width: 24px;
}

/*SP*/

@media screen and (max-width: 768px) {
.mod-list_number>li::before {
  left: -1rem;
}
.mod-list_number>li {
  padding-left: 1.8rem;
}
}


/*SP*/

.mod-list_disc {
  font-weight:normal;
  margin-top:1rem;
}

.mod-list_disc > li {
position:relative;
padding-left:1em;
}

.mod-list_disc > li::before {
content:"";
position:absolute;
top:.8em;
left:4px;
display:inline-block;
width:4px;
height:4px;
margin-top:-2px;
background-color:#333;
border-radius:50%;
}


.t_right {
text-align:right!important;
}

/* guideline-list
----------------------------------------------------------------------------- */

.guideline-list__row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    -moz-column-gap: 4rem;
    column-gap: 4rem ;
    row-gap: 4rem; 
    padding: 0 10rem;
}

.guideline-list_box {
    display: flex;
    align-items: flex-start;
    padding: 6rem 0rem 0rem;
    gap: 2rem;
    border-radius: 1rem;
}

.c-button--pdf {
    position: relative;
}

.c-button--pdf:after {
    position: absolute;
    top: 50%;
    right: 2em;
    width: 24px;
    height: 24px;
    transform: translateY(-50%);
    background: transparent url(/company/sustainability/assets/images/icon_pdf.webp) no-repeat center center / cover;
    content: "";
}
@media (max-width: 1200px) {
    .c-button--pdf:after {
        right: 1em;
    }
}

.guideline-list__button {
    display: inline-block;
    margin: 0;
    padding: 1.5rem clamp(2rem, 5vw, 4rem) 1.5rem 1rem;
    border: 2px solid #1e4191;
    background-image: none;
    background-color: #fff;
    color: #1e4191;
    font-weight: 700;
    font-size: 1.6rem;
    line-height: 160%;
    letter-spacing: .56px;
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    -webkit-appearance: none;
    width: 100%;
    box-sizing: border-box; /* ← パディング込みで幅計算 */
}

.guideline-list__button:hover, .guideline-list__button:focus {
    outline: none;
    color: #1e4191;
    text-decoration: none;
}

.guideline-list__button:not(:disabled) {
    cursor: pointer;
}

@media (hover: hover) and (pointer: fine) {
    .guideline-list__button:hover {
        border: 2px solid #1E4191;
        background-color: #1e4191;
        color: #fff;
        text-decoration: none;
    }
}

@media screen and (max-width: 767.98px) {
    .guideline-list__row {
        grid-template-columns: repeat(1, 1fr);
        -moz-column-gap: 3rem;
        column-gap: 0rem;
        row-gap: 0rem;
        padding: 2rem 0 0;
    }
    .guideline-list_box {
        flex-direction: column;
        align-items: center;
        padding: 3rem 0rem 0rem;
        gap: 0rem;
    }
    .c-button--pdf:after {
        right: 1em;
    }
    .guideline-list__button {
        font-size: 1.4rem;
        min-width: 24.6rem;
        padding: 1.4rem 4rem 1.4rem 2rem;
    }
}


/* back-btn
----------------------------------------------------------------------------- */
.back-btn {
    text-align: center;
}
