@charset "UTF-8";
/*==================================================

** about
==================================================*/
#aboutSec .aboutsec {
  max-width: 1360px;
  margin: 64px auto 0;
  counter-increment: aboutsec; }
  #aboutSec .aboutsec-count {
    counter-reset: aboutsec; }
  #aboutSec .aboutsec .phtbox {
    width: 50%; }
    #aboutSec .aboutsec .phtbox .pht {
      width: 100%;
      height: 383px; }
      #aboutSec .aboutsec .phtbox .pht img {
        width: 100%;
        height: 100%;
        object-fit: cover; }
  #aboutSec .aboutsec .txtbox {
    width: 55.88%;
    position: relative;
    z-index: 1; }
    #aboutSec .aboutsec .txtbox .box {
      margin-top: 72px;
      width: 640px;
      background: #fff;
      padding: 64px;
      position: relative; }
      #aboutSec .aboutsec .txtbox .box > :first-child {
        margin-top: 0; }
      #aboutSec .aboutsec .txtbox .box::before {
        content: counter(aboutsec,decimal-leading-zero);
        font: normal normal 700 6.4rem/1.6 "Lato", "Noto Sans JP", "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, Verdana, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, Osaka, "MS PGothic", "M+ 1p", sans-serif;
        color: #828f98;
        position: absolute;
        left: 64px;
        top: -56px; }
    #aboutSec .aboutsec .txtbox .ttl h3 {
      margin: 0; }
    #aboutSec .aboutsec .txtbox .ttl .tags {
      margin-top: 12px; }
      #aboutSec .aboutsec .txtbox .ttl .tags .tag {
        display: block;
        background: linear-gradient(to right, #ee8ab5 0, #7496e0 100%);
        padding: 6px 12px;
        color: #fff; }
    #aboutSec .aboutsec .txtbox .ttl + * {
      margin-top: 40px; }
    #aboutSec .aboutsec .txtbox .link-btn {
      margin-top: 32px; }
      #aboutSec .aboutsec .txtbox .link-btn a {
        margin: 0; }
  #aboutSec .aboutsec.ptn1 .txtbox {
    margin-left: -80px; }
    #aboutSec .aboutsec.ptn1 .txtbox .box {
      margin-right: auto; }
  #aboutSec .aboutsec.ptn2 .txtbox {
    margin-right: -80px; }
    #aboutSec .aboutsec.ptn2 .txtbox .box {
      margin-left: auto; }

@media screen and (max-width: 600px) {
  #aboutSec .aboutsec {
    max-width: 100%; }
    #aboutSec .aboutsec + .aboutsec {
      margin-top: 40px; }
    #aboutSec .aboutsec .phtbox {
      width: 100%; }
      #aboutSec .aboutsec .phtbox .pht {
        height: auto; }
    #aboutSec .aboutsec .txtbox {
      width: 90%;
      margin: -45px auto 0; }
      #aboutSec .aboutsec .txtbox .box {
        margin-top: 0;
        width: 100%;
        padding: 50px 5.5% 40px; }
        #aboutSec .aboutsec .txtbox .box::before {
          font-size: 4.8rem;
          left: 7.2%;
          top: -32px; }
    #aboutSec .aboutsec.ptn1 .txtbox, #aboutSec .aboutsec.ptn2 .txtbox {
      margin: -45px auto 0; } }