@charset "UTF-8";
/* 各ページごとの設定 */
/*
@mixin pc_top_gradient{
	background-image: -webkit-linear-gradient( 0deg, rgba($top_bgcolor, 0.3),rgba($top_bgcolor, 0.3)), url(../images/top/mainv_bg.jpg);
	background-image: -ms-linear-gradient( 0deg, rgba($top_bgcolor, 0.3),rgba($top_bgcolor, 0.3)), url(../images/top/mainv_bg.jpg);
	background-size: auto auto, cover;
	background-position: left top, center, center;
}
@mixin sp_top_gradient{
	background-image: -webkit-linear-gradient( 0deg, rgba($top_bgcolor, 0.3),rgba($top_bgcolor, 0.3)), url(../images/top/mainv_bg.jpg);
	background-image: -ms-linear-gradient( 0deg, rgba($top_bgcolor, 0.3),rgba($top_bgcolor, 0.3)), url(../images/top/mainv_bg.jpg);
	background-size: auto auto, auto 100%;
	background-position: left top, center, center;
}
*/
/*------------------------------------------
共通
-------------------------------------------*/
/*PC
-----------------------------------------------------------------------------*/
@media print, screen and (min-width: 751px) {
  .inner {
    width: 1000px; }

  #mainv {
    background: #EEF3F7; }
    #mainv .inner {
      background-image: linear-gradient(90deg, #EEF3F7, #EEF3F7 30%, rgba(238, 243, 247, 0) 45%, rgba(238, 243, 247, 0) 85%, #EEF3F7 93%, #EEF3F7), url(../images/guide/mainv_bg.jpg);
      background-size: auto auto, auto 100%;
      background-position: left top, right -100px bottom; }
      #mainv .inner h1 {
        color: #333;
        padding: 110px 0 130px; }
        #mainv .inner h1 span {
          font-size: 36px; }

  #mainColmun h3 {
    color: #507645;
    font-size: 24px;
    font-weight: bold;
    margin: 0 0 70px; }
  #mainColmun .contBlock {
    margin: 0 0 80px; }
    #mainColmun .contBlock .box {
      -webkit-justify-content: space-between;
      justify-content: space-between;
      -webkit-flex-direction: row-reverse;
      flex-direction: row-reverse; }
      #mainColmun .contBlock .box p {
        width: 425px; }
      #mainColmun .contBlock .box figure {
        width: 250px; }
    #mainColmun .contBlock ol {
      counter-reset: item; }
      #mainColmun .contBlock ol li {
        -webkit-justify-content: space-between;
        justify-content: space-between;
        -webkit-flex-direction: row-reverse;
        flex-direction: row-reverse;
        border: 1px solid #CCC;
        border-radius: 10px;
        margin: 0 0 30px;
        padding: 30px; }
        #mainColmun .contBlock ol li p {
          width: 300px;
          padding: 4em 0 0;
          position: relative; }
          #mainColmun .contBlock ol li p::before {
            counter-increment: item;
            content: "STEP." counter(item);
            color: #3b3b3b;
            font-weight: bold;
            background: #F6E58A;
            border-radius: 4em;
            padding: 0.5em 30px;
            position: absolute;
            top: 0;
            left: 0; }
        #mainColmun .contBlock ol li figure {
          width: 250px; }
  #mainColmun .pageLinkBox .onImg p {
    text-shadow: 1px 1px 1px black, 1px 1px 1px black; }
  #mainColmun .btn a {
    color: #FFF;
    text-align: center;
    background: #91B964;
    border-radius: 10px;
    padding: 30px 0;
    position: relative;
    display: block; }
    #mainColmun .btn a:hover {
      opacity: 0.8; }
    #mainColmun .btn a::after {
      content: "\f105";
      font-family: FontAwesome;
      font-size: 40px;
      font-weight: normal;
      position: absolute;
      right: 1.5em;
      top: 50%;
      -ms-transform: translateY(-50%);
      -webkit-transform: translateY(-50%);
      transform: translateY(-50%); }
    #mainColmun .btn a span {
      font-size: 2.5em;
      font-weight: bold; }

  /*--------------------------endPC--------------------------------*/ }
/*SP
-----------------------------------------------------------------------------*/
@media screen and (max-width: 750px) {
  .inner {
    width: 94vw;
    margin: 0 auto; }

  #mainv {
    background: #EEF3F7; }
    #mainv .inner {
      background-image: linear-gradient(90deg, #EEF3F7, #EEF3F7 20%, rgba(238, 243, 247, 0) 36%, rgba(238, 243, 247, 0)), url(../images/guide/mainv_bg.jpg);
      background-size: auto auto, auto 100%;
      background-position: left top, right 78% bottom; }

  #mainColmun h3 {
    color: #507645;
    font-size: 16px;
    font-weight: bold;
    margin: 0 0 13.3vw; }
  #mainColmun .contBlock {
    margin: 0 0 16vw; }
    #mainColmun .contBlock .box {
      display: block; }
      #mainColmun .contBlock .box p {
        font-size: 13px;
        padding: 0 1em; }
      #mainColmun .contBlock .box figure {
        margin: 0 0 6vw; }
    #mainColmun .contBlock ol {
      counter-reset: item; }
      #mainColmun .contBlock ol li {
        border: 1px solid #CCC;
        border-radius: 10px;
        margin: 0 0 8vw;
        padding: 5vw 5vw 6vw;
        display: block;
        position: relative; }
        #mainColmun .contBlock ol li::before {
          counter-increment: item;
          content: "STEP." counter(item);
          color: #3b3b3b;
          font-weight: bold;
          background: #F6E58A;
          border-radius: 4em;
          margin: 5vw 0 0;
          padding: 0.5em 9vw;
          position: absolute;
          top: 0;
          left: 50%;
          -ms-transform: translateX(-50%);
          -webkit-transform: translateX(-50%);
          transform: translateX(-50%); }
        #mainColmun .contBlock ol li p {
          font-size: 13px; }
        #mainColmun .contBlock ol li figure {
          margin: 0 0 5vw;
          padding: 15vw 0 0; }
  #mainColmun .pageLinkBox .onImg p {
    text-shadow: 1px 1px 1px black, 1px 1px 1px black; }
  #mainColmun .btn a {
    color: #FFF;
    text-align: center;
    background: #91B964;
    border-radius: 10px;
    padding: 9vw 0;
    position: relative;
    display: block; }
    #mainColmun .btn a:hover {
      opacity: 0.8; }
    #mainColmun .btn a::after {
      content: "\f105";
      font-family: FontAwesome;
      font-size: 2em;
      font-weight: normal;
      position: absolute;
      right: 1.5em;
      top: 50%;
      -ms-transform: translateY(-50%);
      -webkit-transform: translateY(-50%);
      transform: translateY(-50%); }
    #mainColmun .btn a span {
      font-size: 2.5em;
      font-weight: bold; }

  /*--------------------------endSP--------------------------------*/ }

/*# sourceMappingURL=guide.css.map */
