html, body { width: 100%; height: 100%; font-weight: 500; background-color: #ffffff; } body { display: flex; flex-direction: column; align-items: center; justify-content: center; } .logo_wrap { margin: 0 0 50px 0; display: inline-flex; width: 300px; max-width: calc(100% - 60px); border-radius: 60px; height: 100px; background-color: #f4f3f3; flex-shrink: 0; align-items: center; justify-content: center; } .logo_wrap img { width: 150px; } .wrap { display: inline-flex; width: 100%; height: 100%; justify-content: center; align-items: center; flex-direction: column; font-family: "Noto Sans JP", sans-serif; margin-bottom: 50px; } .title { font-size: 26px; line-height: 1; color: #848484; } .sub-title { font-size: 12px; line-height: 1; color: #848484; margin-top: 8px; } .err-msg { padding: 10px; margin: 10px; background-color: #f3f3f3; border-radius: 8px; min-width: 300px; color: #848484; font-size: 15px; font-weight: 400; } .cause-wrap { margin: 20px 10px 10px 10px; color: #848484; font-size: 14px; line-height: 1.5; font-weight: 300; } .cause-wrap li { list-style-type: none; position: relative; margin-left: 1.5em; } .cause-wrap li::after { display: block; content: ''; position: absolute; top: .5em; left: -1em; width: 8px; height: 8px; background-color: #848484; border-radius: 50%; }