body { margin:0; padding:0; background-color: #f4f4f4; margin: auto; } ul{ } img { width: 100%; max-width: 800px; } h1{ margin: 0; padding: 0; } h2{ margin: 0; padding: 0; } h3{ margin: 0; padding: 0; font-size: 25px; color: #f4f4f4; } p{ margin:0; padding:0; font-size: 15px; color: #f4f4f4; } section{ max-width: 800px; margin:auto; padding:20px 5%; background-color: #f4f4f4; } /*トップイメージ*/ .img-center{ text-align: center; } .top-image{ position: fixed; z-index: -10; transform: translate(-50%, 0); top:0; } /*ヘッダー*/ header{ margin-top: 230px; padding: 0; } .header-list ul{ list-style-type: none; text-align: center; margin-left: 0; background-color: #0a9b94; padding :0; margin-bottom: 0; } .header-list li{ display:inline-block; text-align: center; background-color: #0a9b94; height: 50px; line-height: 48px; margin:0; } .header-list a{ text-decoration: none; font-weight: bold; color: #f4f4f4; font-size: 13px; padding:15px 15px } .header-list a:hover { background-color: #008080; } /*コンテンツ全体*/ /*SKIPの紹介*/ .introduction h1{ text-align: center; font-size: 40px; color: #0a9b94; } .introduction p{ text-align: center; color: #0a9b94; font-size: 18px; } .skip-mean{ font-size: 50px; color: #0a9b94; font-weight: lighter; margin-bottom: 30px; } /*活動*/ .activities h1{ text-align: center; font-size: 40px; color: #0a9b94; padding-bottom: 15px; } .activities a:hover .activity{ background-color: #E8C1A5; } .activities a:hover h3{ color: #313131; } .activities a:hover p{ color: #313131; } .activities a:hover img{ border-radius: 10px 10px 10px 10px; } .activity{ width:100%; height: 120px; padding: 10px 0; margin:20px 0; background-color: #ff905a /*#ff7e5a*/; position: relative; border-radius: 10px 10px 10px 10px; transition: 1s; } .activity img{ width: 120px; height: 120px; border-radius: 50%; /*background-position: left top;*/ display: inline-block; margin-left:10px; transition: 1s; } .activity-text{ display: inline-block; vertical-align: top; position: absolute; left:140px; margin-right: 10px; } .activity h3{ transition: 1s; } .activity p{ transition: 1s; } /*common*/ .common-title{ text-align: center; font-size: 40px; color: #0a9b94; } /*フッター*/ footer{ background-color: #313131; margin: 0; padding:15px 10px; } footer p{ text-align: center; color: #f4f4f4; }