





.kingianum_back {
  margin-top:80px;
  background-color:#FFF0F0;
}


.kingianum_2{
display:flex;
max-width: 1200px;
width:100%;
margin-right: auto;
margin-left: auto;
  }


.kingianum_text{
  background-color:#fff;
  padding:50px;
  margin-left:50px;
  }

.kingianum_hr{
  border-width: 1px 0 0 0;
  border-style: solid;
  border-color: #000;
  }



h2.kingianumtitle_h2{
  letter-spacing: 7px;
  font-size:25px;
  font-weight: 600;
  text-align:center;
  }

.kingianum_text_p{
  margin:0;
  padding-top:20px;
}


h2.kingianumtitle_h2::after {
  content: 'Kingianum';
  text-align: left;
  display: block;
  font-size: 13px;
  color:#898989;
  font-weight: normal;
  letter-spacing: 5px;
  padding-top:10px;
text-align:center;
  }


.kingianum_photo{
  flex:none;
  padding:70px 40px 70px 70px;
  width:500px;
  position: relative;
  }




.img_stack_svgimg{
  position: absolute;
  top: 0;
  left: 0;
  width:250px;
  padding-top:40px;

  }




  /*===============================

    ブレイクポイント　max-width: 768px

  ================================*/


  @media screen and (max-width: 1000px) {

    .kingianum_2{
     display:inline!important;
     }

    .kingianum_photo{
     width:100%!important;
     padding:60px 0px 0px 0px;
     }

    .kingianum_text{
     margin-left:0!important;
     background-color:initial!important;
     text-align: center;
     }

    .kingianum_text_p{
     background-color:#fff;
     max-width:650px;
     display: inline-block;
     text-align: left;
     padding:30px;
     }

     #img_stack{
     text-align: center;
     }

     .img_stack_svgimg{
     padding-left:20px;
     padding-top:30px;
     }

    }



    @media screen and (max-width: 768px) {


    .kingianum_back{
     margin-top: 50px;
     }

    .kingianum_2{
     display:inline!important;
     }

    .kingianum_photo{
     width:100%!important;
     padding:50px 0px 0px 0px;
     }

    .kingianum_text{
     margin-left:0!important;
     background-color:initial!important;
     padding:30px!important;
     }

    }





    /*===============================

      キンギアナム　一覧

    ================================*/


    /* カードレイアウト部分をラッピングし、
  Flexboxを指定"space-between"で各アイテムを均等に配置し、
  最初と最後のアイテムを端に寄せます。*/
  #cardlayout-wrap {
      position: relative;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-pack: justify;
      margin: 2em auto;
      max-width: 1200px;
      width: 100%;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      -webkit-box-pack: justify;
      justify-content: space-between;
  }


  /* カードレイアウト内の画像を幅いっぱいに表示 */
  #cardlayout-wrap img {
      display: block;
      max-width: 100%;
      height: auto;
  }

  .card-figure {
      margin: 0;
      padding: 0;
  }

  /* カードレイアウトのタイトル部分 */
  .card-title {
      margin: 0.6em 0 0;
      color: #000;
      text-align:left;
      font-size:15px;
  }

  /* カードレイアウトの説明文部分 */
  .card-text-tax {
      margin: 0;
      margin-bottom:20px;
      color: #000;
      font-size:13px;
      padding-top:7px;
      line-height: 1.8em;
  }

  /* カードレイアウトを1カラムで配置 */
  .card-list {
      margin: 0.5em auto;
      padding: 0;
      width: calc(95% / 2); /* 96%幅を2で割るという指定 */

  }

  #cardlayout-wrap:after,
#cardlayout-wrap:before{
  content:"";
  display:block;
  width: 14.5%;
  height:0;
}
#cardlayout-wrap:before{
  order:1;
}

  /* 画面幅768px以上の場合カードレイアウトを2カラムで配置 */
  @media all and (min-width: 768px) {
      .card-list {
          margin: 0.5em 0;
          width: calc(95% / 3); /* 96%幅を2で割るという指定 */
      }
  }

  /* 画面幅992px以上の場合カードレイアウトを3カラムで配置 */
  @media all and (min-width: 992px) {
      .card-list {
          width: calc(95% / 4); /* 96%幅を3で割るという指定 */
  }

  /* 最後の行が3列より少ない場合左寄せにレイアウトさせる */
      #cardlayout-wrap::after{
          content: "";
          display: block;
          width: calc(95% / 4);
      }
  }




  .items{
  	display: flex;
  	justify-content: space-between;
  	flex-wrap: wrap;
    margin-top:80px;
    margin-bottom:80px;
  }
  .items:after,
  .items:before{
  	content:"";
  	display:block;
  	width: calc(95% / 4);
  	height:0;
  }
  .items:before{
  	order:1;
  }
  .item{
  	width: calc(95% / 4);
  	margin-bottom: 3%;
  }



  /* 画面幅768px以上の場合カードレイアウトを2カラムで配置 */
  @media all and (max-width: 992px) {
      .item {
          width: calc(95% / 3); /* 96%幅を2で割るという指定 */
      }

      .items:after,
      .items:before{
        width: calc(95% / 3); /* 96%幅を2で割るという指定 */
        }
  }



  /* 画面幅768px以上の場合カードレイアウトを2カラムで配置 */
  @media all and (max-width: 768px) {
      .item {
          width: calc(95% / 2); /* 96%幅を2で割るという指定 */
      }

      .items:after,
      .items:before{
        width: calc(95% / 2); /* 96%幅を2で割るという指定 */
        }
  }
