blockquote{float:left;width:calc(100% - 20px);margin-left:10px;}
blockquote:after, blockquote:before  {top: 100%;border: solid transparent;content: " ";height: 0;width: 0;position: absolute;pointer-events: none;}
blockquote:after  {border-width: 10px;left: 65%;margin-left: -10px;}
blockquote:before {border-top-color: rgba(0,0,0,0.01);border-width: 11px;left: 65%;margin-left: -11px;}
blockquote p {font-family: 'Alegreya', serif;font-size:1.1rem;line-height:1.2rem;color: var(--hg-fc-m);font-weight: 400;font-style: italic;position: relative;float:left;padding-left:30px;}
blockquote p:before{content: '\201C';font-family: serif;font-style: normal;font-weight: 700;position: absolute;font-size: 60px;top: 0;left: -5px;color: var(--hg-n-bg);text-shadow: 7px 14px 10px rgba(0, 0, 0, 0.1);}
blockquote p span{float:left;width:100%;display:inline-block;}
.di-kf{width:100%;display:flex;justify-content:center;flex-wrap:wrap;margin-top:16vw;}
.di-kf-c{width:100%;padding:0vw 0vw 4vw 0vw;display:flex;justify-content:center;flex-wrap:wrap;padding-bottom:40px;}
.di-kf-c h3{padding:0;margin:0;padding-top:4vw;padding-bottom:2vw;text-align:center;}
.di-kf-co{width:100%;padding-top:2vw;padding-bottom:4vw;display:flex;align-items:stretch;justify-content:center;flex-wrap:wrap;transition:all 0.4s;}
.di-kf-co-bl,.di-kf-co-br{width:50px;position:absolute;top:0;bottom:0;display:flex;transition:all 0.4s;display:flex;align-items:center;}
.di-kf-co-bl{left:10px;}
.di-kf-co-br{right:10px;}
.di-kf-co .hg-bu{margin:0;width:50px;height:50px;}
.di-kf-co .hg-bu span{margin:0;width:100%;height:100%;padding:0;border-radius:100%;}
.di-kf-cc{width:70%;overflow:hidden;}
.di-kf-cg{width:100%;}
.di-kf-cco{width:100%;}
.di-kf,di-kf-c{transition:all 0.4s;}
@media (min-width:768px){
.di-kf{margin-top:8vw;}
.di-kf-co{margin-left:14vw;margin-right:14vw;}
.di-kf-co-bl{left:0px;}
.di-kf-co-br{right:0px;}
}

@media (min-width:1024px){
.di-kf{margin-top:4vw;}
blockquote{width:calc(100% - 100px);margin-left:50px;}
blockquote p {font-size:1.3rem;line-height:1.3rem;padding-left:40px;}
blockquote p:before{font-size: 100px;left: -15px;}
.di-kf-co{margin-left:14vw;margin-right:14vw;}
}

@media (min-width:1080px) and (max-height:600px){
blockquote{width:calc(100% - 50px);margin-left:45px;}
blockquote p:before{content: '\201C';font-family: serif;font-style: normal;font-weight: 700;position: absolute;font-size: 70px;top: 0px;left: -15px;}
.di-kf-co-bl,.di-kf-co-br{width:40px;}
.di-kf-co .hg-bu{width:40px;height:41px;}
}