@charset "UTF-8";
/* -------------------------------------------------------
記事本文スタイル
---------------------------------------------------------- */
.article-body { padding: 30px 0 40px; }
.article-body:after { content: " "; display: block; clear: both; }
.article-body a { text-decoration: underline; }
.article-body a:hover { opacity: .7; }
.article-body p { margin-bottom: 1.5em; line-height: 28px; font-size: 16px; }
.article-body h2 { color: #e4005a; font-size: 24px; font-weight: normal; margin: .5em 0 1.5em; }
.article-body h2.color-yellow,.article-body h3.color-yellow { color: #a0916c; }
.article-body h2.color-black,.article-body h3.color-black { color: #000; }
.article-body h2.pr { font-size: 24px; color: #f13f65; border-bottom: solid 3px #fabcc9; position: relative; font-weight: bold; }
.article-body h3.pr { font-size: 18px; color: #f13f65; border-bottom: solid 3px #fabcc9; position: relative; font-weight: bold; }
.article-body h2.pr::after { content: ""; position: absolute; display: block; width: 50%; bottom: -3px; border-bottom: solid 3px #f13f65; }
.article-body h3 { color: rgba(234, 0, 143, 0.8); font-size: 18px; font-weight: normal; margin: 2em 0 1em; }
.article-body ul { margin-left: 2em; margin-bottom: 1em; }
.article-body ol { margin-left: 2em; margin-bottom: 1em; }
.article-body blockquote { position: relative; padding: 15px 40px 10px 40px; margin: 20px auto; width: 85%; }
.article-body blockquote p { font-size: 14px; line-height: 1.5; }
.article-body blockquote::before { display: inline-block; position: absolute; top: 0; left: 0; vertical-align: middle; content: "“"; font-family: Georgia, Times New Roman, serif; color: rgba(0, 0, 0, 0.5); font-size: 60px; line-height: 1; font-weight: 900; }
.article-body blockquote::after { display: inline-block; position: absolute; bottom: 0; right: 0; vertical-align: middle; content: "”"; font-family: Georgia, Times New Roman, serif; color: rgba(0, 0, 0, 0.5); font-size: 60px; line-height: 1; font-weight: 900; }
.article-body .figure-center { margin: 20px auto; }
.article-body .figure-right { float: right; margin: 0 0 20px 20px; }
.article-body .figure-left { float: left; margin: 0 20px 20px 0; }
.article-body .image-area { max-width: 640px; }
.article-body .image-area img { width: 100%; height: auto; vertical-align: bottom; }
.article-body .image-area .caption { color: #000; font-size: 13px; padding-top: .5em; }
.article-body .image-area .caption-sub { color: #666; font-size: 14px; }
.article-body .images-2cols { display: -webkit-box; display: flex; -webkit-box-pack: justify; justify-content: space-between; width: 100%; margin: 30px 0; }
.article-body .images-2cols .image-area { width: calc((100% - 40px) / 2); }
.article-body .images-3cols { display: -webkit-box; display: flex; -webkit-box-pack: justify; justify-content: space-between; width: 100%; margin: 30px 0; }
.article-body .images-3cols .image-area { width: calc((100% - 40px) / 3); }
.article-body .article-beginning { background-color: #f0f0f0; font-size: 14px; color: #000; line-height: 1.6; padding: .8em 2em; margin: 40px 0 30px; }
.article-body .article-beginning p { font-size: 14px; line-height: 1.6; margin-bottom: 0; }
.article-body .article-explanation { border-left: 3px solid #cabd9b; padding-left: 1em; font-size: 14px; margin: 30px 0; }
.article-body .article-info { background-color: #f6f6f6; overflow: hidden; padding: 30px; }
.article-body .article-info img { float: left; margin-right: 30px; width: 120px; height: auto; }
.article-body .article-info .text { overflow: hidden; }
.article-body .article-info .text .title { font-size: 16px; margin-bottom: 1em; font-weight: bold; }
.article-body .article-info .text .lead { font-size: 16px; }
.article-body .magazine-body h2 { color: #e4005a; font-size: 24px; font-weight: bold; margin: 40px 0 1em; }
.article-body .magazine-body h3 { color: #e4005a; font-size: 24px; font-weight: normal; margin: 40px 0 1em; }
.article-body .magazine-body h4 { color: rgba(234, 0, 143, 0.8); font-size: 18px; font-weight: normal; margin: 2.5em 0 1em; }
.article-body .magazine-body ul { margin: 0; padding: 0; }
.article-body .magazine-body li { border-top: 2px dotted #dcdcdc; padding-top: 10px; margin-top: 20px; list-style: none; }
.article-body .article-btn { display: block; width: 171px; border: 1px solid #878787; border-radius: 2px; font-size: 11px; line-height: 22px; text-align: center; color: #111; margin: 20px 0; clear: both; }
.article-body .article-btn a { color: #111; display: block; text-decoration: none; }
.article-body .article-btn a:hover { opacity: .5; }
.article-body .article-btn--pink { border-color: #e4005a; color: #e4005a; }
.article-body .article-btn--pink a { color: #e4005a; }
.article-body .article-btn--bgpink { background-color: #e4005a; color: #fff; border: none; border-radius: 4px; }
.article-body .article-btn--large { border: 2px solid #e4005a; border-radius: 12px; width: 160px; display: block; padding: .3em 1em; position: relative; color: #e4005a; text-align: center; margin: 20px auto; font-size: 16px; }
.article-body .article-text-small { font-size: 14px; }
.article-body .article-text--pink { color: #e4005a; }
.article-body .article-text--yellow { color: #a0916c; }
.article-body .article-text--blue { color: #a0916c; }
.article-body .article-text-large { font-size: 24px; }
.article-body hr { margin: 30px 0; border-top: 1px #000 solid; }
.article-body .article-box { color: #999; font-size: 13px; padding: 20px; border: solid 1px #999; }
.article-body .article-box .title { font-weight: bold; margin-bottom: .5em; }
.article-body .ad-article-rect { clear:both; width:300px; height:auto; display:block; margin:20px auto 30px; background:#fff; text-align:center; }
.article-body .article-border { margin: 30px 0;  padding: 20px 0; border-top: 1px #ce518b solid; border-bottom: 1px #ce518b solid; }
.article-body .article-border--beige { border-color: #cc9966; }
.article-body .article-wrap { margin: 30px 0;  padding: 18px ; border: 1px solid #9dd28b; }
.article-body .article-wrap--pink { border-color: #d28bcf; }
.article-body .article-wrap-bold { margin: 30px auto;  padding: 12px; border: 2px solid #d28bcf; width: 90%; }
.article-body .article-wrap-bold--gray { border-color: #979797; }
.article-body .article-bg { margin: 30px 0; padding: 15px;  background: #fce5f2;}
.article-body .article-bg--gray { background: #f0f0f0;}
.article-body .article-bg--beige { background: #f1ede4;}
.article-body .article-btn-wrap { display: inline-block; border: solid 2px #e4005a; padding: 7px 22px 7px 10px; text-decoration: none; margin: 10px 0; border-radius: 5px; background: #fff; color: #7f7190; font-weight: bold; font-size: 14px; position: relative; line-height: 1.6; }
.article-body .article-btn-wrap a { text-decoration: none; color: #7f7190; }
.article-body .article-btn-wrap::after { right: 10px; width: 8px; height: 8px; border-top: 2px solid #7f7190; border-right: 2px solid #7f7190; -webkit-transform: rotate(45deg); transform: rotate(45deg); content: ""; position: absolute; top: 0; bottom: 0; left: auto; margin: auto; vertical-align: middle;}
.article-body .article-btn-wrap--gray,.article-btn-wrap--gray a,.article-btn-wrap--gray::after { border-color: #a8a8a8; color: #a8a8a8; }
.article-body .article-btn-wrap--beige,.article-btn-wrap--beige a,.article-btn-wrap--beige::after { border-color: #b6ae9c; color: #b6ae9c;}
.article-body .article-index{border-top:2px solid #454545;border-bottom:1px solid #454545;margin-bottom:30px}
.article-body .article-index__head{display:flex;justify-content:space-between;align-items:center;padding:6px 10px;font-weight:700}
.article-body .article-index__head::before{content:"";width:20px;height:22px;display:block;background-size:contain;background-image:url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjI1NiIgdmlld0JveD0iMCAwIDUxMiA1MTIiIHdpZHRoPSIyNTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0iIzRiNGI0YiI+PGNpcmNsZSBjeD0iNDgiIGN5PSI2NCIgcj0iNDgiLz48cGF0aCBkPSJtMTYwIDE2aDM1MnY5NmgtMzUyeiIvPjxjaXJjbGUgY3g9IjQ4IiBjeT0iMjU2IiByPSI0OCIvPjxwYXRoIGQ9Im0xNjAgMjA4aDM1MnY5NmgtMzUyeiIvPjxjaXJjbGUgY3g9IjQ4IiBjeT0iNDQ4IiByPSI0OCIvPjxwYXRoIGQ9Im0xNjAgNDAwaDM1MnY5NmgtMzUyeiIvPjwvZz48L3N2Zz4=)}
.article-body .article-index__head::after{content:""}
.article-body .article-index.--pink {border-color: #f683a4;}
.article-body .article-index.--blue {border-color: #55b7c2;}
.article-body .article-index.--w .article-index__head {color: #fff;}
.article-body .article-index.--w .article-index__head::before{background-image: url('data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjI1NiIgdmlld0JveD0iMCAwIDUxMiA1MTIiIHdpZHRoPSIyNTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0iI2ZmZiI+PGNpcmNsZSBjeD0iNDgiIGN5PSI2NCIgcj0iNDgiLz48cGF0aCBkPSJtMTYwIDE2aDM1MnY5NmgtMzUyeiIvPjxjaXJjbGUgY3g9IjQ4IiBjeT0iMjU2IiByPSI0OCIvPjxwYXRoIGQ9Im0xNjAgMjA4aDM1MnY5NmgtMzUyeiIvPjxjaXJjbGUgY3g9IjQ4IiBjeT0iNDQ4IiByPSI0OCIvPjxwYXRoIGQ9Im0xNjAgNDAwaDM1MnY5NmgtMzUyeiIvPjwvZz48L3N2Zz4=')}
.article-body .article-index__list{counter-reset:count 0;padding:10px 30px;font-size:1.5rem}
.article-body .article-index__list a,.article-body .article-index__list div{display:flex;cursor:pointer;margin:3px 0;text-decoration:none}
//.article-body .article-index__list a.--l::before,.article-body .article-index__list div.--l::before{content:counter(count) '';counter-increment:count 1;font-weight:700;color:#4b4b4b;margin-right:6px}
.article-body .article-index__list a.--l,.article-body .article-index__list div.--l{margin:6px 0 3px 0}
.article-body .article-index__list a.--s,.article-body .article-index__list div.--s{text-indent:14px;font-size:1.4rem}
.article-body .article-related-outside {margin:10px 0 0;}
//.article-body .article-related-outside__ttl {padding: 4px 0;background-color: rgb(247, 247, 247);border-bottom: 1px solid rgb(229, 234, 238);}
.article-body .article-related-outside__list {margin:6px 0 8px 0;}
.article-body .article-related-outside__link {color:#4679B2; text-decoration: none;font-size: 15px;}

.article-body .login-content { text-align: center; line-height: 2; border-top: 1px dotted #999; border-bottom: 1px dotted #999; margin: 0 0 16px; color: #999; }

/* 印刷用を非表示 */
.article-body.--print { display: none; }

/* リワード広告 */
.reword-modal{
  width: 100%;
  height: 100%;
  position: fixed;
  left:0;
  top:0;
  z-index: 99999;
  background: linear-gradient(rgba(250,250,250,0.7),rgba(250,250,250,1));
  display: none;
}
.reword-modal.is-show{
  display: block;
}
.reword-modal-inner {
  margin: 35vh auto;
  padding: 24px 20px;
  background: #fff;
  border-radius: 12px;
  width: 320px;
  font-size: 1.5rem;
  text-align: center;
  box-shadow: rgb(0 0 0 / 18%) 0px 0px 4px 1px;
  border: 2px solid #EB6EA0;
}
.reword-modal .reword-more-btn {
  padding-bottom: 5px;
  background: #fff;
  border-radius: 40px;
  display: block;
  font-size: 1.6rem;
  font-weight: 700;
  margin: 0 auto;
  padding: 8px 30px 10px 20px;
  position: relative;
  text-align: center;
  width: 220px;
  margin-bottom: 15px;
  border: 3px solid #e4005a;
}
.reword-modal .reword-more-btn span {
  padding-bottom: 5px;
}
.reword-modal .reword-more-btn::after {
  border-right: 2px solid #e4005a;
  border-top: 2px solid #e4005a;
  bottom: 0;
  content: "";
  height: 10px;
  margin: auto;
  position: absolute;
  right: 15px;
  top: 0;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  vertical-align: middle;
  width: 10px;
}
.reword-modal-txt {
  margin: 15px auto;
}