/* ==========================================================
   SERVICE Section
   サービス紹介レイアウト
========================================================== */

/* セクション */
.service-section{
    width:100%;                                     /* 横幅いっぱい */
    padding:30px 0;                                 /* 上下余白 */
    background:#ffffff url("assets/images/bg-wood-white.png") repeat; /* 白い木目 */
    position:relative;                              /* 区切り線の基準 */
}

/* コンテナ */
.service-container{
    width:min(95%,1200px);                          /* 最大横幅 */
    margin:0 auto;                                 /* 中央配置 */
    display:flex;                                  /* 横並び */
    align-items:center;                            /* 縦中央 */
    gap:60px;                                      /* 要素間余白 */
}

/* ==========================================================
   画像
========================================================== */

/* 画像エリア */
.service-image{
    flex:0 0 50%;                                  /* 横幅50% */
}

/* 画像 */
.service-image img{
    width:100%;                                    /* 横幅いっぱい */
    height:400px;                                  /* 高さ固定 */
    display:block;                                 /* ブロック化 */
    object-fit:cover;                              /* トリミング */
    box-shadow:0 15px 40px rgba(0,0,0,.10);        /* 影 */
    transition:.4s;                                /* アニメーション */
}

/* ==========================================================
   テキスト
========================================================== */

/* テキストエリア */
.service-content{
    flex:0 0 50%;                                  /* 横幅50% */
}

/* サービス番号 */
.service-number{
    display:block;                                 /* ブロック表示 */
    margin-bottom:10px;                            /* 下余白 */
    color:#c00000;                                 /* 赤色 */
    font-family:"Noto Sans JP","Noto Sans",Arial,sans-serif; /* 多言語対応 */
    font-size:4rem;                                /* 文字サイズ */
    font-weight:700;                               /* 太字 */
    line-height:1;
    letter-spacing:0;
    word-spacing:0;
}

/* タイトル */
.service-content h2{
    width:100%;
    max-width:900px;
    margin:0 0 15px;
    color:#222222;
    font-family:"Noto Sans JP","Noto Sans",Arial,sans-serif; /* 多言語対応 */
    font-size:clamp(30px,3vw,36px);
    font-weight:700;
    line-height:1.4;
    letter-spacing:0;
    word-spacing:0;
    word-break:normal;
    overflow-wrap:anywhere;
}

/* 説明文 */
.service-content p{
    width:100%;
    max-width:900px;
    margin:0 0 20px;
    color:#555555;
    font-family:"Noto Sans JP","Noto Sans",Arial,sans-serif; /* 多言語対応 */
    font-size:18px;
    font-weight:400;
    line-height:1.9;
    letter-spacing:0;
    word-spacing:0;
    word-break:normal;
    overflow-wrap:anywhere;
}

/* リスト全体 */
.service-content ul{
    margin:0;
    padding-left:22px;
}

/* リスト */
.service-content li{
    color:#333333;
    margin-bottom:10px;
    font-family:"Noto Sans JP","Noto Sans",Arial,sans-serif; /* 多言語対応 */
    font-size:18px;
    line-height:1.8;
    letter-spacing:0;
    word-spacing:0;
    word-break:normal;
    overflow-wrap:anywhere;
}

/* ==========================================================
   セクション区切り線
========================================================== */

.service-section + .service-section{
    border-top:2px solid #c00000;
}