@charset "UTF-8";
/* --------------------------------------------------
	
	Format Ver  : 1.2
	Last UpDate : 2024/11/26
	
	1 - 宣言
	2 - 全ページ共有
	3 - アニメーション
	4 - テーブルセット
	5 - 
	6 - 
	5 - 
	6 - 
	7 - 
	8 - 
	9 - 

/* --------------------------------------------------

	宣言

-------------------------------------------------- */
/* --------------------------------------------------

	全ページ共有

-------------------------------------------------- */
html,
body {
  color: #000;
  font-family: "メイリオ", Meiryo, Verdana, sans-serif;
  font-size: medium;
  line-height: 1.6;
  height: 100%;
  min-height: 100%;
  word-wrap: break-word;
  -webkit-text-size-adjust: 100%;
  backface-visibility: hidden; }
  html::after,
  body::after {
    background: linear-gradient(180deg, white 0%, #b2c3db 25%, white 50%, #d9efeb 75%, white 100%);
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: "";
    z-index: -999999999999; }

a {
  color: #cc0000;
  font-weight: bold; }
  a:hover {
    text-decoration: none; }
    a:hover img {
      opacity: 0.6; }

.pc {
  display: inline-block !important; }

.sp {
  display: none !important; }

/* スマホ用 */
@media screen and (max-width: 480px) {
  img {
    max-width: 100%;
    height: auto; }

  .pc {
    display: none !important; }

  .sp {
    display: inline-block !important; } }
#wrap,
#header,
#main,
#footer {
  width: 100%;
  min-width: 1240px;
  overflow: hidden; }
  @media screen and (max-width: 480px) {
    #wrap,
    #header,
    #main,
    #footer {
      min-width: 100%; } }

.inner {
  width: 1120px;
  margin: auto;
  box-sizing: border-box; }
  @media screen and (max-width: 480px) {
    .inner {
      width: 95%; } }

/* ヘッダー */
#header {
  background: #FFF; }
  #header .inner {
    position: relative; }
  #header h2 {
    position: absolute;
    right: 0;
    top: 1em; }
    @media screen and (max-width: 480px) {
      #header h2 {
        width: 30%;
        top: .5em; } }

/* メイン */
#main {
  overflow: visible;
  /* リフォーム */
  /* 無料診断 */
  /* ポイント */
  /* サイン */
  /* お悩み */
  /* コース */
  /* 無料診断はこちらのみ */
  /* SDGs */ }
  #main #reform {
    margin: 50px 0; }
    #main #reform .reformRebirth {
      text-align: center; }
      #main #reform .reformRebirth .inner {
        background: #fff url("../images/bg_stripe.png") top repeat-x;
        padding: 10em 0 5em; }
        @media screen and (max-width: 480px) {
          #main #reform .reformRebirth .inner {
            padding: 6em 1em 2em; } }
      #main #reform .reformRebirth .title .catch {
        color: #666;
        font-family: Rounded Mplus\ 1c;
        font-size: 1.5em;
        font-weight: bold;
        margin-bottom: 1em; }
        @media screen and (max-width: 480px) {
          #main #reform .reformRebirth .title .catch {
            font-size: 1em; } }
      #main #reform .reformRebirth .rebirth {
        position: relative;
        margin-top: 4em; }
        @media screen and (min-width: 480px) {
          #main #reform .reformRebirth .rebirth {
            width: 980px;
            margin: 4em auto 0;
            display: flex;
            flex-wrap: wrap;
            justify-content: space-evenly;
            align-items: center; } }
        @media screen and (max-width: 480px) {
          #main #reform .reformRebirth .rebirth .before {
            text-align: left; } }
        @media screen and (max-width: 480px) {
          #main #reform .reformRebirth .rebirth .arrow {
            margin: 1em 0; } }
        @media screen and (max-width: 480px) {
          #main #reform .reformRebirth .rebirth .after {
            text-align: left; } }
        #main #reform .reformRebirth .rebirth .point {
          position: absolute;
          bottom: -10px;
          right: -20px; }
          @media screen and (max-width: 480px) {
            #main #reform .reformRebirth .rebirth .point {
              bottom: -20px;
              right: 0; } }
    #main #reform .reformCheck {
      text-align: center; }
      #main #reform .reformCheck .inner {
        background: #fff url("../images/bg_grid.png");
        padding: 5em 2em; }
        @media screen and (max-width: 480px) {
          #main #reform .reformCheck .inner {
            padding: 4em 1em 2em; } }
      #main #reform .reformCheck ul,
      #main #reform .reformCheck li {
        list-style: none; }
      @media screen and (min-width: 480px) {
        #main #reform .reformCheck ul {
          display: flex;
          flex-wrap: wrap;
          justify-content: space-evenly; } }
      #main #reform .reformCheck ul li {
        padding: 1em 0; }
        @media screen and (max-width: 480px) {
          #main #reform .reformCheck ul li {
            border-top: 1px solid #f2f2f2; }
            #main #reform .reformCheck ul li:first-child {
              padding-top: 0;
              border-top: 0; } }
        #main #reform .reformCheck ul li img {
          filter: drop-shadow(0 0 3px rgba(0, 0, 0, 0.1)); }
  #main #diagnose {
    color: #00947d;
    font-family: Rounded Mplus\ 1c;
    font-weight: bold;
    font-size: 2em;
    text-align: center; }
    @media screen and (max-width: 480px) {
      #main #diagnose {
        font-size: 1.2em; } }
    #main #diagnose .inner {
      background: #fff;
      padding: 1.5em 0;
      border: 3px solid #00947d;
      border-radius: 1em;
      box-sizing: border-box; }
    #main #diagnose ul.btn {
      list-style: none;
      display: flex;
      flex-wrap: wrap;
      justify-content: space-evenly; }
      #main #diagnose ul.btn li {
        margin-top: 1em; }
      #main #diagnose ul.btn li > a {
        color: #fff;
        text-decoration: none;
        line-height: 1.2;
        vertical-align: middle;
        background: #335e9e;
        width: 15em;
        height: 3em;
        padding: .5em 0;
        margin: 0 auto;
        border: 1px solid #335e9e;
        border-radius: .5rem;
        box-shadow: 0px 5px 0 #003686;
        transition: .3s;
        display: table-cell;
        overflow: hidden;
        position: relative; }
        #main #diagnose ul.btn li > a::before {
          position: absolute;
          top: 0;
          right: -138%;
          content: '';
          width: 130%;
          height: 100%;
          background: #fff;
          z-index: 1;
          transform: skewX(-45deg); }
        #main #diagnose ul.btn li > a:hover {
          transform: translate3d(0, 5px, 0);
          box-shadow: none; }
      #main #diagnose ul.btn span a {
        color: #000;
        font-size: 1.2rem;
        margin-top: .5em;
        display: inline-block; }
        @media screen and (max-width: 480px) {
          #main #diagnose ul.btn span a {
            font-size: 1rem;
            margin-top: 1em; } }
  #main #point {
    margin-top: 10em; }
    @media screen and (max-width: 480px) {
      #main #point {
        margin-top: 5em; } }
    #main #point .pointRead {
      text-align: center; }
      #main #point .pointRead .inner {
        background: #fff url("../images/bg_stripe.png") top repeat-x;
        padding: 10em 0 5em; }
        @media screen and (max-width: 480px) {
          #main #point .pointRead .inner {
            padding: 6em 0 2em; } }
      #main #point .pointRead ul,
      #main #point .pointRead li {
        list-style: none; }
      #main #point .pointRead ul {
        margin: 3em 0; }
        @media screen and (min-width: 480px) {
          #main #point .pointRead ul {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-evenly; } }
        @media screen and (min-width: 480px) {
          #main #point .pointRead ul li:last-child {
            display: none; } }
        @media screen and (max-width: 480px) {
          #main #point .pointRead ul li {
            margin-top: 1em; }
            #main #point .pointRead ul li:first-child {
              margin-top: 0; }
            #main #point .pointRead ul li:nth-child(1), #main #point .pointRead ul li:nth-child(2), #main #point .pointRead ul li:nth-child(3) {
              display: none; } }
    #main #point .pointVoice {
      text-align: center; }
      #main #point .pointVoice .inner {
        background: #fff url("../images/bg_grid.png");
        padding: 5em 2em; }
        @media screen and (max-width: 480px) {
          #main #point .pointVoice .inner {
            padding: 4em 1em 2em; } }
      #main #point .pointVoice ul,
      #main #point .pointVoice li {
        list-style: none; }
      #main #point .pointVoice ul {
        margin: 3em 0; }
        @media screen and (min-width: 480px) {
          #main #point .pointVoice ul {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-evenly; } }
        @media screen and (max-width: 480px) {
          #main #point .pointVoice ul li {
            margin-top: 1em; }
            #main #point .pointVoice ul li:first-child {
              margin-top: 0; } }
  #main #sign {
    text-align: center;
    margin-top: 100px;
    padding: 5em 0 0; }
    @media screen and (max-width: 480px) {
      #main #sign {
        padding: 2em 0; } }
    @media screen and (min-width: 480px) {
      #main #sign .inner {
        width: 960px; } }
    #main #sign .follow {
      position: relative; }
      #main #sign .follow .followBtn {
        position: fixed;
        z-index: 1;
        animation: fuwafuwa 1s ease-in-out infinite alternate; }
        @media screen and (min-width: 480px) {
          #main #sign .follow .followBtn {
            bottom: 3em;
            right: calc((100vw - 1500px) / 2); } }
        @media screen and (max-width: 480px) {
          #main #sign .follow .followBtn {
            bottom: 1em;
            right: 1em; } }
        @media screen and (max-width: 1500px) and (min-width: 481px) {
          #main #sign .follow .followBtn {
            bottom: 3em;
            right: 1em; } }
        #main #sign .follow .followBtn a {
          background: #335e9e;
          font-family: Rounded Mplus\ 1c;
          color: #fff;
          font-size: 2em;
          line-height: 1.2;
          text-decoration: none;
          text-align: center;
          width: 250px;
          height: 250px;
          border-radius: 100em;
          display: flex;
          flex-wrap: wrap;
          flex-direction: column;
          align-content: center;
          justify-content: center; }
          @media screen and (max-width: 480px) {
            #main #sign .follow .followBtn a {
              font-size: 1.2em;
              line-height: 1.2;
              width: 120px;
              height: 120px; } }
          #main #sign .follow .followBtn a span {
            font-size: 1.5rem;
            margin-bottom: .3em; }
            @media screen and (max-width: 480px) {
              #main #sign .follow .followBtn a span {
                font-size: 1rem; } }
    @media screen and (max-width: 480px) {
      #main #sign .titleSub img {
        width: 60%; } }
    #main #sign .title {
      margin-top: 2em; }
      @media screen and (max-width: 480px) {
        #main #sign .title {
          margin-top: 1em; } }
    #main #sign ul,
    #main #sign li {
      list-style: none; }
    #main #sign ul.check {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      margin: 3em 0 0; }
      @media screen and (max-width: 480px) {
        #main #sign ul.check {
          margin: 1.5em 0 0; } }
      #main #sign ul.check li {
        margin: 0 1em;
        transition-duration: .3s; }
        @media screen and (max-width: 480px) {
          #main #sign ul.check li {
            width: 45%;
            margin: 0 .5em .5em; } }
        #main #sign ul.check li:hover {
          transform: scale(1.1);
          transition-duration: .3s; }
  #main #qaFreeDiagnosis,
  #main #qaSize,
  #main #qaFlowchart,
  #main #qaRemake {
    text-align: center;
    padding: 10em 0 0; }
    @media screen and (max-width: 480px) {
      #main #qaFreeDiagnosis,
      #main #qaSize,
      #main #qaFlowchart,
      #main #qaRemake {
        padding: 5em 0 0; } }
    @media screen and (max-width: 480px) {
      #main #qaFreeDiagnosis .titleSub img,
      #main #qaSize .titleSub img,
      #main #qaFlowchart .titleSub img,
      #main #qaRemake .titleSub img {
        width: 60%; } }
    #main #qaFreeDiagnosis .title,
    #main #qaSize .title,
    #main #qaFlowchart .title,
    #main #qaRemake .title {
      margin-top: 2em; }
      @media screen and (max-width: 480px) {
        #main #qaFreeDiagnosis .title,
        #main #qaSize .title,
        #main #qaFlowchart .title,
        #main #qaRemake .title {
          margin-top: 1em; } }
    #main #qaFreeDiagnosis .message,
    #main #qaSize .message,
    #main #qaFlowchart .message,
    #main #qaRemake .message {
      color: #666;
      font-family: Rounded Mplus\ 1c;
      font-size: 1.5em; }
      @media screen and (max-width: 480px) {
        #main #qaFreeDiagnosis .message,
        #main #qaSize .message,
        #main #qaFlowchart .message,
        #main #qaRemake .message {
          font-size: 1.2em;
          text-align: left; } }
      #main #qaFreeDiagnosis .message p,
      #main #qaSize .message p,
      #main #qaFlowchart .message p,
      #main #qaRemake .message p {
        margin-top: 2em; }
    #main #qaFreeDiagnosis .text,
    #main #qaSize .text,
    #main #qaFlowchart .text,
    #main #qaRemake .text {
      color: #666;
      font-family: Rounded Mplus\ 1c;
      font-size: 1.5em;
      margin-top: 2em; }
      @media screen and (max-width: 480px) {
        #main #qaFreeDiagnosis .text,
        #main #qaSize .text,
        #main #qaFlowchart .text,
        #main #qaRemake .text {
          font-size: 1.2em;
          text-align: left; } }
    #main #qaFreeDiagnosis .question,
    #main #qaSize .question,
    #main #qaFlowchart .question,
    #main #qaRemake .question {
      position: relative; }
      @media screen and (min-width: 480px) {
        #main #qaFreeDiagnosis .question,
        #main #qaSize .question,
        #main #qaFlowchart .question,
        #main #qaRemake .question {
          width: 980px;
          margin: 0 auto; } }
      @media screen and (min-width: 480px) {
        #main #qaFreeDiagnosis .question .illust,
        #main #qaFreeDiagnosis .question .pop-1,
        #main #qaFreeDiagnosis .question .pop-2,
        #main #qaSize .question .illust,
        #main #qaSize .question .pop-1,
        #main #qaSize .question .pop-2,
        #main #qaFlowchart .question .illust,
        #main #qaFlowchart .question .pop-1,
        #main #qaFlowchart .question .pop-2,
        #main #qaRemake .question .illust,
        #main #qaRemake .question .pop-1,
        #main #qaRemake .question .pop-2 {
          height: 210px; } }
      #main #qaFreeDiagnosis .question .illust,
      #main #qaSize .question .illust,
      #main #qaFlowchart .question .illust,
      #main #qaRemake .question .illust {
        text-align: center; }
        @media screen and (min-width: 480px) {
          #main #qaFreeDiagnosis .question .illust,
          #main #qaSize .question .illust,
          #main #qaFlowchart .question .illust,
          #main #qaRemake .question .illust {
            position: relative;
            top: 0;
            left: 50%;
            transform: translateX(-50%); } }
      @media screen and (min-width: 480px) {
        #main #qaFreeDiagnosis .question .pop-1,
        #main #qaSize .question .pop-1,
        #main #qaFlowchart .question .pop-1,
        #main #qaRemake .question .pop-1 {
          position: absolute;
          top: 0;
          left: 3em; } }
      #main #qaFreeDiagnosis .question .pop-2,
      #main #qaSize .question .pop-2,
      #main #qaFlowchart .question .pop-2,
      #main #qaRemake .question .pop-2 {
        animation-delay: .5s; }
        @media screen and (min-width: 480px) {
          #main #qaFreeDiagnosis .question .pop-2,
          #main #qaSize .question .pop-2,
          #main #qaFlowchart .question .pop-2,
          #main #qaRemake .question .pop-2 {
            position: absolute;
            top: 0;
            right: 3em; } }
    #main #qaFreeDiagnosis .diagnose,
    #main #qaSize .diagnose,
    #main #qaFlowchart .diagnose,
    #main #qaRemake .diagnose {
      background: #fff;
      font-family: Rounded Mplus\ 1c;
      text-align: center;
      margin: 0 auto;
      padding: 3em 1em;
      border: 3px solid #00947d;
      border-radius: 2em;
      box-sizing: border-box;
      position: relative; }
      #main #qaFreeDiagnosis .diagnose .btn,
      #main #qaSize .diagnose .btn,
      #main #qaFlowchart .diagnose .btn,
      #main #qaRemake .diagnose .btn {
        font-size: 2em;
        margin-top: 1.5em; }
        @media screen and (max-width: 480px) {
          #main #qaFreeDiagnosis .diagnose .btn,
          #main #qaSize .diagnose .btn,
          #main #qaFlowchart .diagnose .btn,
          #main #qaRemake .diagnose .btn {
            font-size: 1.2em; } }
        #main #qaFreeDiagnosis .diagnose .btn.mb,
        #main #qaSize .diagnose .btn.mb,
        #main #qaFlowchart .diagnose .btn.mb,
        #main #qaRemake .diagnose .btn.mb {
          margin-bottom: 6em; }
          @media screen and (max-width: 480px) {
            #main #qaFreeDiagnosis .diagnose .btn.mb,
            #main #qaSize .diagnose .btn.mb,
            #main #qaFlowchart .diagnose .btn.mb,
            #main #qaRemake .diagnose .btn.mb {
              margin-bottom: 8em; } }
        #main #qaFreeDiagnosis .diagnose .btn a,
        #main #qaSize .diagnose .btn a,
        #main #qaFlowchart .diagnose .btn a,
        #main #qaRemake .diagnose .btn a {
          color: #fff;
          text-decoration: none;
          background: #335e9e;
          width: 20em;
          padding: .5em 0;
          margin: 0 auto;
          border: 1px solid #335e9e;
          border-radius: .5rem;
          box-shadow: 0px 5px 0 #003686;
          transition: .3s;
          display: block;
          overflow: hidden;
          position: relative; }
          @media screen and (max-width: 480px) {
            #main #qaFreeDiagnosis .diagnose .btn a,
            #main #qaSize .diagnose .btn a,
            #main #qaFlowchart .diagnose .btn a,
            #main #qaRemake .diagnose .btn a {
              width: 100%; } }
          #main #qaFreeDiagnosis .diagnose .btn a::before,
          #main #qaSize .diagnose .btn a::before,
          #main #qaFlowchart .diagnose .btn a::before,
          #main #qaRemake .diagnose .btn a::before {
            position: absolute;
            top: 0;
            right: -133%;
            content: '';
            width: 130%;
            height: 100%;
            background: #fff;
            z-index: 1;
            transform: skewX(-45deg); }
          #main #qaFreeDiagnosis .diagnose .btn a:hover,
          #main #qaSize .diagnose .btn a:hover,
          #main #qaFlowchart .diagnose .btn a:hover,
          #main #qaRemake .diagnose .btn a:hover {
            transform: translate3d(0, 5px, 0);
            box-shadow: none; }
      #main #qaFreeDiagnosis .diagnose .notes,
      #main #qaSize .diagnose .notes,
      #main #qaFlowchart .diagnose .notes,
      #main #qaRemake .diagnose .notes {
        font-size: 1.2em;
        margin-top: 1.5em; }
      #main #qaFreeDiagnosis .diagnose .illust,
      #main #qaSize .diagnose .illust,
      #main #qaFlowchart .diagnose .illust,
      #main #qaRemake .diagnose .illust {
        position: absolute;
        bottom: -3px;
        right: 2em; }
        @media screen and (max-width: 480px) {
          #main #qaFreeDiagnosis .diagnose .illust,
          #main #qaSize .diagnose .illust,
          #main #qaFlowchart .diagnose .illust,
          #main #qaRemake .diagnose .illust {
            display: none; } }
      #main #qaFreeDiagnosis .diagnose .illustSP,
      #main #qaSize .diagnose .illustSP,
      #main #qaFlowchart .diagnose .illustSP,
      #main #qaRemake .diagnose .illustSP {
        position: absolute;
        bottom: -3px;
        right: 2em; }
        @media screen and (max-width: 480px) {
          #main #qaFreeDiagnosis .diagnose .illustSP,
          #main #qaSize .diagnose .illustSP,
          #main #qaFlowchart .diagnose .illustSP,
          #main #qaRemake .diagnose .illustSP {
            position: absolute;
            bottom: -3px;
            right: -1em; } }
      #main #qaFreeDiagnosis .diagnose ul,
      #main #qaFreeDiagnosis .diagnose li,
      #main #qaSize .diagnose ul,
      #main #qaSize .diagnose li,
      #main #qaFlowchart .diagnose ul,
      #main #qaFlowchart .diagnose li,
      #main #qaRemake .diagnose ul,
      #main #qaRemake .diagnose li {
        list-style: none; }
      #main #qaFreeDiagnosis .diagnose ul.flow,
      #main #qaSize .diagnose ul.flow,
      #main #qaFlowchart .diagnose ul.flow,
      #main #qaRemake .diagnose ul.flow {
        margin: 3em 0 2em; }
        @media screen and (min-width: 480px) {
          #main #qaFreeDiagnosis .diagnose ul.flow,
          #main #qaSize .diagnose ul.flow,
          #main #qaFlowchart .diagnose ul.flow,
          #main #qaRemake .diagnose ul.flow {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            align-items: center; } }
        @media screen and (min-width: 480px) {
          #main #qaFreeDiagnosis .diagnose ul.flow li,
          #main #qaSize .diagnose ul.flow li,
          #main #qaFlowchart .diagnose ul.flow li,
          #main #qaRemake .diagnose ul.flow li {
            width: calc( 95% / 3 );
            display: flex;
            align-items: center; }
            #main #qaFreeDiagnosis .diagnose ul.flow li::after,
            #main #qaSize .diagnose ul.flow li::after,
            #main #qaFlowchart .diagnose ul.flow li::after,
            #main #qaRemake .diagnose ul.flow li::after {
              content: url("../images/qa_next.png");
              display: block; }
            #main #qaFreeDiagnosis .diagnose ul.flow li:last-child::after,
            #main #qaSize .diagnose ul.flow li:last-child::after,
            #main #qaFlowchart .diagnose ul.flow li:last-child::after,
            #main #qaRemake .diagnose ul.flow li:last-child::after {
              display: none; } }
        @media screen and (max-width: 480px) {
          #main #qaFreeDiagnosis .diagnose ul.flow li::after,
          #main #qaSize .diagnose ul.flow li::after,
          #main #qaFlowchart .diagnose ul.flow li::after,
          #main #qaRemake .diagnose ul.flow li::after {
            content: url("../images/qa_next.png");
            display: block;
            transform: rotate(90deg); }
          #main #qaFreeDiagnosis .diagnose ul.flow li:last-child::after,
          #main #qaSize .diagnose ul.flow li:last-child::after,
          #main #qaFlowchart .diagnose ul.flow li:last-child::after,
          #main #qaRemake .diagnose ul.flow li:last-child::after {
            display: none; } }
        #main #qaFreeDiagnosis .diagnose ul.flow li img,
        #main #qaSize .diagnose ul.flow li img,
        #main #qaFlowchart .diagnose ul.flow li img,
        #main #qaRemake .diagnose ul.flow li img {
          width: 100%; }
      @media screen and (min-width: 480px) {
        #main #qaFreeDiagnosis .diagnose ul.qaFlowchartList,
        #main #qaSize .diagnose ul.qaFlowchartList,
        #main #qaFlowchart .diagnose ul.qaFlowchartList,
        #main #qaRemake .diagnose ul.qaFlowchartList {
          margin-bottom: 10em;
          display: flex;
          flex-wrap: wrap;
          justify-content: center; } }
      @media screen and (max-width: 480px) {
        #main #qaFreeDiagnosis .diagnose ul.qaFlowchartList,
        #main #qaSize .diagnose ul.qaFlowchartList,
        #main #qaFlowchart .diagnose ul.qaFlowchartList,
        #main #qaRemake .diagnose ul.qaFlowchartList {
          margin-bottom: 8em; } }
      @media screen and (min-width: 480px) {
        #main #qaFreeDiagnosis .diagnose ul.qaFlowchartList li,
        #main #qaSize .diagnose ul.qaFlowchartList li,
        #main #qaFlowchart .diagnose ul.qaFlowchartList li,
        #main #qaRemake .diagnose ul.qaFlowchartList li {
          margin: 1em; } }
      @media screen and (max-width: 480px) {
        #main #qaFreeDiagnosis .diagnose ul.qaFlowchartList li,
        #main #qaSize .diagnose ul.qaFlowchartList li,
        #main #qaFlowchart .diagnose ul.qaFlowchartList li,
        #main #qaRemake .diagnose ul.qaFlowchartList li {
          padding: 1em 0; }
          #main #qaFreeDiagnosis .diagnose ul.qaFlowchartList li:first-child,
          #main #qaSize .diagnose ul.qaFlowchartList li:first-child,
          #main #qaFlowchart .diagnose ul.qaFlowchartList li:first-child,
          #main #qaRemake .diagnose ul.qaFlowchartList li:first-child {
            padding-top: 0; } }
      @media screen and (min-width: 480px) {
        #main #qaFreeDiagnosis .diagnose ul.remakeServiceList,
        #main #qaSize .diagnose ul.remakeServiceList,
        #main #qaFlowchart .diagnose ul.remakeServiceList,
        #main #qaRemake .diagnose ul.remakeServiceList {
          margin: 5em auto 8em;
          display: flex;
          flex-wrap: wrap;
          justify-content: center;
          align-items: center; } }
      @media screen and (min-width: 480px) {
        #main #qaFreeDiagnosis .diagnose ul.remakeServiceList li,
        #main #qaSize .diagnose ul.remakeServiceList li,
        #main #qaFlowchart .diagnose ul.remakeServiceList li,
        #main #qaRemake .diagnose ul.remakeServiceList li {
          width: calc( 95% / 3 ); }
          #main #qaFreeDiagnosis .diagnose ul.remakeServiceList li img,
          #main #qaSize .diagnose ul.remakeServiceList li img,
          #main #qaFlowchart .diagnose ul.remakeServiceList li img,
          #main #qaRemake .diagnose ul.remakeServiceList li img {
            width: 100%; } }
      @media screen and (max-width: 480px) {
        #main #qaFreeDiagnosis .diagnose ul.remakeServiceList li,
        #main #qaSize .diagnose ul.remakeServiceList li,
        #main #qaFlowchart .diagnose ul.remakeServiceList li,
        #main #qaRemake .diagnose ul.remakeServiceList li {
          margin-top: 2em; } }
      #main #qaFreeDiagnosis .diagnose ul.remakeServiceList li .name,
      #main #qaSize .diagnose ul.remakeServiceList li .name,
      #main #qaFlowchart .diagnose ul.remakeServiceList li .name,
      #main #qaRemake .diagnose ul.remakeServiceList li .name {
        font-size: 1.5em;
        font-weight: bold;
        margin-top: .5em; }
      #main #qaFreeDiagnosis .diagnose ul.remakeServiceList li .price,
      #main #qaSize .diagnose ul.remakeServiceList li .price,
      #main #qaFlowchart .diagnose ul.remakeServiceList li .price,
      #main #qaRemake .diagnose ul.remakeServiceList li .price {
        font-size: 1.2em;
        font-weight: bold; }
        #main #qaFreeDiagnosis .diagnose ul.remakeServiceList li .price span,
        #main #qaSize .diagnose ul.remakeServiceList li .price span,
        #main #qaFlowchart .diagnose ul.remakeServiceList li .price span,
        #main #qaRemake .diagnose ul.remakeServiceList li .price span {
          font-size: 1rem; }
  #main #course {
    text-align: center;
    margin-top: 10em; }
    @media screen and (max-width: 480px) {
      #main #course {
        margin-top: 5em;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-evenly; } }
    #main #course .inner {
      background: #fff url("../images/bg_stripe.png") top repeat-x;
      padding: 10em 0 5em; }
      @media screen and (max-width: 480px) {
        #main #course .inner {
          padding: 6em 0 2em; } }
    #main #course .wrap {
      width: 1000px;
      margin: 0 auto; }
      @media screen and (max-width: 480px) {
        #main #course .wrap {
          width: 90%; } }
    #main #course ul,
    #main #course li {
      list-style: none; }
    @media screen and (min-width: 480px) {
      #main #course ul {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between; } }
    #main #course ul li {
      margin-top: 3em; }
      @media screen and (max-width: 480px) {
        #main #course ul li {
          margin-top: 0;
          padding: 3em 0;
          border-top: 1px solid #f2f2f2; }
          #main #course ul li:first-child {
            margin-top: 3em;
            padding-top: 0;
            border-top: 0; } }
    @media screen and (min-width: 480px) {
      #main #course ul .course {
        height: 325px; } }
    #main #course ul .arrow {
      margin: 3em 0 1em; }
    #main #course ul .btn {
      font-family: Rounded Mplus\ 1c;
      font-size: 1.2em;
      margin-top: 1.5em; }
      @media screen and (max-width: 480px) {
        #main #course ul .btn {
          font-size: 1.2em; } }
      #main #course ul .btn a {
        color: #003686;
        font-weight: bold;
        text-decoration: none;
        background: #fff;
        width: 100%;
        padding: .5em 0;
        margin: 0 auto;
        border: 3px solid #003686;
        border-radius: .5rem;
        box-shadow: 0px 5px 0 #003686;
        transition: .3s;
        display: block; }
        #main #course ul .btn a::after {
          font-family: "Font Awesome 5 Free";
          content: "\f105";
          margin-left: .2em; }
        #main #course ul .btn a:hover {
          transform: translate3d(0, 5px, 0);
          box-shadow: none; }
    #main #course .btn {
      font-family: Rounded Mplus\ 1c;
      font-size: 2em;
      margin-top: 3em; }
      @media screen and (max-width: 480px) {
        #main #course .btn {
          font-size: 1.5em;
          line-height: 1.4;
          margin-top: 0; } }
      #main #course .btn a {
        color: #fff;
        text-decoration: none;
        background: #335e9e;
        width: 20em;
        padding: .5em 0;
        margin: 0 auto;
        border: 1px solid #335e9e;
        border-radius: .5rem;
        box-shadow: 0px 5px 0 #003686;
        transition: .3s;
        display: block;
        overflow: hidden;
        position: relative; }
        @media screen and (max-width: 480px) {
          #main #course .btn a {
            width: 100%; } }
        #main #course .btn a::before {
          position: absolute;
          top: 0;
          right: -133%;
          content: '';
          width: 130%;
          height: 100%;
          background: #fff;
          z-index: 1;
          transform: skewX(-45deg); }
        #main #course .btn a:hover {
          transform: translate3d(0, 5px, 0);
          box-shadow: none; }
  #main #diagnose-btn {
    color: #00947d;
    font-family: Rounded Mplus\ 1c;
    font-weight: bold;
    font-size: 2em;
    text-align: center; }
    @media screen and (max-width: 480px) {
      #main #diagnose-btn {
        font-size: 1.2em; } }
    #main #diagnose-btn .btn {
      margin-top: 1.5em; }
      #main #diagnose-btn .btn a {
        color: #fff;
        text-decoration: none;
        background: #335e9e;
        width: 15em;
        padding: .5em 0;
        margin: 0 auto;
        border: 1px solid #335e9e;
        border-radius: .5rem;
        box-shadow: 0px 5px 0 #003686;
        transition: .3s;
        display: block;
        overflow: hidden;
        position: relative; }
        #main #diagnose-btn .btn a::before {
          position: absolute;
          top: 0;
          right: -133%;
          content: '';
          width: 130%;
          height: 100%;
          background: #fff;
          z-index: 1;
          transform: skewX(-45deg); }
        #main #diagnose-btn .btn a:hover {
          transform: translate3d(0, 5px, 0);
          box-shadow: none; }
  #main #SDGs {
    text-align: center;
    padding: 10em 0 0; }
    @media screen and (max-width: 480px) {
      #main #SDGs {
        padding: 5em 0 0; } }
    #main #SDGs .inner {
      background: #fff url("../images/bg_stripe.png") top repeat-x;
      padding: 10em 0 5em; }
      @media screen and (max-width: 480px) {
        #main #SDGs .inner {
          padding: 6em 1em 2em; } }
    #main #SDGs .read {
      color: #666;
      font-family: Rounded Mplus\ 1c;
      font-size: 1.5em;
      margin-top: 2em; }
      @media screen and (max-width: 480px) {
        #main #SDGs .read {
          font-size: 1.2em;
          text-align: left; } }
    #main #SDGs .SDGsLogo {
      margin: 3em 0 1.5em; }
    #main #SDGs ul,
    #main #SDGs li {
      list-style: none; }
    @media screen and (min-width: 480px) {
      #main #SDGs ul {
        display: flex;
        flex-wrap: wrap;
        justify-content: center; } }
    @media screen and (min-width: 480px) {
      #main #SDGs ul li {
        margin: 1em; } }
    @media screen and (max-width: 480px) {
      #main #SDGs ul li {
        padding: .5em 0; }
        #main #SDGs ul li:first-child {
          padding-top: 0; } }

/* フッター */
#footer {
  font-size: .8em;
  text-align: center;
  padding: 5rem 0; }

/* --------------------------------------------------

	アニメーション

-------------------------------------------------- */
@keyframes fuwafuwa {
  0% {
    transform: translateY(5px); }
  100% {
    transform: translateY(-5px); } }
/* --------------------------------------------------

	テーブルセット

-------------------------------------------------- */
table {
  color: #000;
  text-align: left;
  background: #FFF;
  width: 100%;
  margin: 2rem auto; }
  table:last-child {
    margin-bottom: 0; }
  table p {
    margin-bottom: 1em !important; }
  table ul,
  table ol {
    margin-left: 1.5em; }
  table th,
  table td {
    padding: .8em 1em; }
  table th {
    font-weight: bold;
    vertical-align: middle;
    white-space: nowrap; }
  table td p:last-child,
  table td li:last-child {
    margin-bottom: 0 !important; }

.aside {
  font-size: small;
  line-height: 1.4em;
  margin: -1.5rem 0 2rem 0 !important; }

@media screen and (max-width: 480px) {
  table tr {
    padding: 0; }
  table th,
  table td {
    padding: .5em;
    display: block;
    border-bottom: none; }
  table th {
    width: 100%;
    box-sizing: border-box; }

  .aside {
    margin: -1.8em 0 3.125em 0; } }