@charset "utf-8"; /* CSS Document */ .pc-br { display: none; } /*kato 20250116 追加 */ .sp-br { display: inline; } /*kato 20250116 追加 */ @media (min-width: 768px) { .pc-br { display: inline; } /*kato 20250116 追加 */ .sp-br { display: none; } /*kato 20250116 追加 */ } .cmnArea01{ width: 1030px; margin: 0 auto; } .cmnArea01 h1.pc-4axis{ display: block; } .cmnArea01 h1.sp-4axis{ display: none; } .cmnArea01 p{ line-height: 1.5; } .cmnArea01 .line01{ width: 1030px; height: 30px; background: url("../img/4axis-line-bg-01.gif") repeat-x; display: flex; justify-content: center; margin: 40px 0 12px 0; } .cmnArea01 .contentsArea01{ width: 1030px; margin: 32px auto 0 auto; display: flex; justify-content: space-between; flex-direction: row; } .cmnArea01 .contentsArea01 h2{ font-size: 24px; font-weight: 900; width: 300px; text-align: left; display: block; color: #000000; line-height: 1.1; } .cmnArea01 .contentsArea01 p{ font-size: 14px; font-weight: 400; color: #000000; width: 730px; display: block; } .cmnArea01 .contentsArea01 p span{ white-space: nowrap; } .cmnArea01 .contentsArea01-2{ width: 1030px; margin: 32px auto 0 auto; display: flex; justify-content: space-between; flex-direction: row; } .cmnArea01 .contentsArea01-2-heading { flex-shrink: 0; margin-inline-end: 80px; } .cmnArea01 .contentsArea01-2 p{ font-size: 14px; font-weight: 400; color: #000000; width: 100%; display: block; } .cmnArea01 .contentsArea01-2 p span{ white-space: nowrap; } @media print, screen and (max-width: 900px) { .cmnArea01{ width: 100%; margin: 0 auto; } .cmnArea01 h1.pc-4axis{ display: none; } .cmnArea01 h1.sp-4axis{ width: 100%; margin: 0 auto; display: block; } .cmnArea01 p{ line-height: 1.5; } .cmnArea01 .line01{ width: calc(100% - 60px); height: 30px; background: url("../img/4axis-line-bg-01.gif") repeat-x; display: flex; justify-content: center; margin: 12px auto 12px auto; } .cmnArea01 .contentsArea01{ width: calc(100% - 60px); margin: 64px auto 0 auto; display: flex; justify-content: space-between; flex-direction: column; } .cmnArea01 .contentsArea01 h2{ font-size: 24px; font-weight: 900; width: 100%; text-align: center; display: block; color: #000000; line-height: 1.1; margin: 0 0 12px 0; } .cmnArea01 .contentsArea01 p{ font-size: 14px; font-weight: 400; color: #000000; width: auto; display: block; margin: 24px 0 0 0; } .cmnArea01 .contentsArea01-2{ width: calc(100% - 60px); margin: 40px auto 0 auto; display: flex; justify-content: space-between; flex-direction: row; } .cmnArea01 .contentsArea01-2:has(.contentsArea01-2-heading) { flex-direction: column; } .cmnArea01 .contentsArea01-2-heading { margin-inline-end: 0; margin-block-end: 8px; } .cmnArea01 .contentsArea01-2 p{ font-size: 14px; font-weight: 400; color: #000000; width: auto; display: block; margin: 0 0 0 0; } .cmnArea01 .contentsArea01-2 p span{ white-space: nowrap; } } .cmnArea01 .contentsArea02{ width: 1030px; margin: 32px auto 0 auto; display: flex; justify-content: space-between; flex-direction: row; } .cmnArea01 .contentsArea02:not(:has(.rAera01)){ justify-content: center; column-gap: 80px; } .cmnArea01 .contentsArea02 img.pc-4axis02{ display: block; } .cmnArea01 .contentsArea02 img.sp-4axis02{ display: none; } .cmnArea01 .contentsArea02 h3{ margin: 12px 0 8px 0; } .cmnArea01 .contentsArea02 p{ font-size: 14px; font-weight: 400; color: #000000; display: block; } .cmnArea01 .contentsArea02 .sAera01{ width: 404px; margin: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; } .cmnArea01 .contentsArea02 .sAera01 p{ width: 200px; margin: 0; } .cmnArea01 .contentsArea02 .wAera01{ width: 262px; margin: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; } .cmnArea01 .contentsArea02 .wAera01 p{ width: 220px; display: block; margin: 0; } .cmnArea01 .contentsArea02 .wAera01 div{ margin: 0 0 0 56px; } .cmnArea01 .contentsArea02 .rAera01{ width: 364px; margin: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; } .cmnArea01 .contentsArea02 .rAera01 p{ width: 255px; display: block; margin: 0; } .cmnArea01 .contentsArea02 .rAera01 div{ margin: 0 0 0 86px; width: 255px; } @media print, screen and (max-width: 900px) { .cmnArea01 .contentsArea02{ width: 100%; margin: 32px auto 0 auto; display: flex; justify-content: space-between; flex-direction: column; } .cmnArea01 .contentsArea02 img.pc-4axis02{ display: none; } .cmnArea01 .contentsArea02 img.sp-4axis02{ display: block; width: 100%; height: auto; max-width: 450px; } .cmnArea01 .contentsArea02 h3{ margin: 12px auto 8px auto; width: calc(100% - 60px); } .cmnArea01 .contentsArea02 p{ font-size: 14px; font-weight: 400; color: #000000; display: block; } .cmnArea01 .contentsArea02 .sAera01{ width: 100%; margin: 0 0 30px 0; display: flex; flex-direction: column; align-items: center; justify-content: center; } .cmnArea01 .contentsArea02 .sAera01 p{ width: calc(100% - 60px); margin: 0 auto; } .cmnArea01 .contentsArea02 .wAera01{ width: 100%; margin: 0 0 30px 0; display: flex; flex-direction: column; align-items: center; justify-content: center; } .cmnArea01 .contentsArea02 .wAera01 p{ width: calc(100% - 60px); display: block; margin: 0 auto; } .cmnArea01 .contentsArea02 .wAera01 div{ margin: 0 0 0 0; width: 100%; } .cmnArea01 .contentsArea02 .rAera01{ width: 100%; margin: 0 0 30px 0; display: flex; flex-direction: column; align-items: center; justify-content: center; } .cmnArea01 .contentsArea02 .rAera01 p{ width: calc(100% - 60px); display: block; margin: 0 auto; } .cmnArea01 .contentsArea02 .rAera01 div{ margin: 0 0 0 0; width: 100%; } } .cmnArea01 .contentsArea03{ width: 620px; margin: 32px auto 0 auto; display: flex; justify-content: space-between; flex-direction: row; } .cmnArea01 .contentsArea03 div{ margin: 0; display: grid; place-content: center; } .cmnArea01 .contentsArea03 div h3{ margin: 0 0 14px 0; } .cmnArea01 .contentsArea03 div p.note{ margin: 8px 0 0 0; font-size: 12px; line-height: 1.4; } .cmnArea01 .contentsArea03 img.pc-4axis03{ display: block; } .cmnArea01 .contentsArea03 img.sp-4axis03{ display: none; } @media print, screen and (max-width: 900px) { .cmnArea01 .contentsArea03{ width: 100%; margin: 32px auto 40px auto; display: flex; justify-content: space-between; flex-direction: column; } .cmnArea01 .contentsArea03 div{ margin: 16px auto 0 auto; width: calc(100% - 60px); } .cmnArea01 .contentsArea03 div h3{ margin: 0 0 14px 0; } .cmnArea01 .contentsArea03 div p.note{ margin: 8px 0 0 0; font-size: 12px; line-height: 1.4; } .cmnArea01 .contentsArea03 img.pc-4axis03{ display: none; } .cmnArea01 .contentsArea03 img.sp-4axis03{ display: block; width: 100%; height: auto; max-width: 450px; } } .cmnArea01 .contentsArea04{ width: 820px; margin: 14px auto 40px auto; display: flex; justify-content: space-between; flex-direction: row; } .cmnArea01 .contentsArea04 h4{ font-size: 16px; font-weight: 900; margin: 8px 0 0 0; } .cmnArea01 .contentsArea04 p{ margin: 4px 0 0 0; } .cmnArea01 .contentsArea04 div{ width: auto; display: block; } .cmnArea01 .contentsArea04 div img{ width: auto; } @media print, screen and (max-width: 900px) { .cmnArea01 .contentsArea04{ width: calc(100% - 120px); margin: 14px auto 40px auto; display: flex; justify-content: space-between; flex-direction: column; } .cmnArea01 .contentsArea04 h4{ font-size: 16px; font-weight: 900; margin: 8px 0 0 0; } .cmnArea01 .contentsArea04 p{ margin: 4px 0 0 0; } .cmnArea01 .contentsArea04 div{ width: 100%; display: flex; justify-content: center; flex-direction: column; margin: 0 0 40px 0; } .cmnArea01 .contentsArea04 div img{ } } .cmnArea01 .contentsArea05{ width: 820px; padding: 40px 60px; background: #e7ecee; box-sizing: border-box; margin: 14px auto 40px auto; } .cmnArea01 .contentsArea05 h4{ font-size: 16px; font-weight: 900; margin: 0 0 13px 0; } .cmnArea01 .contentsArea05 .photoArea01{ display: flex; justify-content: space-between; flex-direction: row; } .cmnArea01 .contentsArea05 .photoArea01 img:first-child{ margin: 0 0 0 0; } .cmnArea01 .contentsArea05 p{ margin: 12px 0 0 0; } @media print, screen and (max-width: 900px) { .cmnArea01 .contentsArea05{ width: 100%; padding: 60px 60px; background: #e7ecee; box-sizing: border-box; margin: 14px auto 40px auto; } .cmnArea01 .contentsArea05 h4{ font-size: 16px; font-weight: 900; margin: 0 0 13px 0; } .cmnArea01 .contentsArea05 .photoArea01{ display: flex; justify-content: space-between; flex-direction: column; } .cmnArea01 .contentsArea05 .photoArea01 img:first-child{ margin: 0 0 16px 0; } .cmnArea01 .contentsArea05 p{ margin: 32px 0 0 0; } } .cmnArea01 .contentsArea06{ width: 1030px; margin: 0 auto 100px auto; } .cmnArea01 .contentsArea06 a:before { content: ""; display: inline-block; vertical-align: middle; text-decoration: none; width: 6px; height: 6px; border-top: 2px solid #333; border-right: 2px solid #333; -webkit-transform: rotate(45deg); transform: rotate(45deg); margin-top: -.25em; margin-right: 8px; } .cmnArea01 .contentsArea06 h3{ margin: 0 0 32px 26px; font-size: 20px; font-weight: 900; } .cmnArea01 .contentsArea06 .flexTableArea01{ width: 1030px; display: flex; justify-content: space-between; flex-direction: row; background: #f1f9ff; border-bottom: 1px #c5c9cc solid; } .cmnArea01 .contentsArea06 .flexTableArea01 h4{ width: 200px; padding: 10px 0 10px 26px; box-sizing: border-box; font-size: 16px; font-weight: 900; } .cmnArea01 .contentsArea06 .flexTableArea01 .flexTdArea01{ width: calc(100% - 200px); } .cmnArea01 .contentsArea06 .flexTableArea01 .flexTdArea01 .tdTextArea01{ width: 100%; padding: 10px 26px; box-sizing: border-box; border-bottom: 1px #c5c9cc solid; display: flex; } .cmnArea01 .contentsArea06 .flexTableArea01 .flexTdArea01 .tdTextArea01 h5{ display: block; width: 80px; } .cmnArea01 .contentsArea06 .flexTableArea01 .flexTdArea01 .tdTextArea01 p{ font-size: 16px; } .cmnArea01 .contentsArea06 .flexTableArea01 .flexTdArea01 .tdTextArea01:last-child{ border-bottom: none; } @media print, screen and (max-width: 900px) { .cmnArea01 .contentsArea06{ width: 100%; margin: 0 auto 100px auto; } .cmnArea01 .contentsArea06 h3{ margin: 0 0 32px 26px; font-size: 20px; font-weight: 900; } .cmnArea01 .contentsArea06 .flexTableArea01{ width: 100%; display: flex; justify-content: space-between; flex-direction: column; background: #f1f9ff; border-bottom: 1px #c5c9cc solid; } .cmnArea01 .contentsArea06 .flexTableArea01 h4{ width: 100%; padding: 10px 0 0 26px; box-sizing: border-box; font-size: 16px; font-weight: 900; } .cmnArea01 .contentsArea06 .flexTableArea01 .flexTdArea01{ width: 100%; } .cmnArea01 .contentsArea06 .flexTableArea01 .flexTdArea01 .tdTextArea01{ width: 100%; padding: 10px 26px; box-sizing: border-box; border-bottom: 1px #c5c9cc solid; display: flex; } .cmnArea01 .contentsArea06 .flexTableArea01 .flexTdArea01 .tdTextArea01 h5{ display: block; width: 80px; } .cmnArea01 .contentsArea06 .flexTableArea01 .flexTdArea01 .tdTextArea01 p{ font-size: 16px; } .cmnArea01 .contentsArea06 .flexTableArea01 .flexTdArea01 .tdTextArea01:last-child{ border-bottom: none; } } .cmnArea01 .contentsArea06 .flexTableArea02{ width: 1030px; display: flex; justify-content: space-between; flex-direction: row; background: #e7f3fc; border-bottom: 1px #c5c9cc solid; } .cmnArea01 .contentsArea06 .flexTableArea02 h4{ width: 200px; padding: 10px 0 10px 26px; box-sizing: border-box; font-size: 16px; font-weight: 900; } .cmnArea01 .contentsArea06 .flexTableArea02 .flexTdArea01{ width: calc(100% - 200px); } .cmnArea01 .contentsArea06 .flexTableArea02 .flexTdArea01 .tdTextArea01{ width: 100%; padding: 10px 26px; box-sizing: border-box; border-bottom: 1px #c5c9cc solid; display: flex; } .cmnArea01 .contentsArea06 .flexTableArea02 .flexTdArea01 .tdTextArea01 h5{ display: block; width: 80px; order: 1; } .cmnArea01 .contentsArea06 .flexTableArea02 .flexTdArea01 .tdTextArea01 p{ font-size: 16px; order: 2; } .cmnArea01 .contentsArea06 .flexTableArea02 .flexTdArea01 .tdTextArea01:last-child{ border-bottom: none; } @media print, screen and (max-width: 900px) { .cmnArea01 .contentsArea06 .flexTableArea02{ width: 100%; display: flex; justify-content: space-between; flex-direction: column; background: #e7f3fc; border-bottom: 1px #c5c9cc solid; } .cmnArea01 .contentsArea06 .flexTableArea02 h4{ width: 100%; padding: 10px 0 0 26px; box-sizing: border-box; font-size: 16px; font-weight: 900; } .cmnArea01 .contentsArea06 .flexTableArea02 .flexTdArea01{ width: 100%; } .cmnArea01 .contentsArea06 .flexTableArea02 .flexTdArea01 .tdTextArea01{ width: 100%; padding: 10px 26px; box-sizing: border-box; border-bottom: 1px #c5c9cc solid; display: flex; } .cmnArea01 .contentsArea06 .flexTableArea02 .flexTdArea01 .tdTextArea01 h5{ display: block; width: 80px; order: 2; } .cmnArea01 .contentsArea06 .flexTableArea02 .flexTdArea01 .tdTextArea01 p{ font-size: 16px; order: 1; } .cmnArea01 .contentsArea06 .flexTableArea02 .flexTdArea01 .tdTextArea01:last-child{ border-bottom: none; } } .cmnArea02{ width: 100%; } .cmnArea02 p{ line-height: 1.5; } .contents-BlackArea01{ width: 1030px; margin: 0 auto; } .contents-BlackArea01 h2{ width: 290px; height: 58px; color: #FFFFFF; background: #000000; display: flex; align-items: center; justify-content: flex-end; } .contents-BlackArea01 h2 span{ width: 260px; height: 58px; color: #FFFFFF; background: #000000; display: flex; align-items: center; border-bottom: 1px solid #333333; } @media print, screen and (max-width: 900px) { .cmnArea02{ width: 100%; } .cmnArea02 p{ line-height: 1.5; } .contents-BlackArea01{ width: 100%; margin: 0 auto; } .contents-BlackArea01 h2{ width: calc(100% - 30px); height: 58px; margin: 0 0 0 auto; color: #FFFFFF; background: #000000; display: flex; align-items: center; justify-content: flex-end; } .contents-BlackArea01 h2 span{ width: calc(100% - 30px); height: 58px; color: #FFFFFF; background: #000000; display: flex; align-items: center; border-bottom: 1px solid #333333; } } .contents-BlackArea02{ width: 100%; background: #000000; padding: 30px 0; } .contents-BlackArea02 .photoArea02{ width: 1030px; padding: 0 0 30px 0; margin: 0 auto 30px auto; border-bottom: 1px #484848 solid; display: flex; justify-content: space-between; flex-direction: row; } .contents-BlackArea02 .photoArea02{ justify-content: center; column-gap: 80px; } .contents-BlackArea02 .photoArea02 img.pc-4axis04{ display: block; } .contents-BlackArea02 .photoArea02 img.sp-4axis04{ display: none; } .contents-BlackArea02 .yotubeArea01{ width: 1030px; padding: 0 0 0 0; margin: 0 auto 0 auto; display: flex; justify-content: space-between; flex-direction: row; } .contents-BlackArea02 .yotubeArea01 h3{ width: 120px; height: 84px; display: flex; justify-content: center; align-items: center; background: #e03434; color: #FFFFFF; border-radius: 4px; line-height: 1.4; text-align: center; } .contents-BlackArea02 .yotubeArea01 .movIndexArea01{ width: 444px; height: 84px; display: flex; justify-content: space-between; align-items: center; flex-direction: row; background: #511212; color: #FFFFFF; line-height: 1.4; text-align: center; } .contents-BlackArea02 .yotubeArea01 .movIndexArea01 p{ width: calc(100% - 154px); height: 84px; padding: 0 16px 0 16px; text-align: left; display: flex; justify-content: flex-start; align-items: center; box-sizing: border-box; } .contents-BlackArea02 .yotubeArea01 .movIndexArea01 img.pc-4axis05{ display: block; } .contents-BlackArea02 .yotubeArea01 .movIndexArea01 img.sp-4axis05{ display: none; } @media print, screen and (max-width: 900px) { .contents-BlackArea02{ width: 100%; background: #000000; padding: 30px 0; } .contents-BlackArea02 .photoArea02{ width: calc(100% - 60px); padding: 0 0 30px 0; margin: 0 auto 30px auto; border-bottom: 2px #484848 solid; display: flex; justify-content: space-between; flex-direction: column; } .contents-BlackArea02 .photoArea02 img.pc-4axis04{ display: none; } .contents-BlackArea02 .photoArea02 img.sp-4axis04{ display: block; margin: 0 0 30px 0; } .contents-BlackArea02 .photoArea02 img.sp-4axis04:last-child{ display: block; margin: 0 0 0 0; } .contents-BlackArea02 .yotubeArea01{ width: calc(100% - 60px); padding: 0 0 0 0; margin: 0 auto 0 auto; display: flex; justify-content: space-between; flex-direction: column; } .contents-BlackArea02 .yotubeArea01 h3{ width: 100%; height: 60px; display: flex; justify-content: center; align-items: center; background: #e03434; color: #FFFFFF; border-radius: 4px; line-height: 1.4; text-align: center; } .contents-BlackArea02 .yotubeArea01 .movIndexArea01{ width: 100%; height: auto; display: flex; justify-content: space-between; align-items: center; flex-direction: column; background: #511212; color: #FFFFFF; line-height: 1.4; text-align: center; padding: 30px; margin: 20px 0 0 0; } .contents-BlackArea02 .yotubeArea01 .movIndexArea01 img.pc-4axis05{ display: none; } .contents-BlackArea02 .yotubeArea01 .movIndexArea01 img.sp-4axis05{ display: block; width: 100%; height: auto; } .contents-BlackArea02 .yotubeArea01 .movIndexArea01 p{ width: 100%; height: auto; padding: 16px 0 0 0;; text-align: left; display: flex; justify-content: flex-start; align-items: center; box-sizing: border-box; } } .contents-GrayArea01{ width: 100%; background: #e7ecee; padding: 80px 0 100px 0; } .contents-GrayArea01 .flexTableArea03{ width: 1030px; margin: 0 auto; } .contents-GrayArea01 .flexTableArea03 p{ font-size: 12px; margin: 14px 0 0 0; } .contents-GrayArea01 .flexTableArea03 h3{ margin: 0 0 26px 26px; font-size: 20px; font-weight: 900; } @media print, screen and (max-width: 900px) { .contents-GrayArea01{ width: 100%; background: #e7ecee; padding: 80px 0 100px 0; } .contents-GrayArea01 .flexTableArea03{ width: 100%; margin: 0 auto; } .contents-GrayArea01 .flexTableArea03 p{ font-size: 12px; margin: 14px 0 0 30px; } .contents-GrayArea01 .flexTableArea03 h3{ margin: 0 0 26px 26px; font-size: 20px; font-weight: 900; } } .contents-GrayArea01 .flexTableArea03 .tableContents01{ width: 1030px; background: #FFFFFF; border-bottom: 4px solid #ccc; display: flex; align-items: center; flex-direction: row; } .contents-GrayArea01 .flexTableArea03 .tableContents01 .tdArea01{ display: flex; align-items: center; flex-direction: row; } .contents-GrayArea01 .flexTableArea03 .tableContents01 h4{ padding: 10px 0 10px 26px; width: calc(100% - 800px); font-size: 12px; text-align: left; background: #fff; } .contents-GrayArea01 .flexTableArea03 .tableContents01 .flexThArea01{ width: 400px; padding: 10px 0 10px 26px; box-sizing: border-box; font-size: 16px; font-weight: 900; } .contents-GrayArea01 .flexTableArea03 .tableContents01 .flexThArea02{ width: 400px; padding: 10px 0 10px 26px; box-sizing: border-box; background: #f1f9ff; font-size: 16px; font-weight: 900; } @media print, screen and (max-width: 900px) { .contents-GrayArea01 .flexTableArea03 .tableContents01{ width: 100%; background: #FFFFFF; border-bottom: 4px solid #ccc; display: flex; align-items: center; flex-direction: column; } .contents-GrayArea01 .flexTableArea03 .tableContents01 .tdArea01{ display: flex; align-items: center; flex-direction: row; width: 100%; } .contents-GrayArea01 .flexTableArea03 .tableContents01 h4{ padding: 10px 30px 10px 30px; width: 100%; font-size: 12px; text-align: center; background: #c5c9cc; } .contents-GrayArea01 .flexTableArea03 .tableContents01 .flexThArea01{ width: 50%; padding: 10px 10px 10px 30px; box-sizing: border-box; font-size: 16px; font-weight: 900; } .contents-GrayArea01 .flexTableArea03 .tableContents01 .flexThArea02{ width: 50%; padding: 10px 10px 10px 30px; box-sizing: border-box; background: #f1f9ff; font-size: 16px; font-weight: 900; } } .contents-GrayArea01 .flexTableArea03 .tableContents02{ width: 1030px; background: #FFFFFF; border-bottom: 1px solid #ccc; display: flex; align-items: center; flex-direction: row; } .contents-GrayArea01 .flexTableArea03 .tableContents02 h4{ padding: 10px 0 10px 26px; width: calc(100% - 800px); font-size: 12px; text-align: left; background: #FFFFFF; } .contents-GrayArea01 .flexTableArea03 .tableContents02 .tdArea01{ display: flex; align-items: center; flex-direction: row; } .contents-GrayArea01 .flexTableArea03 .tableContents02 .flexThArea01{ width: 400px; padding: 10px 0 10px 26px; box-sizing: border-box; } .contents-GrayArea01 .flexTableArea03 .tableContents02 .flexThArea01 span{ font-size: 12px; } .contents-GrayArea01 .flexTableArea03 .tableContents02 .flexThArea02{ width: 400px; padding: 10px 0 10px 26px; box-sizing: border-box; background: #f1f9ff; } .contents-GrayArea01 .flexTableArea03 .tableContents02 .flexThArea02 span{ font-size: 12px; } @media print, screen and (max-width: 900px) { .contents-GrayArea01 .flexTableArea03 .tableContents02{ width: 100%; background: #FFFFFF; border-bottom: 1px solid #ccc; display: flex; align-items: center; flex-direction: column; } .contents-GrayArea01 .flexTableArea03 .tableContents02 h4{ padding: 6px 0 6px 0; width: 100%; text-align: center; font-size: 12px; background: #e6f0f7; } .contents-GrayArea01 .flexTableArea03 .tableContents02 .tdArea01{ display: flex; flex-direction: row; align-items: stretch; width: 100%; } .contents-GrayArea01 .flexTableArea03 .tableContents02 .flexThArea01{ width: 50%; padding: 10px 10px 10px 30px; box-sizing: border-box; } .contents-GrayArea01 .flexTableArea03 .tableContents02 .flexThArea01 span{ font-size: 12px; } .contents-GrayArea01 .flexTableArea03 .tableContents02 .flexThArea02{ width: 50%; padding: 10px 10px 10px 30px; box-sizing: border-box; background: #f1f9ff; } .contents-GrayArea01 .flexTableArea03 .tableContents02 .flexThArea02 span{ font-size: 12px; } }