@charset "UTF-8"; /** * Created Date: 2022-06-13 19:07:37 * Author: 奥冨 菜月 * ----- * Last Modified: 2023-11-17 02:36:39 * Modified By: 奥冨 菜月 * ----- * Copyright (c) 2022 FAIRWAY Corp. * ----- * HISTORY: * Date By Comments * ------------------- ---------- --------------------------------------------------------- * ------------------- ---------- --------------------------------------------------------- */ /** * Created Date: 2022-02-09 12:47:10 * Author: 奥冨 菜月 * ----- * Last Modified: 2025-07-17 15:03:53 * Modified By: 奥冨 菜月 * ----- * Copyright (c) 2022 FAIRWAY Corp. * ----- * HISTORY: * Date By Comments * ------------------- ---------- --------------------------------------------------------- * ------------------- ---------- --------------------------------------------------------- */ /*--------------------------------- Google font ---------------------------------*/ @import url("https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"); @import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700;900&display=swap"); @import url("https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200;300;400;500;600;700;900&display=swap"); @import url("https://fonts.googleapis.com/css2?family=Merriweather:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700;1,900&display=swap"); @import url("https://fonts.googleapis.com/css2?family=Covered+By+Your+Grace&family=DotGothic16&family=Yomogi&display=swap"); @import url("https://fonts.googleapis.com/css2?family=Kiwi+Maru:wght@300;400;500&display=swap"); @import url("https://fonts.googleapis.com/css2?family=Sigmar&display=swap"); @import url("https://fonts.googleapis.com/css2?family=Squada+One&display=swap"); @import url("https://fonts.googleapis.com/css2?family=Handlee&display=swap"); @import url("https://fonts.googleapis.com/css2?family=Rubik+Glitch&display=swap"); @import url("https://fonts.googleapis.com/css2?family=Big+Shoulders+Display:wght@100;200;300;400;500;600;700;800;900&display=swap"); @import url("https://fonts.googleapis.com/css2?family=Zen+Kurenaido&display=swap"); @import url("https://fonts.googleapis.com/css2?family=Zen+Maru+Gothic:wght@300;400;500;700;900&display=swap"); @import url("https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@100;300;400;500;700;800;900&display=swap"); @font-face { font-family: "anton"; src: url("../font/anton-v23-latin-regular.woff") format("woff"), url("../font/anton-v23-latin-regular.ttf") format("truetype"); } /*--------------------------------- カラーパレット ---------------------------------*/ /*--------------------------------- mq（メディアクエリを呼び出す） $name $value ---------------------------------*/ /*--------------------------------- 白黒画像背景 $url $coverColor ---------------------------------*/ /*--------------------------------- 影 ---------------------------------*/ .shadow00 { box-shadow: none !important; } .shadow01 { box-shadow: 0 2px 5px rgba(0, 0, 0, 0.26); } .shadow02 { box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px; } /*--------------------------------- 共通 ---------------------------------*/ #main { background-color: #AEBCA7; color: #37482F; } .shape { overflow: hidden; position: relative; } .shape::before { content: ""; font-family: "shape divider from ShapeDividers.com"; position: absolute; bottom: -1px; left: -1px; right: -1px; top: -1px; z-index: 3; pointer-events: none; background-repeat: no-repeat; background-size: 100% 90px; background-position: 50% 0%; background-image: url('data:image/svg+xml;charset=utf8, '); } @media (min-width: 768px) { .shape::before { background-size: 100% 90px; background-position: 50% 0%; } } @media (min-width: 1025px) { .shape::before { bottom: -0.1vw; left: -0.1vw; right: -0.1vw; top: -0.1vw; background-size: 100% 90px; background-position: 50% 0%; } } @media (min-width: 2100px) { .shape::before { background-size: 100% calc(2vw + 90px); } } /*--------------------------------- ページ ---------------------------------*/ #stream_staff { text-align: center; /* ---------- first_view ---------- */ } #stream_staff #first_view { position: relative; height: 380px; overflow: hidden; } @media screen and (max-width: 767px) { #stream_staff #first_view { height: 240px; } } #stream_staff #first_view img { position: absolute; top: 20%; left: 50%; -webkit-transform: translate(-50%, -20%); transform: translate(-50%, -20%); width: 110%; -webkit-filter: brightness(30%) blur(4px) saturate(200%); filter: brightness(30%) blur(4px) saturate(200%); } #stream_staff #first_view .photo_txt { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); color: #C8C3C3; background-color: rgba(255, 255, 255, 0.04); border: 0.5px solid #E3E1E1; margin: 0; padding: 40px 88px; line-height: 1; font-size: 4rem; white-space: nowrap; } @media screen and (max-width: 991px) { #stream_staff #first_view .photo_txt { padding: 24px 40px; font-size: 3rem; } } @media screen and (max-width: 767px) { #stream_staff #first_view .photo_txt { padding: 24px 40px; font-size: 1.5rem; } } #stream_staff { /* ---------- about ---------- */ } #stream_staff #about { position: relative; background-color: #212B1C; color: #ACA5A6; z-index: 0; overflow: hidden; } #stream_staff { /* ---------- member ---------- */ } #stream_staff #member .title { display: inline-block; padding: 8px 80px; border-radius: 40px; border: 1px solid #37482F; } #stream_staff #member .su_position { border: 1px solid #37482F; border-radius: 0.25rem; padding: 24px; } #stream_staff #member .staff { margin-top: 40px; } #stream_staff #member .staff + .staff { margin-top: 64px; } #stream_staff { /* ---------- sns ---------- */ } #stream_staff #sns { position: relative; background-color: #37482F; color: #909F89; z-index: 0; }/*# sourceMappingURL=stream_staff.css.map */