body .contentfix960N2014 .mainArea {
  width: 100%;
}

#socialDonation {
  color: #31316e;
  font-weight: 300;
  font-family: YakuHanJP, Hiragino Sans, Noto Sans JP, ヒラギノ角ゴシック,
    ヒラギノ角ゴ Pro W3, メイリオ, Meiryo, sans-serif;
}
#socialDonation *,
#socialDonation:before,
#socialDonation:after {
  box-sizing: border-box;
}
#socialDonation a:hover {
  text-decoration: none;
}
.contentfix960N2014 .mainArea {
  width: 100%;
}
#socialDonation .textlink {
  display: inline-block;
  font-size: 14px;
  color: #319eb6;
  transition: all 0.2s ease;
}
#socialDonation .textlink:link {
  color: #319eb6;
}
#socialDonation .textlink:hover {
  color: #e06969;
}
#socialDonation .textlink.-hasIcon {
  display: inline-flex;
}
#socialDonation .textlink-icon {
  width: 14px;
  height: 14px;
  margin-left: 4px;
  background-image: url("/resource/club_com/special/social_donation/images/socialDonation-blank.svg");
  background-repeat: no-repeat;
  transition: background-image 0.2s ease;
}
#socialDonation .textlink:hover .textlink-icon {
  background-image: url("/resource/club_com/special/social_donation/images/socialDonation-blank-red.svg");
}
#socialDonation .textlink > .icon {
  position: relative;
  width: 16px;
  height: 16px;
  margin-left: 4px;
}
#socialDonation .textlink > .icon .icon_img {
  position: absolute;
  left: 0;
}
#socialDonation .textlink.-button {
  display: inline-block;
  padding: 10px 45px;
  font-weight: 600;
  border: 1px solid #319eb6;
  border-radius: 28px;
}
#socialDonation .textlink.-button:hover {
  border: 1px solid #e06969;
}
#socialDonation > .breadcrumb {
  max-width: 1232px;
  font-size: 12px;
  vertical-align: top;
  padding-inline: 24px;
  margin-inline: auto;
}
#socialDonation .breadcrumb .breadcrumb_item {
  display: inline-block;
  margin-top: 4px;
}
#socialDonation .breadcrumb .breadcrumb_item:not(:last-of-type):after {
  display: inline-block;
  width: 0.7em;
  height: 0.7em;
  margin: 0 10px;
  content: "";
  border-top: 1px solid #30201a;
  border-right: 1px solid #30201a;
  transform: rotate(45deg) skew(-15deg, -15deg);
}
#socialDonation .breadcrumb .breadcrumb_item strong {
  font-weight: 300;
}
#socialDonation .breadcrumb .breadcrumb_item:last-child .breadcrumblink {
  pointer-events: none;
}
#socialDonation .breadcrumb .breadcrumblink:hover {
  text-decoration: underline;
}
#socialDonation .text-green {
  color: #32a848;
}
#socialDonation .text-gray {
  color: #999999;
}
#socialDonation .text-riverBlue {
  color: #319eb6;
}
#socialDonation .text-deepBlue {
  color: #31316e;
}
#socialDonation .mt16 {
  margin-top: 16px;
}
#socialDonation .mr4 {
  margin-right: 4px;
}
#socialDonation .mb8 {
  margin-bottom: 8px;
}
#socialDonation .mb12 {
  margin-bottom: 12px;
}
#socialDonation .mb16 {
  margin-bottom: 16px;
}
#socialDonation .mb24 {
  margin-bottom: 24px;
}
#socialDonation .mb32 {
  margin-bottom: 32px;
}
#socialDonation .mb40 {
  margin-bottom: 40px;
}
#socialDonation .heading .heading_text {
  font-weight: 600;
  line-height: 1.5;
}
#socialDonation .text {
  line-height: 1.5;
}
#socialDonation .text:before,
#socialDonation .text:after {
  display: block;
  overflow: hidden;
  content: "";
}
#socialDonation .text-normal {
  font-size: 14px;
}
#socialDonation .text-normal:before {
  margin-bottom: -3.5px;
}
#socialDonation .text-normal:after {
  margin-top: -3.5px;
}
#socialDonation .text-12 {
  font-size: 12px;
}
#socialDonation .text-12:after {
  margin-top: -3px;
}
#socialDonation .text-12:before {
  margin-bottom: -3px;
}
#socialDonation .text-16 {
  font-size: 16px;
}
#socialDonation .text-16:after {
  margin-top: -4px;
}
#socialDonation .text-16:before {
  margin-bottom: -4px;
}
#socialDonation .text-18 {
  font-size: 18px;
}
#socialDonation .text-18:after {
  margin-top: -4.5px;
}
#socialDonation .text-18:before {
  margin-bottom: -4.5px;
}
#socialDonation .text-22 {
  font-size: 22px;
}
#socialDonation .text-22:after {
  margin-top: -5.5px;
}
#socialDonation .text-22:before {
  margin-bottom: -5.5px;
}
#socialDonation .text-25 {
  font-size: 25px;
}
#socialDonation .text-25:after {
  margin-top: -6.25px;
}
#socialDonation .text-25:before {
  margin-bottom: -6.25px;
}
#socialDonation .text-28 {
  font-size: 28px;
}
#socialDonation .text-28:after {
  margin-top: -7px;
}
#socialDonation .text-28:before {
  margin-bottom: -7px;
}
#socialDonation .textoption {
  display: flex;
  align-items: center;
  justify-content: center;
}
#socialDonation .textoption:before,
#socialDonation .textoption:after {
  width: 26px;
  height: 1px;
  content: "";
}
#socialDonation .textoption:before {
  margin-right: 8px;
  margin-bottom: 0;
  transform: rotate(60deg);
}
#socialDonation .textoption:after {
  margin-top: 0;
  margin-left: 8px;
  transform: rotate(-60deg);
}
#socialDonation .textoption:before,
#socialDonation .textoption:after {
  background-color: #31316e;
}
#socialDonation .text-riverBlue.textoption:before,
#socialDonation .text-riverBlue.textoption:after {
  background-color: #319eb6;
}
#socialDonation .text-bold {
  font-weight: 600;
}
#socialDonation .text-left {
  text-align: left;
}
#socialDonation .text-right {
  text-align: right;
}
#socialDonation .text-left {
  text-align: left;
}
#socialDonation .img.-topBanner .img_img {
  width: 100%;
  height: 370px;
  object-fit: cover;
}
#socialDonation .icon {
  display: inline-block;
  margin-top: -4px;
  vertical-align: middle;
}
#socialDonation .anchorlink {
  display: inline-flex;
  align-items: flex-end;
  justify-content: center;
  font-size: 14px;
  transition: all 0.2s ease;
}
#socialDonation .buttonLink {
  padding: 16px 106px;
  border: 1px solid #837976;
  background-color: #ffffff;
  color: #30201a;
  border-radius: 28px;
  cursor: pointer;
  transition: opacity 0.2s ease;
}
#socialDonation .anchorlink:hover,
#socialDonation .buttonLink:hover {
  opacity: 0.7;
}
#socialDonation .box,
#socialDonation .wrapper {
  margin: 0 auto;
  text-align: center;
}
#socialDonation .wrapper.-contentMain {
  padding: 80px 0;
  background-color: #eaf5f8;
}
#socialDonation .wrapper.-bottomMain {
  padding: 80px 0;
  background-color: #fefae9;
}
#socialDonation .progressBox.-width480,
#socialDonation .progressBox.-width480 .progress {
  width: 480px;
}
#socialDonation .progressBox.-width736,
#socialDonation .progressBox.-width736 .progress {
  width: 736px;
}
#socialDonation .progressBox {
  position: relative;
  left: 50%;
  height: 33px;
  margin: 4px 0 16px;
  transform: translateX(-50%);
}
#socialDonation .progressBox > .text {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
#socialDonation .progress {
  height: 33px;
  border-radius: 17px;
  -webkit-appearance: none;
}
#socialDonation .progress::-webkit-progress-bar {
  background-color: #dfdfdf;
  border-radius: 17px;
}
/* 開始 */
#socialDonation .progressBox.-start > .text {
  left: 10px;
  color: #999999;
}
/* 途中 */
#socialDonation .progressBox.-intermediate > .text {
  left: calc(80.6% - 70px);
  color: #ffffff;
}
#socialDonation .progressBox.-intermediate .progress::-webkit-progress-value {
  background-color: #32a848;
  border-radius: 17px 0 0 17px;
}
/* 達成 */
#socialDonation .progressBox.-achievement:before {
  position: absolute;
  width: 80px;
  height: 82px;
  content: "";
  background-image: url("/resource/club_com/special/social_donation/images/socialDonation-success.svg");
}
#socialDonation .progressBox.-topProgress.-achievement:before {
  top: -34px;
  right: -54px;
}
#socialDonation .progressBox.-topProgress.-achievement > .text,
#socialDonation .progressBox.-bottomProgress.-achievement > .text {
  right: 30px;
  color: #ffffff;
}
#socialDonation .progressBox.-bottomProgress.-achievement:before {
  top: -86px;
  right: 110px;
}
#socialDonation
  .progressBox.-topProgress.-achievement
  .progress::-webkit-progress-value,
#socialDonation
  .progressBox.-bottomProgress.-achievement
  .progress::-webkit-progress-value {
  background-color: #e06969;
  border-radius: 17px;
}

#socialDonation .box {
  border-radius: 16px;
}
#socialDonation .box.-attention,
#socialDonation .box.-width976 {
  width: 976px;
}
#socialDonation .box.-attention {
  margin: 16px auto;
  padding: 13px;
  color: #dd2c08;
  border-radius: 4px;
  border: 1px solid #dd2c08;
}
#socialDonation .box.-campaignBox {
  position: relative;
  padding: 64px;
  background: #ffffff;
  box-shadow: 8px 10px 0 0 rgba(0, 0, 0, 0.05);
}
#socialDonation .box.-campaignBox:before {
  position: absolute;
  top: -120px;
  width: 1px;
  height: 120px;
  content: "";
  background-color: #3e9eb6;
}
#socialDonation .box.-information {
  padding: 24px;
  background-color: #eaf5f8;
  border-radius: 8px;
}
#socialDonation .box.-scoreBox {
  padding: 32px 59px;
  margin-bottom: 16px;
  background-color: #fefae9;
}
#socialDonation .caption {
  font-size: 12px;
  line-height: 1.67;
}
#socialDonation .boxlink {
  position: relative;
  display: block;
  height: 210px;
  padding: 16px;
  background-color: #ffffff;
  border-radius: 8px;
  transition: opacity 0.2s ease;
}
#socialDonation .boxlink .text {
  color: #31316e;
}
#socialDonation .boxlink .img_img {
  border-radius: 4px;
}
#socialDonation .boxlink:hover {
  opacity: 0.7;
}
#socialDonation .boxlink > .icon {
  position: absolute;
  right: 16px;
  bottom: 16px;
}
#socialDonation .colBox {
  display: flex;
  justify-content: center;
}
#socialDonation .colBox.-aicenter {
  align-items: center;
}
#socialDonation .colBox.-aistart {
  align-items: start;
}
#socialDonation .colBox.-descriptionBox {
  padding: 56px 0 80px;
  justify-content: space-between;
}
#socialDonation .colBox.-margin16 > * + * {
  margin-left: 16px;
}
#socialDonation .colBox.-margin24 > * + * {
  margin-left: 24px;
}
#socialDonation .colBox.-margin40 > * + * {
  margin-left: 40px;
}
#socialDonation .colBox.-cols2 > .colItem {
  width: calc(100% / 2);
}
#socialDonation .colBox.-hasSeparator > .colItem:not(:first-of-type) {
  border-left: 1px solid #d5d5d5;
}
#socialDonation .grid {
  width: 976px;
  margin: 0 auto 80px;
  text-align: center;
}
#socialDonation .grid .grid_inner {
  display: flex;
  flex-wrap: wrap;
  padding: 0;
  margin: 0;
}
#socialDonation .grid.-cols4 > .grid_inner > * {
  width: calc(100% / 4);
}
#socialDonation .grid.-hmargin18 > .grid_inner {
  margin-right: -18px;
}
#socialDonation .grid.-hmargin18 > .grid_inner > * {
  padding-right: 18px;
}
#socialDonation .grid.-vmargin24 > .grid_inner {
  margin-bottom: -24px;
}
#socialDonation .grid.-vmargin24 > .grid_inner > * {
  margin-bottom: 24px;
}
#socialDonation .grid.-hmargin18 > .grid_inner .grid_cell:before {
  width: calc(100% - 18px);
}
