@charset "UTF-8";

html {
  scroll-behavior: smooth;
}

main{
    letter-spacing: 0.1em;
}

section{
    margin-bottom: 240px;
}

h1, h2, h3, h4, h5, h6 {
    color: #707070;
}
small{
    font-size: 0.8em;
    margin-right: 0.5em;
}
.b{
    font-weight: 600;
}

.products-container {
  scroll-margin-top: 100px; /* 固定ヘッダーの高さに合わせて調整 */
}

.products-link .two-column{
    max-width: 1240px;
    width: 100%;
    margin: 0 auto;
    align-items: flex-start;
    justify-content: space-between;
    /* gap:400px */
}
.products-link .two-column h3{
    margin: 0;
}
.products-link .two-column div{
    margin-right: 12%;
}
.products-link .two-column ul{
    list-style: none;
}
.products-link .two-column li{
    margin-bottom: 20px;
    border-bottom: 1px solid #D2D2D7;
    padding-bottom:20px ;
    font-size: 24px;
    letter-spacing: 0.1em;
}
.products-link .two-column .icon_link{
 float: right;  
 margin-left: 2em;
 padding-top: 0.5em;
}

.product-main{
    max-width: 1240PX;
    margin: 0 auto;
}


.products-container{
    margin-bottom: 200px;
    width: 100%;
}
.products-container .title{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    border-bottom: 1px solid #D2D2D7;
    margin-bottom: 40px;
}
.products-container .title p {
    border: 1px solid #D2D2D7;
    border-radius: 20px;
    padding: 5px 20px;
    margin-right: 50px;
}
.products-container .two-column {
    gap: 40px;
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-start;
}
.products-container .two-column .left{
    width: 50%;
    max-width: 600px;
}

.products-container .two-column img{
    width: 100%;
    height: auto;
}

.products-container .two-column .right {
    text-align: justify;
    width: 600px;
}
.products-container .two-column .copy{
    margin-top: 0px;
}
.products-container .two-column .right .recommend{
    margin-top: 40px;
    padding: 20px;
}

/* .products-container .three-column{
    gap: 80px;
} */
.products-container .three-column .feature-card img{
 width: 100%;
 height: auto; 
}
.feature-card .lead-text{
    line-height: normal !important;
}

.products-container .Indication{
    padding: 20px 40px;
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 80px;
    max-width: 100%;
}

.products-container .Indication .b{
    margin-right: 80px;
}
.products-container .spec{
    width: 100%;
    border: #707070 1px solid;
}

.products-container .spec p{
    border-bottom: #707070 1px solid;
    padding: 20px 40px;
}
.products-container .spec .two-column{
    padding: 16px 32px;
    display: flex;
  /* 差は gap だけで作る。space-between は使わない */
  gap: 48px;
  align-items: flex-start; /* 上揃え */
  justify-content: initial; /* 念のためリセット */
}

.products-container .spec .two-column > .left,
.two-column > .right {
  flex: 1 1 0;   /* 等分 */
  min-width: 0;  /* はみ出し対策（長い語での崩れ防止） */
  box-sizing: border-box;
}

.corp-def > div{
    display: grid;
  grid-template-columns: 9em 1fr; /* dt固定幅＋dd可変 */
  gap: 2em;
  letter-spacing: 0.1em;
  line-height: 1.8;
}
.corp-def dd{
  margin:0;
  overflow-wrap: anywhere;            /* 長い語に対応 */
}

.corp-def dt{
    font-weight: 600;
}

.bg-gray ul{
    padding-inline-start: 1.5em;
    letter-spacing: 0;
}

@media (max-width:1023px) {  
    .products-container .two-column{
        display: block;
    } 
.products-container .two-column .left{
    width: 100%;
    margin: 0 auto 40px;
}
.products-container .two-column .right{
   width: 100%;
    margin: 0 auto;
    
}
    
.products-container .spec{
    width: 100%;
    border-top: #707070 1px solid;
    border-bottom: #707070 1px solid;
    border-left: none;
    border-right: none;
}
.products-container .spec p{
    padding: 20px 1em;
}
.products-container .spec .two-column{
    padding: 1em 0.5em 1em 1em ;
    font-size: 16px;
    display: block;
}

.products-container .spec .left{
    margin: 0;
}
    
dl{
    margin: 0 auto;
}
.corp-def > div{
  grid-template-columns: 9em 1fr;  /* ラベル幅固定＋内容が伸びる */
  gap: 1em;
}
    
}

@media (max-width: 767px){
    .product_title{
        margin-bottom: 80px;
    }
    .products-link .two-column{
    width: fit-content;
}
    .products-link .two-column h3{
        margin-bottom: 40px;
    }
.products-link .two-column div{
    margin-right: 0;
}
    .products-link .two-column ul{
        padding-inline-start: 0;
    }

    .products-link .two-column li{
        border-bottom: none;
    }
    .products-link .two-column li a {
        display: inline-flex;
        align-items: center; /* 垂直中央揃え */
        }
    .products-link .two-column li a::before{
        content:' ';                           /* 空白の要素を作る */
        height: 1em;                           /* 高さ指定 */
        width:1em;                            /* 幅指定 */
        display:  inline-block;                 /* インラインブロックにする */
        background-image:  url(../img/icon_link_sp.png);  /* 背景画像指定 */
        background-size:  contain;              /* 背景画像サイズ指定 */
        background-repeat:  no-repeat;          /* 背景画像リピート指定 */
        background-position:  center;           /* 背景画像位置指定 */
        vertical-align:  middle;                /* 上下中央揃え */
        margin-right:  0.5em;                    /* 右側に間を */
    }
    .products-link .two-column .icon_link{
        display: none;
    }
    .products-container .title h3{
        margin-top: 16px;
        padding-left: 1em;
    } 
    .products-container .two-column .right{
        width: 100%;
    }
    .products-container .two-column img{
        width: 100%;
    }
    .products-container .feature-card .lead-text{
        margin-bottom: 8px;
    }
    .products-container .Indication{
        padding: 1em;
    }
    .container :last-child{
        margin-bottom: 0;
    }

}

/* タブレット基準（横幅768px以上） */
@media (min-width: 768px)and (max-width: 1023.98px) {
  .container { width: 92%; }

  @supports (display:grid) {
    .three-column { grid-template-columns: repeat(2, 1fr); }
  }
}

/* 大きめタブレット/小型ノート（横1024px以上） */
@media (min-width: 1024px)and (max-width: 1279.98px) {
  .container { width: 90%; }
  @supports (display:grid) {
    .three-column { grid-template-columns: repeat(3, 1fr); }
  }
  .two-column { gap:32px; }
}