@charset "UTF-8";
/*
* YASMOCCAとは
*/
@media screen and (min-width: 641px) {
  section.cont_read .cont_inner {
    padding-bottom: 50px; } }

@media screen and (max-width: 640px) {
  section.cont_read .cont_inner {
    padding-bottom: 30px; } }

section.cont_read .cont_inner figure {
  padding: 50px 10%;
  margin: 0;
  text-align: center; }
  section.cont_read .cont_inner figure img {
    width: 400px;
    max-width: 100%; }

section.cont_read .cont_inner p.cont_read {
  margin-top: 0;
  line-height: 2; }
  @media screen and (min-width: 641px) {
    section.cont_read .cont_inner p.cont_read {
      text-align: center; } }
  @media screen and (max-width: 640px) {
    section.cont_read .cont_inner p.cont_read br {
      display: none; } }

section.cont_read .cont_inner .cont_about_logo {
  max-width: 560px;
  margin: 40px auto 0 auto;
  padding: 0 5% 1em 5%;
  border-left: 1px solid #aaa;
  border-right: 1px solid #aaa;
  font-size: 0.8rem;
  line-height: 2;
  position: relative; }
  section.cont_read .cont_inner .cont_about_logo:before, section.cont_read .cont_inner .cont_about_logo:after {
    content: "";
    position: absolute;
    left: 0;
    display: block;
    width: 100%;
    height: 1px;
    background: linear-gradient(to right, #aaaaaa 0%, #aaaaaa 3%, #ffffff 3%, #ffffff 3%, #ffffff 97%, #aaaaaa 97%, #aaaaaa 97%, #aaaaaa 100%); }
  section.cont_read .cont_inner .cont_about_logo:before {
    top: 0; }
  section.cont_read .cont_inner .cont_about_logo:after {
    bottom: 0; }
  section.cont_read .cont_inner .cont_about_logo h3 {
    margin-top: 0;
    text-align: center; }

/*
* YASMOCCAについて
*/
@media screen and (min-width: 641px) {
  section.cont_yasmocca {
    padding: 70px 0;
    background: linear-gradient(to bottom, #e5f7db 0%, #e5f7db 182px, #ffffff 182px, #ffffff 100%); } }

@media screen and (max-width: 640px) {
  section.cont_yasmocca {
    padding: 50px 0;
    background: linear-gradient(to bottom, #e5f7db 0%, #e5f7db 270px, #ffffff 270px, #ffffff 100%); } }

section.cont_yasmocca .cont_inner > div {
  font-size: 86%; }
  section.cont_yasmocca .cont_inner > div:first-child {
    margin-top: 0; }
  @media screen and (min-width: 641px) {
    section.cont_yasmocca .cont_inner > div {
      margin-top: 70px; } }
  @media screen and (max-width: 640px) {
    section.cont_yasmocca .cont_inner > div {
      margin-top: 50px; } }
  @media screen and (min-width: 641px) {
    section.cont_yasmocca .cont_inner > div.cont_01 figure {
      width: 55%;
      float: left; } }
  @media screen and (max-width: 640px) {
    section.cont_yasmocca .cont_inner > div.cont_01 figure {
      text-align: center; } }
  @media screen and (min-width: 641px) {
    section.cont_yasmocca .cont_inner > div.cont_01 .cont_txt {
      float: right;
      width: 40%;
      max-width: 325px; } }
  @media screen and (max-width: 640px) {
    section.cont_yasmocca .cont_inner > div.cont_01 .cont_txt {
      float: right;
      text-align: right;
      margin-top: 15px;
      width: 76%; } }
  @media screen and (min-width: 641px) {
    section.cont_yasmocca .cont_inner > div.cont_02 {
      display: flex;
      margin-left: 3%; } }
  @media screen and (max-width: 640px) {
    section.cont_yasmocca .cont_inner > div.cont_02 {
      position: relative; } }
  section.cont_yasmocca .cont_inner > div.cont_02 .cont_ttl {
    transform: translateY(-5%); }
    @media screen and (min-width: 641px) {
      section.cont_yasmocca .cont_inner > div.cont_02 .cont_ttl {
        width: 10%; } }
    @media screen and (max-width: 640px) {
      section.cont_yasmocca .cont_inner > div.cont_02 .cont_ttl {
        width: 19%;
        float: left; } }
  @media screen and (min-width: 641px) {
    section.cont_yasmocca .cont_inner > div.cont_02 p {
      width: 35%;
      margin: 0;
      box-sizing: border-box;
      padding-left: 2%;
      padding-right: 10px;
      display: flex;
      align-items: flex-end; } }
  @media screen and (max-width: 640px) {
    section.cont_yasmocca .cont_inner > div.cont_02 p {
      width: 76%;
      float: right; }
      section.cont_yasmocca .cont_inner > div.cont_02 p:before {
        content: "";
        width: 100%;
        height: 0;
        display: block;
        padding-top: 50%; } }
  @media screen and (min-width: 641px) {
    section.cont_yasmocca .cont_inner > div.cont_02 figure {
      width: 55%; } }
  @media screen and (max-width: 640px) {
    section.cont_yasmocca .cont_inner > div.cont_02 figure {
      position: absolute;
      width: 76%;
      right: 0;
      top: 0; } }
  @media screen and (min-width: 641px) {
    section.cont_yasmocca .cont_inner > div.cont_03 .cont_wrap {
      display: flex;
      margin-left: 4%;
      margin-right: 2%; } }
  @media screen and (max-width: 640px) {
    section.cont_yasmocca .cont_inner > div.cont_03 .cont_wrap {
      position: relative; } }
  section.cont_yasmocca .cont_inner > div.cont_03 .cont_wrap .cont_ttl {
    transform: translateY(-5%); }
    @media screen and (min-width: 641px) {
      section.cont_yasmocca .cont_inner > div.cont_03 .cont_wrap .cont_ttl {
        width: 12%;
        text-align: right; } }
    @media screen and (max-width: 640px) {
      section.cont_yasmocca .cont_inner > div.cont_03 .cont_wrap .cont_ttl {
        width: 19%;
        float: right;
        position: relative;
        top: 0; } }
  @media screen and (min-width: 641px) {
    section.cont_yasmocca .cont_inner > div.cont_03 .cont_wrap figure {
      width: 47%; } }
  @media screen and (max-width: 640px) {
    section.cont_yasmocca .cont_inner > div.cont_03 .cont_wrap figure {
      width: 76%;
      position: absolute;
      top: 0;
      left: 0; } }
  @media screen and (min-width: 641px) {
    section.cont_yasmocca .cont_inner > div.cont_03 .cont_wrap p {
      width: 41%;
      padding: 0 15px;
      margin: 0; } }
  @media screen and (max-width: 640px) {
    section.cont_yasmocca .cont_inner > div.cont_03 .cont_wrap p {
      width: 76%;
      float: left; }
      section.cont_yasmocca .cont_inner > div.cont_03 .cont_wrap p:before {
        content: "";
        display: block;
        width: 100%;
        height: 1px;
        padding-top: 66%; } }
  section.cont_yasmocca .cont_inner > div.cont_03 .cont_subwrap {
    max-width: 500px;
    display: flex;
    align-items: center; }
    @media screen and (min-width: 641px) {
      section.cont_yasmocca .cont_inner > div.cont_03 .cont_subwrap {
        transform: translateY(-10px); } }
    @media screen and (max-width: 640px) {
      section.cont_yasmocca .cont_inner > div.cont_03 .cont_subwrap {
        flex-direction: row-reverse;
        margin-top: 15px; } }
    @media screen and (min-width: 641px) {
      section.cont_yasmocca .cont_inner > div.cont_03 .cont_subwrap figure {
        max-width: 172px; } }
    @media screen and (max-width: 640px) {
      section.cont_yasmocca .cont_inner > div.cont_03 .cont_subwrap figure {
        width: 30%; } }
    section.cont_yasmocca .cont_inner > div.cont_03 .cont_subwrap p {
      margin: 0;
      box-sizing: border-box; }
      @media screen and (min-width: 641px) {
        section.cont_yasmocca .cont_inner > div.cont_03 .cont_subwrap p {
          padding-left: 10px;
          width: calc(100% - 172px); } }
      @media screen and (max-width: 640px) {
        section.cont_yasmocca .cont_inner > div.cont_03 .cont_subwrap p {
          padding-right: 10px;
          width: 70%; } }
  section.cont_yasmocca .cont_inner > div.cont_04 {
    position: relative; }
    @media screen and (min-width: 641px) {
      section.cont_yasmocca .cont_inner > div.cont_04 {
        margin-left: 5%; } }
    section.cont_yasmocca .cont_inner > div.cont_04 .cont_wrap {
      /*.cont_ttl{
                        @include pc(){
                            width:92%;
                        }
                    }*/ }
      @media screen and (min-width: 641px) {
        section.cont_yasmocca .cont_inner > div.cont_04 .cont_wrap {
          width: 46%;
          float: left;
          box-sizing: border-box;
          padding-right: 10px; } }
      @media screen and (max-width: 640px) {
        section.cont_yasmocca .cont_inner > div.cont_04 .cont_wrap .cont_ttl {
          width: 83%; } }
    @media screen and (min-width: 641px) {
      section.cont_yasmocca .cont_inner > div.cont_04 figure {
        width: 54%;
        float: right; } }
    @media screen and (max-width: 640px) {
      section.cont_yasmocca .cont_inner > div.cont_04 figure {
        margin-top: 15px; } }