@charset "UTF-8"; #st-magazine .kanren .st-top-box:not(.st-fist-post) dt { /* 最初の記事以外は180px */ height: 180px; } /* 天地中央で切り抜く */ #st-magazine .kanren .st-top-box:not(.st-fist-post) dt img { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); } #st-magazine.st-magazine-k .kanren dt img { object-fit: cover; } @media only screen and (max-width: 599px) { /* モバイルは最初の記事も180px */ #st-magazine .kanren .st-top-box dt { height: 180px; } #st-magazine .kanren .st-top-box dt img { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); } } /* ブログカード風マガジン最初の投稿 ----------------------------------------------------*/ @media only screen and (min-width: 600px) { #st-magazine .kanren .st-top-box.st-fist-post dt { overflow: hidden; width: 100%; /* トリミングしたい枠の幅 */ height: 350px; /* トリミングしたい枠の高さ */ position: relative; } #st-magazine .kanren .st-top-box.st-fist-post dl:last-child { padding-bottom:0; } #st-magazine .kanren .st-top-box.st-fist-post dt img { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100%; height: auto; } #st-magazine .kanren .st-fist-post dd { width: 100%; box-sizing:border-box; padding: 0!important; position:absolute; bottom:0; left:0px; z-index:999; } #st-magazine .kanren .st-fist-post dd .st-cards-content { padding:0px; } #st-magazine .kanren .st-fist-post dd .st-cards-content-in { background: rgba(255,255,255,0.7); padding:0 40px 20px; } #st-magazine .kanren .st-fist-post dd h3 { font-size:150%; margin-bottom:5px; line-height:1.5; padding-top:20px; } } @media print, screen and (min-width: 960px) { #st-magazine .kanren .st-top-box.st-fist-post dt { width: 100%; /* トリミングしたい枠の幅 */ height: 400px; /* トリミングしたい枠の高さ */ position: relative; } } #st-magazine .catname { border-radius:20px; font-size:14px; padding:7px 12px; } .home .post { padding: 0 5px; margin-bottom:0; } #st-magazine .kanren .st-top-box.st-continuation-post dl, #st-magazine .kanren .st-top-box.st-fist-post dl, #st-magazine.st-magazine-k .kanren dl { box-shadow: 0 1px 2px rgba(0,0,0,0.2); } /*media Queries タブレットサイズ(959px以下) ----------------------------------------------------*/ @media only screen and (max-width: 959px) { /*-- ここまで --*/ } /*media Queries タブレットサイズ(600px以上) ----------------------------------------------------*/ @media only screen and (min-width: 600px) { .home .post { padding: 0 15px; margin-bottom:0; } /*-- ここまで --*/ } /*media Queries PCサイズ(960px以上) ----------------------------------------------------*/ @media only screen and (min-width: 960px) { .home .post { padding: 0 5px; margin-bottom:0; } .home main { padding-top: 0; } /*-- ここまで --*/ }