@charset "UTF-8";
.article-Header_Banner { display: block; overflow: hidden; width: 300px; margin-right: 20px; border-radius: 4px; line-height: 0; }

.article-SubBox_RankButton { position: relative; width: 100%; margin-top: 10px; padding-left: 8px; border: 1px solid #dddddd; border-radius: 4px; box-sizing: border-box; text-align: left; }
.article-SubBox_RankButton:hover { opacity: 0.7; transition: all 0.2s; }
.article-SubBox_RankButton:after { content: ""; position: absolute; inset: 0 8px 0 auto; width: 7px; height: 7px; margin: auto; border-top: 1px solid #999999; border-right: 1px solid #999999; transform: rotate(45deg); }

.article-SubBox_RankButtonInner { display: inline-block; width: 100%; color: #333333; font-size: 13px; line-height: 2.5; }

.article-BlockModal { position: fixed; inset: 0; z-index: 1000; align-items: center; justify-content: center; padding: 0 10px; box-sizing: border-box; letter-spacing: 0.08em; }

.article-BlockModal_Overlay { position: absolute; inset: 0; background: rgba(0, 0, 0, 0.5); }

.article-BlockModal_Container { position: relative; z-index: 1; width: 100%; max-width: 690px; margin: 0 auto; top: 10%; background: #ffffff; border: 3px solid #333333; border-radius: 20px; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3); overflow: hidden; }

.article-BlockModal_Title { width: 80%; padding: 30px 0 8px; margin: 0 auto; text-align: center; border-bottom: 2px solid #dddddd; font-size: 24px; font-weight: bold; }

.article-BlockModal_Body { width: 80%; padding: 20px 0; margin: 0 auto; text-align: center; }
.article-BlockModal_Body p { font-size: 14px; line-height: 1.6; }
.article-BlockModal_Body span { color: #f23d3d; }
.article-BlockModal_Body a { color: #1c69ed; text-decoration: underline; cursor: pointer; }
.article-BlockModal_Body a:hover { opacity: 0.7; }
.article-BlockModal_Body img { display: block; width: 100%; box-sizing: border-box; margin: 20px auto; padding: 26px 15%; height: auto; background: #f7f5e3; border-radius: 10px; }

.article-BlockModal_Footer { padding: 20px 0 35px; background: #f7ed9c; text-align: center; }
.article-BlockModal_Footer p { margin: 0 0 10px; font-size: 16px; font-weight: bold; }
.article-BlockModal_Footer span { color: #f23d3d; }
.article-BlockModal_Footer button { display: inline-block; width: 80%; padding: 15px 0; border-radius: 10px; border: 3px solid #333333; box-shadow: 0 3px 0 #333333; background: #fefcec; color: #333333; font-size: 18px; font-weight: bold; line-height: 1.4; text-align: center; cursor: pointer; transition: transform 0.08s ease-out, box-shadow 0.08s ease-out, background-color 0.08s ease-out; }
.article-BlockModal_Footer button:hover { transform: translateY(3px); box-shadow: 0 0 0 #333333; }