body{ margin: 2em 4em; width: 90vw; } /*共通*/ .flex{ display: flex; } .moji{ width: 60%; } .pic{ width: 40%; text-align: center; margin-left: auto; margin-right: auto; } img{ margin: 0 1em; } /*新たな発見*/ .hakken{ margin: 1em 0; height: 220px; background-color: #87cefa; } .maru1{ margin-left: 60%; margin-top: -2px; } .maru1 h3{ margin-bottom: 5px; border-radius: 50%; background-color: #ffffff; width: 200px; height: 59px; text-align: center; padding-top: 1.4em; color: #19448e; } .setsumei1{ width: 88%; margin-top: -2px; margin-left: 10%; } /*タイトル*/ .main{ height: 150px; background-color: #4169e1; color: #ffffff; } .main h1{ font-size: 370%; text-align: center; margin-top: 16px; margin-bottom: 0; margin-left: 10%; margin-left: -10%; } .main p{ font-size: 220%; text-align: center; margin-top: 0; margin-left: 17%; } /*新しい仲間*/ .nakama{ margin: 1em 0; height: 220px; background-color: #7fff00; } .maru2{ margin-right: 60%; margin-top: -2px; } .maru2 h3{ margin-bottom: 5px; border-radius: 50%; background-color: #ffffff; width: 200px; height: 59px; text-align: center; padding-top: 1.4em; color: #006e54; } .setsumei2{ width: 88%; margin-top: 8px; margin-left: 10%; } /*新しい自分*/ .jibun{ margin: 1em 0; height: 220px; background-color: #ffdb4f; } .maru3{ margin-left: 60%; margin-top: -2px; } .maru3 h3{ margin-bottom: 5px; border-radius: 50%; background-color: #ffffff; width: 200px; height: 59px; text-align: center; padding-top: 1.4em; color: #d9a62e; } .setsumei3{ width: 88%; margin-top: 0px; margin-left: 10%; } /*まとめ*/ .matome{ text-align: center; } h3{ font-size: 23px; } .matome p{ font-size: 17px; color: #0095d9; } h2{ text-align: center; font-size: 25px; margin: 0; } .hidari{ margin: 10px; } .map p{ font-size: 20px; } .migi{ margin: 10px; } .iroiro p{ font-size: 17px; } .small{ font-size: 15px; }