main { padding: 3rem 0; } main > .container { padding: 10px 15px 0; } .welcome { padding: 3rem 0; margin-bottom: 2rem; background-color: #ebf6f7; align-items: center; display: flex; flex-direction: column; } .welcome2 { padding: 3rem 0; margin-bottom: 2rem; background-color: #ffffe0; align-items: center; display: flex; flex-direction: column; } figure { width: 600px; position: relative; } figure img { width: 100%; vertical-align: top; } figure figcaption { font-size: 60px; color: #ffffff; position: absolute; top: 0; display: flex; width: 100%; height: 100%; margin: 0; align-items: center; justify-content: center; } .decorator { background-color: rgba(0, 0, 0, 0.7); } .add-button { position: absolute; top: 1px; left: 1px; } .highlighted { display : inline-block; /* ブロック化 */ font-weight : bold; /* 太字 */ color : #ff0000; /* 文字色 */ } .search-highlight { background-color: #ffeb3b; padding: 1px 3px; border-radius: 2px; font-weight: bold; } .blog-date { margin-bottom: 1rem; } .source-code > .highlight { padding: 1rem; margin-bottom: 1rem; } @media (min-width: 1400px) { .container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container { max-width: 1360px; } }