*{ margin: 0; padding: 0; } html{ font-size: 62.5%; } body{ color: #ffffff; width: 100%; } p{ font-size: 1.5rem } header p.trip,p.gold,h1{ font-family: Georgia, 'Times New Roman', Times, serif; } /*-header始まり-*/ header{ background-image: url(bg-trip.png); background-size: cover; background-position:center; background-repeat:no-repeat; margin: 1rem 1rem 0; } header p.trip{ writing-mode: vertical-lr; font-size: 2rem; text-shadow: 3px 3px 2px #160909; padding: 8rem 10rem 40rem ; } /*-header終わり-*/ /*-main始まり-*/ main{ background-color: #341212; margin: 0 1rem 1rem; padding: 1rem 4rem 2rem; } p.right{ font-size: 1rem; text-align: right; } p.front-h1{ font-size: 2.5rem; padding-top: 2rem; } h1{ font-size: 10rem; letter-spacing: 8.5rem; padding: 2rem 0 1rem; } p.gold{ color: #958009; font-size: 5rem; } div.flex-container{ display: flex; } div.flex-item{ width: 100%; } span.x-small{ font-size: 4rem; padding: 0 1rem; } span.small{ font-size: 0.75rem; } h2{ font-size: 7rem; font-family:'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif; } span.white{ font-size: 3rem; color: #4d0a0a; background-color: #ffffff; margin: 0 1rem } img.qr{ padding: 0 1rem ; width: 60px; height: 60px; } div.museum p{ font-size: 1rem; color: #4ca90e; padding: 2rem 0 0 8rem; margin-right: 0; line-height: 0; } h3{ padding: 0 2rem 0 2rem; } h3:before{ content: ""; display: inline-block; width: 40px; height: 40px; background: url(logo.png) no-repeat; background-size: contain; margin-right: 1rem; vertical-align: middle; } div.flex-container2{ display: flex; justify-content: flex-end; } div.museum h3{ font-size: 3rem; } div.access{ padding-top: 1.5rem; } div.access p{ font-size: 1rem; } div.item{ width: 100%; } a{ color:#ffffff } /*-main終わり-*/