/*---------------------------------
.cmp
---------------------------------*/
.htype01,
.htype01w {
  color: #003894;
  padding: 0 0 0 0;
  position: relative;
  margin-bottom: 50px;
  z-index: 2;
}
.htype01::before,
.htype01w::before {
  content: "";
  width: 100px;
  height: 63px;
  display: block;
  background: url(/lib/images/greeting/header_bg_01.webp) no-repeat center/contain;
  position: absolute;
  top: calc(50% - 50px);
  top: 50%;
  transform: translateY(-50%);
  right: calc(100% - 2em);
  z-index: -1;
}

.htype01w::before {
  mask: url(/lib/images/greeting/header_bg_01.webp) no-repeat center/contain;
  background: #FFF;
}

.sp {
  display: block;
}

.md {
  display: none;
}

@media screen and (min-width: 768px) {
  .sp {
    display: none;
  }
  .md {
    display: block;
  }
}
/*---------------------------------
.p-page__inner 
---------------------------------*/
.p-page__inner {
  position: relative;
  padding-bottom: 100px;
}
.p-page__inner::before {
  content: "";
  width: 100vw;
  height: 40px;
  position: absolute;
  left: 0;
  bottom: 0;
  background: url(/lib/images/greeting/inner_footer_grass.webp) repeat-x bottom left/auto 100%;
}
.p-page__inner::after {
  content: "";
  width: 156px;
  height: 85px;
  position: absolute;
  right: 10vw;
  bottom: 5px;
  background: url(/lib/images/greeting/footer_caw.webp) no-repeat center/contain;
}
.p-page__inner p {
  line-height: 1.7;
}
.p-page__inner p + p {
  margin-top: 1rem;
}

/*---------------------------------
#profile
---------------------------------*/
#profile {
  display: grid;
  grid-template-columns: 1fr;
  padding-right: 0;
  margin-bottom: 100px;
  align-items: center;
}
@media screen and (min-width: 768px) {
  #profile {
    grid-template-columns: 1fr 1fr;
  }
}
#profile .namebox {
  position: relative;
}
#profile .namebox dl {
  position: absolute;
  top: 32%;
  left: 0;
}
#profile .namebox dl dt {
  font-size: 1.65em;
  font-weight: bold;
  margin-bottom: 5px;
}
#profile .namebox dl dd {
  font-size: 1.85em;
  font-weight: bold;
}
#profile .namebox dl dd span {
  font-size: 0.65em;
  display: block;
}
#profile .profileData {
  padding-right: 1.5625rem;
}
#profile .profileData .htype01 {
  margin-bottom: 20px;
}
#profile .profileData section + section {
  margin-top: 3rem;
}
#profile .profileData dl {
  display: grid;
  grid-template-columns: max-content 1fr;
}
#profile .profileData dl dt, #profile .profileData dl dd {
  padding-bottom: 5px;
  margin-bottom: 5px;
  border-bottom: 1px dashed #000;
}
#profile .profileData dl dt {
  padding-right: 1em;
}
#profile .profileData dl dd.born {
  grid-column: 1/3;
}
#profile .profileData ul li {
  display: grid;
  grid-template-columns: 5px 1fr;
  align-items: center;
  gap: 5px;
}
#profile .profileData ul li + li {
  margin-top: 5px;
}
#profile .profileData ul li::before {
  content: "";
  width: 5px;
  aspect-ratio: 1;
  display: block;
  background: #ED8495;
  border-radius: 50vh;
}
@media screen and (min-width: 768px) {
  #profile {
    gap: 5rem;
  }
  #profile .namebox dl {
    top: auto;
    bottom: 0px;
    left: 50%;
    transform: translateX(-50%);
  }
  #profile .namebox dl dt {
    margin-bottom: 0;
  }
}

/*---------------------------------
#history
---------------------------------*/
#history {
  position: relative;
  background: #C7E9FB;
  text-align: center;
  margin-top: 17.3333333333vw;
  margin-bottom: calc(30.1333333333vw + 50px);
  z-index: 0;
}
#history::before {
  content: "";
  width: 100vw;
  aspect-ratio: 375/65;
  background: url(/lib/images/greeting/history_bg_top_sp.webp) no-repeat bottom/contain;
  display: block;
  position: absolute;
  left: 0;
  bottom: calc(100% - 3px);
}
#history::after {
  content: "";
  width: 100vw;
  aspect-ratio: 375/113;
  background: url(/lib/images/greeting/history_bg_btm_sp.webp) no-repeat bottom/contain;
  display: block;
  position: absolute;
  left: 0;
  top: calc(100% - 3px);
}
#history .historyInner {
  position: relative;
  width: 100vw;
  z-index: 1;
}
#history .historyInner:before {
  content: "";
  position: absolute;
  display: block;
  left: -25%;
  top: 0;
  width: 50%;
  aspect-ratio: 147/95;
  background: url(/lib/images/greeting/history_cloud_sp_01.webp) no-repeat center/contain;
}
#history .historyInner:after {
  content: "";
  position: absolute;
  display: block;
  right: 0;
  top: -30px;
  width: 30%;
  aspect-ratio: 125/75;
  background: url(/lib/images/greeting/history_cloud_sp_02.webp) no-repeat center/contain;
  z-index: 1;
}
#history .historyInner > * {
  position: relative;
  z-index: 3;
}
#history p + p {
  margin-top: 1.5rem;
}
@media screen and (min-width: 768px) {
  #history {
    margin-top: calc(7.0833333333vw + 100px);
    margin-bottom: calc(9.0972222222vw + 50px);
  }
  #history::before {
    aspect-ratio: 1440/102;
    background: url(/lib/images/greeting/history_bg_top_pc.webp) no-repeat bottom/contain;
  }
  #history::after {
    content: "";
    aspect-ratio: 1440/131;
    background: url(/lib/images/greeting/history_bg_btm_pc.webp) no-repeat bottom/contain;
  }
  #history .historyInner:before {
    content: "";
    left: 15vw;
    top: -10.625vw;
    width: 70vw;
    aspect-ratio: 908/197;
    background: url(/lib/images/greeting/history_cloud_pc_01.webp) no-repeat center/contain;
  }
  #history .historyInner:after {
    right: auto;
    top: auto;
    bottom: -9.0972222222vw;
    left: 5vw;
    width: 90vw;
    aspect-ratio: 2678/605;
    background: url(/lib/images/greeting/history_cloud_pc_02.webp) no-repeat center/contain;
    z-index: 1;
  }
}
#history hgroup {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}
#history hgroup h2 {
  color: #003894;
  font-size: 1.8em;
}
#history hgroup::after {
  content: "";
  width: 103px;
  aspect-ratio: 103/70;
  display: block;
  margin: 0 auto;
  background: url(/lib/images/greeting/history_01.webp) no-repeat center/contain;
}
#history .lead {
  font-weight: bold;
  font-size: 1.25em;
}
@media screen and (min-width: 768px) {
  #history hgroup {
    display: grid;
    grid-template-columns: max-content 103px;
    margin: 0 auto;
    width: fit-content;
    align-items: center;
    margin-bottom: 20px;
  }
}

/*---------------------------------
#hobby,#weakpoint
---------------------------------*/
#hobby,
#weakpoint {
  margin-bottom: 5rem;
}
#hobby > hgroup,
#weakpoint > hgroup {
  max-width: 830px;
  margin: 0 auto;
}
#hobby .hobbybox,
#weakpoint .hobbybox {
  background: #FFFCCC;
  padding: 20px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 40px;
}
#hobby .hobbybox hgroup,
#weakpoint .hobbybox hgroup {
  padding-bottom: 2px;
  border-bottom: 2px dotted #00B4ED;
  margin-bottom: 10px;
  display: grid;
  grid-template-columns: 46px 1fr;
  gap: 0px;
  align-items: center;
}
#hobby .hobbybox hgroup:before,
#weakpoint .hobbybox hgroup:before {
  content: "";
  width: 46px;
  aspect-ratio: 1;
  display: block;
}
#hobby .hobbybox h3,
#weakpoint .hobbybox h3 {
  font-size: 1.3em;
}
@media screen and (min-width: 768px) {
  #hobby .hobbybox,
  #weakpoint .hobbybox {
    padding: 20px 40px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
  }
}

#hobby .hobbybox hgroup::before {
  background: url(/lib/images/greeting/hobby_01.webp) no-repeat center/contain;
}

#weakpoint .hobbybox hgroup::before {
  width: 38px;
  background: url(/lib/images/greeting/hobby_02.webp) no-repeat center/contain;
}

/*---------------------------------
#logomarkReason
---------------------------------*/
#logomarkReason {
  background: #EEF3F4;
  padding: 50px 0 150px;
  margin: 50px 0;
  position: relative;
}
#logomarkReason::before, #logomarkReason:after {
  content: "";
  width: 100vw;
  height: 38px;
  position: absolute;
}
#logomarkReason::before {
  left: 0;
  bottom: calc(100% - 10px);
  background: url(/lib/images/greeting/logo_bg_top.webp) repeat-x bottom left/auto 101%;
}
#logomarkReason::after {
  left: 0;
  bottom: -3px;
  background: url(/lib/images/greeting/logo_bg_btm.webp) repeat-x bottom left/auto 101%;
}
#logomarkReason .logomarkReasonInner::before {
  content: "";
  width: 80vw;
  aspect-ratio: 1156/678;
  position: absolute;
  right: 0;
  bottom: 15px;
  background: url(/lib/images/greeting/big_caw.webp) no-repeat center/contain;
}
#logomarkReason section {
  position: relative;
  z-index: 2;
  max-width: 830px;
}
@media screen and (min-width: 768px) {
  #logomarkReason {
    padding: 70px 0 100px;
    margin: 50px 0;
  }
  #logomarkReason .logomarkReasonInner::before {
    width: clamp(30px, 40vw, 578px);
  }
}

/*---------------------------------
#yurai #whyToyonaka
---------------------------------*/
#yurai,
#whyToyonaka {
  max-width: 830px;
}
#yurai p,
#whyToyonaka p {
  padding-left: 0;
}

#yurai {
  margin-bottom: 5rem;
}

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