@charset "utf-8";
/* CSS Document */

/*　ボタン
======================================================= */
[class*="dec-btn"] {
  border-radius: 80px;
  border: 2px solid;
  box-shadow: 0 0 12px #5161ad;
  display: inline-block;
  text-decoration: none !important;
  transition: 0.5s;
  max-width: 100%;
}

/* base */
.dec-btn--primary {
  background-color: #b9bfde !important;
  border-color: #b9bfde !important;
  color: #fff !important;
}
.dec-btn--secondary {
  background-color: #f6eae5 !important;
  border-color: #f6eae5 !important;
  color: #535353 !important;
}
.dec-btn--attention {
  background-color: #d3191c !important;
  border-color: #d3191c !important;
  color: #fff !important;
}
.dec-btn--dark {
  background-color: #6d6d6d !important;
  border-color: #6d6d6d !important;
  color: #fff !important;
}
.dec-btn--light {
  background-color: #e3e5f1 !important;
  border-color: #e3e5f1 !important;
  color: #535353 !important;
}
.dec-btn--grey {
  background-color: #ddd !important;
  border-color: #ddd !important;
  color: #535353 !important;
}

/* outline */
[class*="dec-btn-ol"] {
  background-color: transparent;
  border: 2px solid;
}
.dec-btn-ol--primary {
  border-color: #b9bfde !important;
  color: #535353 !important;
}
.dec-btn-ol--secondary {
  border-color: #f6eae5 !important;
  color: #535353 !important;
}
.dec-btn-ol--attention {
  border-color: #d3191c !important;
  color: #d3191c !important;
}
.dec-btn-ol--dark {
  border-color: #6d6d6d !important;
  color: #6d6d6d !important;
}
.dec-btn-ol--light {
  border-color: #e3e5f1 !important;
  color: #535353 !important;
}
.dec-btn-ol--grey {
  border-color: #ddd !important;
  color: #535353 !important;
}

/* hover・focus */
[class*="dec-btn"]:hover,
[class*="dec-btn"]:focus {
  opacity: 1;
  text-decoration: none;
}
.dec-btn--primary:hover,
.dec-btn--primary:focus {
  background-color: #8590c6 !important;
  border-color: #8590c6 !important;
  color: #fff !important;
}
.dec-btn--secondary:hover,
.dec-btn--secondary:focus,
.dec-btn--light:hover,
.dec-btn--light:focus,
.dec-btn--grey:hover,
.dec-btn--grey:focus {
  background-color: #8590c6 !important;
  border-color: #8590c6 !important;
  color: #535353 !important;
}

.dec-btn--attention:hover,
.dec-btn--attention:focus {
  background-color: #970609 !important;
  border-color: #970609 !important;
  color: #fff !important;
}
.dec-btn--dark:hover,
.dec-btn--dark:focus {
  background-color: #444 !important;
  border-color: #444 !important;
  color: #fff !important;
}
.dec-btn-ol--primary:hover,
.dec-btn-ol--primary:focus,
.dec-btn-ol--secondary:hover,
.dec-btn-ol--secondary:focus,
.dec-btn-ol--light:hover,
.dec-btn-ol--light:focus,
.dec-btn-ol--grey:hover,
.dec-btn-ol--grey:focus {
  border-color: #dac4b2 !important;
  color: #535353 !important;
}
.dec-btn-ol--attention:hover,
.dec-btn-ol--attention:focus {
  border-color: #970609 !important;
  color: #970609 !important;
}
.dec-btn-ol--dark:hover,
.dec-btn-ol--dark:focus {
  border-color: #444 !important;
  color: #444 !important;
}

/* size */
.dec-btn--size-lg { padding: 2rem 16rem;}
.dec-btn--size-md { padding: 1.333rem 8rem;}
.dec-btn--size-sm { padding: .666rem 2rem;}


/*　罫線
======================================================= */
.dec-line--primary,
.dec-line-pe--primary::before,
.dec-line-pe--primary::after {
  border-color: #b9bfde !important;
}
.dec-line--secondary,
.dec-line-pe--secondary::before,
.dec-line-pe--secondary::after {
  border-color: #f6eae5 !important;
}
.dec-line--attention,
.dec-line-pe--attention::before,
.dec-line-pe--attention::after {
  border-color: #d3191c !important;
}
.dec-line--dark,
.dec-line-pe--dark::before,
.dec-line-pe--dark::after {
  border-color: #6d6d6d !important;
}
.dec-line--light,
.dec-line-pe--light::before,
.dec-line-pe--light::after {
  border-color: #e3e5f1 !important;
}
.dec-line--grey,
.dec-line-pe--grey::before,
.dec-line-pe--grey::after {
  border-color: #ddd !important;
}


/*　背景
======================================================= */
.dec-bg--primary,
.dec-bg-pe--primary::before,
.dec-bg-pe--primary::after {
  background-color: #b9bfde !important;
  color: #fff !important;
}
.dec-bg--secondary,
.dec-bg-pe--secondary::before,
.dec-bg-pe--secondary::after {
  background-color: #f6eae5 !important;
  color: #535353 !important;
}
.dec-bg--attention,
.dec-bg-pe--attention::before,
.dec-bg-pe--attention::after {
  background-color: #d3191c !important;
  color: #fff !important;
}
.dec-bg--dark,
.dec-bg-pe--dark::before,
.dec-bg-pe--dark::after {
  background-color: #6d6d6d !important;
  color: #fff !important;
}
.dec-bg--light,
.dec-bg-pe--light::before,
.dec-bg-pe--light::after {
  background-color: #e3e5f1 !important;
  color: #535353 !important;
}
.siteblock-footer .dec-bg--light a:not([class*="dec-btn"]) {
  color: currentColor;
}
.dec-bg--grey,
.dec-bg-pe--grey::before,
.dec-bg-pe--grey::after {
  background-color: #ddd !important;
  color: #535353 !important;
}

.dec-bg--contents,
.dec-bg-pe--contents::before,
.dec-bg-pe--contents::after {
  background: #fff !important;
  color: #535353 !important;
}
.siteblock-main .dec-bg--contents,
.siteblock-main .dec-bg-pe--contents::before,
.siteblock-main .dec-bg-pe--contents::after,
.siteblock-bottom .dec-bg--contents,
.siteblock-bottom .dec-bg-pe--contents::before,
.siteblock-bottom .dec-bg-pe--contents::after,
.siteblock-side .dec-bg--contents,
.siteblock-side .dec-bg-pe--contents::before,
.siteblock-side .dec-bg-pe--contents::after {
  background: #ecedf3 !important;
}
.siteblock-header .dec-bg--contents,
.siteblock-header .dec-bg-pe--contents::before,
.siteblock-header .dec-bg-pe--contents::after,
.pagetemp-top .siteblock-upper .dec-bg--contents,
.pagetemp-top .siteblock-upper .dec-bg-pe--contents::before,
.pagetemp-top .siteblock-upper .dec-bg-pe--contents::after {
  background: #fafafa !important;
}
.pagetemp-top .siteblock-main .dec-bg--contents,
.pagetemp-top .siteblock-main .dec-bg-pe--contents::before,
.pagetemp-top .siteblock-main .dec-bg-pe--contents::after {
  background: #f3f3f3 !important;
}
.pagetemp-top .siteblock-opt1 .dec-bg--contents,
.pagetemp-top .siteblock-opt1 .dec-bg-pe--contents::before,
.pagetemp-top .siteblock-opt1 .dec-bg-pe--contents::after {
  background: #dcdee9 !important;
}
.pagetemp-top .siteblock-bottom .dec-bg--contents,
.pagetemp-top .siteblock-bottom .dec-bg-pe--contents::before,
.pagetemp-top .siteblock-bottom .dec-bg-pe--contents::after {
  background: #fff !important;
}
.pagetemp-column1 .sitedesign-optblock .siteblock-opt3 .dec-bg--contents,
.pagetemp-column1 .sitedesign-optblock .siteblock-opt3 .dec-bg-pe--contents::before,
.pagetemp-column1 .sitedesign-optblock .siteblock-opt3 .dec-bg-pe--contents::after ,
.pagetemp-column2 .sitedesign-optblock .siteblock-opt3 .dec-bg--contents,
.pagetemp-column2 .sitedesign-optblock .siteblock-opt3 .dec-bg-pe--contents::before,
.pagetemp-column2 .sitedesign-optblock .siteblock-opt3 .dec-bg-pe--contents::after {
  background: #dcdee9 !important;
}
.siteblock-footer .dec-bg--contents,
.siteblock-footer .dec-bg-pe--contents::before,
.siteblock-footer .dec-bg-pe--contents::after {
  background: #6d6d6d !important;
  color: #fff !important;
}

/*　テキスト
======================================================= */
.dec-txt--primary,
.dec-txt-pe--primary::before,
.dec-txt-pe--primary::after {
  color: #b9bfde !important;
}
.dec-txt--secondary,
.dec-txt-pe--secondary::before,
.dec-txt-pe--secondary::after {
  color: #f6eae5 !important;
}
.dec-txt--attention,
.dec-txt-pe--attention::before,
.dec-txt-pe--attention::after {
  color: #d3191c !important;
}
.dec-txt--dark,
.dec-txt-pe--dark::before,
.dec-txt-pe--dark::after {
  color: #535353 !important;
}
.dec-txt--light,
.dec-txt-pe--light::before,
.dec-txt-pe--light::after {
  color: #e3e5f1 !important;
}
.dec-txt--grey,
.dec-txt-pe--grey::before,
.dec-txt-pe--grey::after {
  color: #ddd !important;
}


/*　ボックス
======================================================= */
[class*="dec-box-"] {
  border-radius: 10px;
  box-shadow: inset 2px 2px 5px rgba(0,0,0,.1), inset -3px -3px 7px  rgba(255,255,255,.2);
  padding: 15px;
}

.dec-box--primary,
.dec-box-pe--primary::before,
.dec-box-pe--primary::after  {
  background-color: #ecedf3 !important;
  border-width: 1px;
  border-style: solid;
  border-color: #b9bfde !important;
  color: #535353 !important;
}
.dec-box--secondary,
.dec-box-pe--secondary::before,
.dec-box-pe--secondary::after  {
  background-color: #f6eae5 !important;
  border-width: 1px;
  border-style: solid;
  border-color: #f6eae5 !important;
}
.dec-box--attention,
.dec-box-pe--attention::before,
.dec-box-pe--attention::after  {
  background-color: #f9dbdc !important;
  border-width: 1px;
  border-style: solid;
  border-color: #f9dbdc !important;
}
.dec-box--dark,
.dec-box-pe--dark::before,
.dec-box-pe--dark::after  {
  background-color: #6d6d6d !important;
  border-width: 1px;
  border-style: solid;
  border-color: #6d6d6d !important;
  color: #fff !important;
}
.dec-box--light,
.dec-box-pe--light::before,
.dec-box-pe--light::after  {
  background-color: #e3e5f1 !important;
  border-width: 1px;
  border-style: solid;
  border-color: #e3e5f1 !important;
}
.dec-box--grey,
.dec-box-pe--grey::before,
.dec-box-pe--grey::after  {
  background-color: transparent;
  border: none;
  box-shadow: inset 2px 2px 5px rgba(0,0,0,.1), inset -3px -3px 7px  rgba(255,255,255,.5);
}

/* スマホ以外 */
@media (min-width: 768px) {
  [class*="dec-box-"] {
    padding: 30px;
  }
}