@charset "UTF-8"; /*ブログカード風マガジン最初の投稿 */ #st-magazine .kanren .st-fist-post dt::before { padding-top: 40%; } #st-magazine .kanren .st-top-box:not(.st-fist-post) dt::before { display: block; content: ''; padding-top: 62%; width: 100%; } @media only screen and (max-width: 599px) { #st-magazine .kanren .st-top-box.st-fist-post dt::before { display: block; content: ''; padding-top: 62%; width: 100%; } } /* 天地中央で切り抜く */ #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::before { display: block; content: ''; padding-top: 62%; width: 100%; } #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%; /* トリミングしたい枠の幅 */ 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: 10px 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%; /* トリミングしたい枠の幅 */ position: relative; } } .home .post { padding: 0 5px; margin-bottom:0; } #st-magazine .kanren dd { padding-bottom:25px!important; } #st-magazine .kanren dt img { border-radius:0!important; } /*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; } #st-magazine .kanren dd, #st-magazine .kanren.st-cardbox dd { padding-left: 20px!important; } #st-magazine .kanren .st-top-box { padding: 10px!important; } #st-magazine .kanren .st-fist-post { padding: 0 10px 10px!important; } /*-- ここまで --*/ } /*media Queries PCサイズ(960px以上) ----------------------------------------------------*/ @media only screen and (min-width: 960px) { .home .post { padding: 0 5px; margin-bottom:0; } .home main { padding-top: 0; } /*-- ここまで --*/ } /*media Queries モバイルサイズ(599px以下) ----------------------------------------------------*/ @media only screen and (max-width: 599px) { #st-magazine .kanren h5.kanren-t, .post #st-magazine .kanren h5.kanren-t { margin-bottom: 0; } /*-- ここまで --*/ }