.b { height: calc(100vw / 3.5 ); } .b_index { height: calc(100vw / 3.5 ); } .banner { width: 98vw; //box-shadow: inset 0px -11px 8px -10px #444; background-repeat: no-repeat; background-size: 100%; background-position: 50% 5rem; background-attachment: fixed; display: flex; flex-direction: column; justify-content: flex-end; .title_index { word-break: break-all; color: var(--text-main); background: var(--background-body-opaq); text-align: center; margin-bottom: 0; text-shadow: 0px 4px 3px rgba(0,0,0,0.4), 0px 8px 13px rgba(0,0,0,0.1), 0px 18px 23px rgba(0,0,0,0.1); } .title { background: var(--background-body-opaq); word-break: break-all; color: var(--text-main); margin-bottom: 0; text-align: center; text-shadow: 0px 4px 3px rgba(0,0,0,0.4), 0px 8px 13px rgba(0,0,0,0.1), 0px 18px 23px rgba(0,0,0,0.1); } } @media (min-width: 640px) { .banner { width: 89%; margin-left: auto; margin-right: auto; } }