<main class="main-wrapper">
<article class="article-container">
<blockquote class="blockquote">
<p>引用文の表示</p>
<p>
<cite>–
<a href="https://www.drifting-clouds.com" class="link" target="_blank" rel="noopener" title=""> UKIGUMO CAFE <svg aria-labelledby="svg-inline--fa-title-EZqlq2BXqMik" data-prefix="fas" data-icon="external-link-alt" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" class="icon svg-inline--fa fa-external-link-alt fa-w-16">
<title id="svg-inline--fa-title-EZqlq2BXqMik" class="">外部リンク</title>
<path fill="currentColor" d="M432,320H400a16,16,0,0,0-16,16V448H64V128H208a16,16,0,0,0,16-16V80a16,16,0,0,0-16-16H48A48,48,0,0,0,0,112V464a48,48,0,0,0,48,48H400a48,48,0,0,0,48-48V336A16,16,0,0,0,432,320ZM488,0h-128c-21.37,0-32.05,25.91-17,41l35.73,35.73L135,320.37a24,24,0,0,0,0,34L157.67,377a24,24,0,0,0,34,0L435.28,133.32,471,169c15,15,41,4.5,41-17V24A24,24,0,0,0,488,0Z" class=""></path>
</svg></a>
からの引用の意訳
</cite>
</p>
</blockquote>
</article>
</main>
<main class="main-wrapper">
<article class="article-container">
<blockquote class="blockquote">
<p>引用文の表示</p>
<p>
<cite>–
<a href="https://www.drifting-clouds.com" class="link" target="_blank" rel="noopener" title=""> UKIGUMO CAFE <svg aria-labelledby="svg-inline--fa-title-EZqlq2BXqMik" data-prefix="fas" data-icon="external-link-alt" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" class="icon svg-inline--fa fa-external-link-alt fa-w-16"><title id="svg-inline--fa-title-EZqlq2BXqMik" class="">外部リンク</title><path fill="currentColor" d="M432,320H400a16,16,0,0,0-16,16V448H64V128H208a16,16,0,0,0,16-16V80a16,16,0,0,0-16-16H48A48,48,0,0,0,0,112V464a48,48,0,0,0,48,48H400a48,48,0,0,0,48-48V336A16,16,0,0,0,432,320ZM488,0h-128c-21.37,0-32.05,25.91-17,41l35.73,35.73L135,320.37a24,24,0,0,0,0,34L157.67,377a24,24,0,0,0,34,0L435.28,133.32,471,169c15,15,41,4.5,41-17V24A24,24,0,0,0,488,0Z" class=""></path></svg></a>
からの引用の意訳
</cite>
</p>
</blockquote>
</article>
</main>
/* No context defined. */
.blockquote {
position: relative;
width: 100%;
margin: auto;
padding: 1.75rem 0 1.5rem 4rem;
border-left: .8em solid #b1b1b1;
background: #efefef;
color: #333;
}
.blockquote:before {
content: "\f10d";
display: inline-block;
position: absolute;
top: 1rem;
left: 1rem;
line-height: 1;
font-family: "Font Awesome 5 Free";
font-size: calc(var(--font-size-l2));
font-weight: 900;
color: #b1b1b1;
}
.blockquote > p {
line-height: 1.7;
font-size: calc(var(--font-size-m1));
}
.blockquote > p > cite {
font-style: italic;
}
.blockquote .link {
display: inline-block;
width: auto;
text-decoration: underline;
}
.blockquote .link:hover, .blockquote .link:focus {
text-decoration: none;
}
.blockquote .link > .icon {
display: inline-block;
width: 1em;
height: 1em;
margin-left: .2rem;
vertical-align: -.125em;
font-size: calc(var(--font-size-m1));
overflow: visible;
}
No notes defined.