@charset "UTF-8";
/*------------------------------------------------------------
	BASE
------------------------------------------------------------*/
/*------------------------------------------------------------
	COLOR
------------------------------------------------------------*/
/*------------------------------------------------------------
	FONT
------------------------------------------------------------*/
/*------------------------------------------------------------
	FUNCTION
------------------------------------------------------------*/
/*------------------------------------------------------------
	MIXIN
------------------------------------------------------------*/
.page.cosme_links {
  /*------------------------------------------------------------
  	COMMON
  ------------------------------------------------------------*/
  /*------------------------------------------------------------
  	PAGE
  ------------------------------------------------------------*/
}
.page.cosme_links .-hover {
  transition: all 0.5s cubic-bezier(0.21, 0.51, 0.51, 1);
}
.page.cosme_links .-hover:hover {
  opacity: 0.5;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .only_pc {
    display: none;
  }
}
.page.cosme_links .only_sp {
  display: none;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .only_sp {
    display: block;
  }
}
.page.cosme_links .problems {
  text-align: center;
}
.page.cosme_links .problems h3 {
  position: relative;
  display: inline-block;
  padding: 0 1.5625vw;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .problems h3 {
    padding: 0 6.6666666667vw;
  }
}
.page.cosme_links .problems h3:before, .page.cosme_links .problems h3:after {
  content: "";
  display: none;
  position: absolute;
  top: 50%;
  width: 0.15625vw;
  height: 2.0833333333vw;
  background: #E3007E;
  transform: translateY(-50%);
}
@media screen and (max-width: 767px) {
  .page.cosme_links .problems h3:before, .page.cosme_links .problems h3:after {
    width: 0.8vw;
    height: 100%;
  }
}
.page.cosme_links .problems h3:before {
  left: 0;
}
.page.cosme_links .problems h3:after {
  right: 0;
}
.page.cosme_links .problems h3.-marketing:before, .page.cosme_links .problems h3.-marketing:after, .page.cosme_links .problems h3.-reqruit:before, .page.cosme_links .problems h3.-reqruit:after {
  display: block;
}
.page.cosme_links .problems h3.-marketing:before, .page.cosme_links .problems h3.-marketing:after {
  background: #E3007E;
}
.page.cosme_links .problems h3.-reqruit:before, .page.cosme_links .problems h3.-reqruit:after {
  background: #65402C;
}
.page.cosme_links .problems .problems_list {
  display: flex;
  flex-wrap: wrap;
  margin: 0.5208333333vw auto 0;
  padding-left: 0;
  max-width: 1000px;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .problems .problems_list {
    max-width: 100%;
  }
}
.page.cosme_links .problems .problems_list.-marketing li dl dt {
  color: #E3007E;
}
.page.cosme_links .problems .problems_list.-reqruit li dl dt {
  color: #E3007E;
}
.page.cosme_links .problems .problems_list li {
  list-style: none;
  margin: 0 0 0 20px;
  padding: 30px 25px;
  width: 320px;
  border: 1px solid #000;
  border-radius: 15px;
  background: #fff;
  text-align: left;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .problems .problems_list li {
    margin: 2% 0 0 2%;
    padding: 10px 10px;
    width: 49%;
  }
}
.page.cosme_links .problems .problems_list li:nth-child(3n+1) {
  margin-left: 0;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .problems .problems_list li:nth-child(3n+1) {
    margin-left: 2%;
  }
}
@media screen and (max-width: 767px) {
  .page.cosme_links .problems .problems_list li:nth-child(2n+1) {
    margin-left: 0;
  }
}
.page.cosme_links .problems .problems_list li:nth-child(n+4) {
  margin-top: 1.0416666667vw;
}
.page.cosme_links .problems .problems_list li dl dt {
  min-height: 5rem;
  font-size: 20px;
  line-height: 1.4;
  letter-spacing: 0.1em;
  color: #E3007E;
  font-family: var(--font-serif);
}
@media screen and (max-width: 767px) {
  .page.cosme_links .problems .problems_list li dl dt {
    min-height: 4.5rem;
    font-size: 3.2vw;
    letter-spacing: 0.2rem;
  }
}
.page.cosme_links .problems .problems_list li dl dd {
  padding: 1.0416666667vw 0 0;
  font-size: 16px;
  line-height: 1.875;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .problems .problems_list li dl dd {
    padding: 1.3333333333vw 0 0;
    font-size: 2.6666666667vw;
    letter-spacing: 0.2rem;
  }
}
.page.cosme_links .problems .problems_list + h3 {
  margin-top: 8.3333333333vw;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .problems .problems_list + h3 {
    margin-top: 10.6666666667vw;
  }
}
.page.cosme_links .about h2 span {
  display: inline-block;
  padding: 0 10px;
  background: #E3007E;
  color: #fff;
}
.page.cosme_links .about h3 span {
  display: block;
  font-family: var(--font-din);
  font-size: 2rem;
  letter-spacing: 0.2em;
  color: var(--color-pink);
  line-height: 1;
  margin-bottom: 16px;
}
.page.cosme_links .about .inner {
  padding: 80px 100px;
  background: #fff;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .about .inner {
    padding: 40px 20px;
  }
}
.page.cosme_links .about_list {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: stretch;
  margin: 0 auto;
  padding-left: 0;
  max-width: 640px;
}
.page.cosme_links .about_list li {
  list-style: none;
  margin-left: 20px;
  margin-bottom: 0;
  padding: 15px 15px;
  width: 200px;
  font-size: 16px;
  line-height: 1.4;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .about_list li {
    margin-top: 2%;
    margin-left: 1.5%;
    padding: 2vw 0 2vw;
    width: 32%;
    min-height: 26.6666666667vw;
    font-size: 3.0666666667vw;
  }
}
.page.cosme_links .about_list li:nth-child(3n+1) {
  margin-left: 0;
}
.page.cosme_links .about_list li:nth-child(n+4) {
  margin-top: 1.0416666667vw;
}
.page.cosme_links .about_list li dl dt span {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 5rem;
}
.page.cosme_links .about_list li dl dd figure {
  display: block;
  padding-top: 0.5208333333vw;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .about_list li dl dd figure {
    padding-top: 1.3333333333vw;
  }
}
.page.cosme_links .about_list li dl dd figure img {
  width: 80px;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .about_list li dl dd figure img {
    width: 13.6666666667vw;
  }
}
.page.cosme_links .about_list.-marketing li {
  border: 1px solid #E3007E;
  border-radius: 15px;
}
.page.cosme_links .about_list.-reqruit li {
  border: 1px solid #65402C;
  border-radius: 15px;
}
.page.cosme_links .feature_detail {
  margin-left: auto;
  margin-right: auto;
  width: 824px;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .feature_detail {
    width: 100%;
  }
}
.page.cosme_links .feature_detail h3 {
  text-align: left;
}
.page.cosme_links .feature_detail h3 span {
  display: block;
  font-size: 1.6rem;
  color: #E3007E;
}
.page.cosme_links .feature_detail.-feature2 .img1 img {
  width: 32.9166666667vw;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .feature_detail.-feature2 .img1 img {
    width: 100%;
  }
}
.page.cosme_links .feature_detail.-feature2 figure + figure {
  margin-top: 30px;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .feature_detail.-feature2 figure + figure {
    margin-top: 20px;
  }
}
.page.cosme_links .feature_detail.-feature3 {
  margin-top: 5.7291666667vw;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .feature_detail.-feature3 {
    margin-top: 8vw;
  }
}
.page.cosme_links .feature_detail.-feature3 ul {
  display: flex;
  justify-content: space-between;
  margin-top: 3.125vw;
  padding-left: 0;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .feature_detail.-feature3 ul {
    display: block;
    margin-top: 5.3333333333vw;
  }
}
.page.cosme_links .feature_detail.-feature3 ul li {
  list-style: none;
  margin-bottom: 0;
  width: 48%;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .feature_detail.-feature3 ul li {
    width: 100%;
  }
}
.page.cosme_links .feature_detail.-feature3 ul li:first-child {
  border: 2px solid #EC8800;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .feature_detail.-feature3 ul li:first-child {
    border: 0.6666666667vw solid #EC8800;
  }
}
.page.cosme_links .feature_detail.-feature3 ul li:first-child dl dt {
  background: #EC8800;
}
.page.cosme_links .feature_detail.-feature3 ul li:last-child {
  border: 2px solid #A63278;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .feature_detail.-feature3 ul li:last-child {
    margin-top: 3.3333333333vw;
    border: 0.6666666667vw solid #A63278;
  }
}
.page.cosme_links .feature_detail.-feature3 ul li:last-child dl dt {
  background: #A63278;
}
.page.cosme_links .feature_detail.-feature3 ul li dl dt {
  display: flex;
  align-items: center;
  padding: 0.5208333333vw 1.0416666667vw;
  min-height: 7rem;
  font-family: var(--font-serif);
  font-size: 20px;
  line-height: 1.4;
  letter-spacing: 0.05rem;
  color: #fff;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .feature_detail.-feature3 ul li dl dt {
    padding: 2.6666666667vw 2.6666666667vw;
    min-height: 0vw;
    font-size: 3.4666666667vw;
  }
}
.page.cosme_links .feature_detail.-feature3 ul li dl dd figure {
  padding: 0;
}
.page.cosme_links .feature_detail.-feature3 ul li dl dd p {
  padding: 0.78125vw 1.0416666667vw;
  font-size: 1.0416666667vw;
  line-height: 2;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .feature_detail.-feature3 ul li dl dd p {
    padding: 2vw 4vw;
    font-size: 2.9333333333vw;
  }
}
.page.cosme_links .reason .inner {
  padding: 80px 0 30px;
  background: #fff;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .reason .inner {
    padding: 40px 20px;
  }
}
@media screen and (max-width: 767px) {
  .page.cosme_links .reason .inner .numList {
    margin-bottom: 0;
  }
}
.page.cosme_links .reason .inner .numList__item {
  position: relative;
  padding-top: 25px;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .reason .inner .numList__item {
    padding-top: 65px;
    padding-left: 40px;
  }
}
.page.cosme_links .reason .inner .numList__item:before {
  transform: translateY(-13px);
}
@media screen and (max-width: 767px) {
  .page.cosme_links .reason .inner .numList__item:before {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translate(0, -50%);
  }
}
.page.cosme_links .reason .inner .numList__item span {
  width: 100%;
  position: absolute;
  top: 0;
  left: 64px;
  font-size: 16px;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .reason .inner .numList__item span {
    top: 10px;
    left: 40px;
  }
}
@media screen and (max-width: 767px) {
  .page.cosme_links .case_study .kakomi .kakomi__inner {
    width: 100%;
  }
}
.page.cosme_links .case_study .swiper {
  width: 1000px;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .case_study .swiper {
    margin: 0 auto;
    width: 100%;
  }
}
.page.cosme_links .case_study .swiper .swiper-slide {
  height: auto;
}
.page.cosme_links .case_study .swiper.-no_swiper .case_list {
  justify-content: center;
}
.page.cosme_links .case_study .swiper.-no_swiper .case_list_item {
  margin-left: 1.5625vw;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .case_study .swiper.-no_swiper .case_list_item {
    margin-left: 2.6666666667vw;
  }
}
.page.cosme_links .case_study .swiper.-no_swiper .case_list_item:first-child {
  margin-left: 0;
}
.page.cosme_links .case_study .case_list {
  display: flex;
  align-items: stretch;
  margin: 3.125vw auto 0;
  padding-left: 0;
  max-width: 1000px;
  width: 1000px;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .case_study .case_list {
    margin: 8vw 0 0;
    max-width: 100%;
    width: 100%;
  }
}
.page.cosme_links .case_study .case_list_wrap {
  position: relative;
  margin: 0 auto;
  max-width: 1000px;
  width: 1000px;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .case_study .case_list_wrap {
    max-width: 100%;
    width: 100%;
  }
}
.page.cosme_links .case_study .case_list_wrap .swiper-pagination {
  bottom: -30px;
}
.page.cosme_links .case_study .case_list_wrap .swiper-pagination .swiper-pagination-bullet-active {
  background: #E3007E;
}
.page.cosme_links .case_study .case_list_wrap .swiper-button-prev,
.page.cosme_links .case_study .case_list_wrap .swiper-button-next {
  color: #E3007E;
}
.page.cosme_links .case_study .case_list_wrap .swiper-button-prev:after,
.page.cosme_links .case_study .case_list_wrap .swiper-button-next:after {
  font-size: 2em;
}
.page.cosme_links .case_study .case_list_wrap .swiper-button-prev {
  left: 0;
  transform: translate(-150%, 50%);
}
@media screen and (max-width: 767px) {
  .page.cosme_links .case_study .case_list_wrap .swiper-button-prev {
    left: 1.3333333333vw;
    transform: translate(0%, 50%);
  }
}
.page.cosme_links .case_study .case_list_wrap .swiper-button-next {
  right: 0;
  transform: translate(150%, 50%);
}
@media screen and (max-width: 767px) {
  .page.cosme_links .case_study .case_list_wrap .swiper-button-next {
    right: 1.3333333333vw;
    transform: translate(0%, 50%);
  }
}
.page.cosme_links .case_study .case_list_item {
  position: relative;
  width: 19.7916666667vw;
  height: 100%;
  background: #fff;
  border-radius: 15px;
  overflow: hidden;
  transition: all 0.5s cubic-bezier(0.21, 0.51, 0.51, 1);
}
@media screen and (max-width: 767px) {
  .page.cosme_links .case_study .case_list_item {
    width: 100%;
  }
}
.page.cosme_links .case_study .case_list_item:first-child {
  margin-left: 0;
}
.page.cosme_links .case_study .case_list_item:hover a:before, .page.cosme_links .case_study .case_list_item:hover a:after {
  transform: rotate(180deg);
}
.page.cosme_links .case_study .case_list_item:hover a img {
  transform: scale(1.1);
}
.page.cosme_links .case_study .case_list_item.-icon:before {
  display: block;
  position: absolute;
  z-index: 2;
  top: 1%;
  left: 1%;
  padding-top: 0.2604166667vw;
  padding-left: 0.2604166667vw;
  padding-right: 0.2604166667vw;
  width: 28%;
  height: 11%;
  border-radius: 0.5208333333vw;
  white-space: nowrap;
  font-size: 10px;
  letter-spacing: -0.5px;
  line-height: 1;
  font-weight: 500;
  white-space: nowrap;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .case_study .case_list_item.-icon:before {
    top: 0.6666666667vw;
    left: 0.6666666667vw;
    padding-top: 0.6666666667vw;
    padding-left: 0.6666666667vw;
    padding-right: 0.6666666667vw;
    width: 5.5rem;
    height: 10vw;
    border-radius: 1.3333333333vw;
    font-size: 1.6vw;
  }
}
.page.cosme_links .case_study .case_list_item.-icon.-icon_adv:before {
  content: "広告出演";
  background: rgba(255, 255, 255, 0.5) url("../images/links/about_icon1_4.webp") center 1.3020833333vw no-repeat;
  background-size: 2.1354166667vw 2.1354166667vw;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .case_study .case_list_item.-icon.-icon_adv:before {
    background: rgba(255, 255, 255, 0.5) url("../images/links/about_icon1_4.webp") center 3.3333333333vw no-repeat;
    background-size: 5.4666666667vw 5.4666666667vw;
  }
}
.page.cosme_links .case_study .case_list_item.-icon.-icon_mnt:before {
  content: "美容モニター調査";
  background: rgba(255, 255, 255, 0.5) url("../images/links/about_icon1_1.webp") center 1.3020833333vw no-repeat;
  background-size: 2.1354166667vw 2.1354166667vw;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .case_study .case_list_item.-icon.-icon_mnt:before {
    background: rgba(255, 255, 255, 0.5) url("../images/links/about_icon1_1.webp") center 3.3333333333vw no-repeat;
    background-size: 5.4666666667vw 5.4666666667vw;
  }
}
.page.cosme_links .case_study .case_list_item.-icon.-icon_evt:before {
  content: "イベント集客";
  background: rgba(255, 255, 255, 0.5) url("../images/links/about_icon1_2.webp") center 1.3020833333vw no-repeat;
  background-size: 2.1354166667vw 2.1354166667vw;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .case_study .case_list_item.-icon.-icon_evt:before {
    background: rgba(255, 255, 255, 0.5) url("../images/links/about_icon1_2.webp") center 3.3333333333vw no-repeat;
    background-size: 5.4666666667vw 5.4666666667vw;
  }
}
.page.cosme_links .case_study .case_list_item.-icon.-icon_lect:before {
  content: "研修講師依頼";
  background: rgba(255, 255, 255, 0.5) url("../images/links/about_icon2_2.webp") center 1.3020833333vw no-repeat;
  background-size: 2.1354166667vw 2.1354166667vw;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .case_study .case_list_item.-icon.-icon_lect:before {
    background: rgba(255, 255, 255, 0.5) url("../images/links/about_icon2_2.webp") center 3.3333333333vw no-repeat;
    background-size: 5.4666666667vw 5.4666666667vw;
  }
}
.page.cosme_links .case_study .case_list_item.-icon.-icon_req:before {
  content: "キャリア採用支援";
  background: rgba(255, 255, 255, 0.5) url("../images/links/about_icon2_3.webp") center 1.3020833333vw no-repeat;
  background-size: 2.1354166667vw 2.1354166667vw;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .case_study .case_list_item.-icon.-icon_req:before {
    background: rgba(255, 255, 255, 0.5) url("../images/links/about_icon2_3.webp") center 3.3333333333vw no-repeat;
    background-size: 5.4666666667vw 5.4666666667vw;
  }
}
.page.cosme_links .case_study .case_list_item.-icon.-icon_write:before {
  content: "記事執筆";
  background: rgba(255, 255, 255, 0.5) url("../images/links/about_icon1_5.webp") center 1.3020833333vw no-repeat;
  background-size: 2.1354166667vw 2.1354166667vw;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .case_study .case_list_item.-icon.-icon_write:before {
    background: rgba(255, 255, 255, 0.5) url("../images/links/about_icon1_5.webp") center 3.3333333333vw no-repeat;
    background-size: 5.4666666667vw 5.4666666667vw;
  }
}
.page.cosme_links .case_study .case_list_item.-add_icon:after {
  display: block;
  position: absolute;
  top: 13%;
  left: 1%;
  padding-top: 0.2604166667vw;
  padding-left: 0.2604166667vw;
  padding-right: 0.2604166667vw;
  width: 28%;
  height: 11%;
  border-radius: 0.5208333333vw;
  white-space: nowrap;
  font-size: 10px;
  letter-spacing: -0.5px;
  line-height: 1;
  font-weight: 500;
  white-space: nowrap;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .case_study .case_list_item.-add_icon:after {
    top: 11.3333333333vw;
    left: 0.6666666667vw;
    padding-top: 0.6666666667vw;
    padding-left: 0.6666666667vw;
    padding-right: 0.6666666667vw;
    width: 5.5rem;
    height: 10vw;
    border-radius: 1.3333333333vw;
    font-size: 1.6vw;
  }
}
.page.cosme_links .case_study .case_list_item.-add_icon.-add_icon_mnt:after {
  content: "美容モニター調査";
  background: rgba(255, 255, 255, 0.5) url("../images/links/about_icon1_1.webp") center 1.3020833333vw no-repeat;
  background-size: 2.1354166667vw 2.1354166667vw;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .case_study .case_list_item.-add_icon.-add_icon_mnt:after {
    background: rgba(255, 255, 255, 0.5) url("../images/links/about_icon1_1.webp") center 3.3333333333vw no-repeat;
    background-size: 5.4666666667vw 5.4666666667vw;
  }
}
.page.cosme_links .case_study .case_list_item.-add_icon.-add_icon_evt:after {
  content: "イベント集客";
  background: rgba(255, 255, 255, 0.5) url("../images/links/about_icon1_2.webp") center 1.3020833333vw no-repeat;
  background-size: 2.1354166667vw 2.1354166667vw;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .case_study .case_list_item.-add_icon.-add_icon_evt:after {
    background: rgba(255, 255, 255, 0.5) url("../images/links/about_icon1_2.webp") center 3.3333333333vw no-repeat;
    background-size: 5.4666666667vw 5.4666666667vw;
  }
}
.page.cosme_links .case_study .case_list_item.-add_icon.-add_icon_sns:after {
  content: "SNS発信";
  background: rgba(255, 255, 255, 0.5) url("../images/links/about_icon1_6.webp") center 1.3020833333vw no-repeat;
  background-size: 2.1354166667vw 2.1354166667vw;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .case_study .case_list_item.-add_icon.-add_icon_sns:after {
    background: rgba(255, 255, 255, 0.5) url("../images/links/about_icon1_6.webp") center 3.3333333333vw no-repeat;
    background-size: 5.4666666667vw 5.4666666667vw;
  }
}
.page.cosme_links .case_study .case_list_item a {
  position: relative;
  display: block;
  text-decoration: none;
  color: #000;
  height: 100%;
}
.page.cosme_links .case_study .case_list_item a:before, .page.cosme_links .case_study .case_list_item a:after {
  content: "";
  display: block;
  position: absolute;
  background: #E3007E;
  transition: all 0.5s cubic-bezier(0.21, 0.51, 0.51, 1);
}
.page.cosme_links .case_study .case_list_item a:before {
  right: 15px;
  bottom: 24px;
  width: 22px;
  height: 4px;
}
.page.cosme_links .case_study .case_list_item a:after {
  right: 24px;
  bottom: 15px;
  width: 4px;
  height: 22px;
}
.page.cosme_links .case_study .case_list_item a dl dd {
  transition: all 0.5s cubic-bezier(0.21, 0.51, 0.51, 1);
}
.page.cosme_links .case_study .case_list_item figure img {
  width: 100%;
  transition: all 0.5s cubic-bezier(0.21, 0.51, 0.51, 1);
}
.page.cosme_links .case_study .case_list_item dl {
  position: relative;
  padding: 2.6041666667vw 1.0416666667vw 1.3020833333vw;
  width: 100%;
  text-align: left;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .case_study .case_list_item dl {
    padding: 6.6666666667vw 2.6666666667vw 3.3333333333vw;
  }
}
.page.cosme_links .case_study .case_list_item dl dt {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
  padding: 0.5208333333vw 1.0416666667vw;
  background: #E3007E;
  font-size: 16px;
  line-height: 1.25;
  letter-spacing: 0.1rem;
  color: #fff;
  transform: translateY(-50%);
}
@media screen and (max-width: 767px) {
  .page.cosme_links .case_study .case_list_item dl dt {
    padding: 1.3333333333vw 2.6666666667vw;
    font-size: 2.9333333333vw;
    letter-spacing: 0.1rem;
  }
}
.page.cosme_links .case_study .case_list_item dl dd p {
  font-size: 14px;
  line-height: 1.4;
  letter-spacing: 0.5rem;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .case_study .case_list_item dl dd p {
    font-size: 2.9333333333vw;
    letter-spacing: 0.2rem;
  }
}
.page.cosme_links .case_study .case_list_item dl dd ul {
  margin: 20px 0 0;
  padding-left: 0;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .case_study .case_list_item dl dd ul {
    margin: 1.3333333333vw 0 0;
  }
}
.page.cosme_links .case_study .case_list_item dl dd ul li {
  list-style: none;
  margin-bottom: 0;
  font-size: 14px;
  line-height: 1.8;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .case_study .case_list_item dl dd ul li {
    font-size: 2.6666666667vw;
  }
}
.page.cosme_links .customers .title:before, .page.cosme_links .customers .title:after {
  content: "CUSTOMERS" !important;
}
.page.cosme_links .customers .inner {
  text-align: center;
}
.page.cosme_links .customers .inner h2 {
  position: relative;
  top: -1.71875vw;
  margin-bottom: -1.71875vw;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .customers .inner h2 {
    top: -5.3333333333vw;
    margin-bottom: -5.3333333333vw;
  }
}
.page.cosme_links .customers_list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin: 3.6458333333vw auto 6.25vw;
  padding-left: 0;
  max-width: 52.0833333333vw;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .customers_list {
    margin: 5.3333333333vw 4vw 13.3333333333vw;
    max-width: 100%;
  }
}
.page.cosme_links .customers_list li {
  list-style: none;
  margin-left: 5%;
  margin-top: 2.6041666667vw;
  width: 30%;
}
.page.cosme_links .customers_list li:nth-child(3n+1) {
  margin-left: 0;
}
.page.cosme_links .links .inner {
  margin: 0 auto;
  max-width: 62.5vw;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .links .inner {
    margin: 0 4vw;
    max-width: 100%;
  }
}
.page.cosme_links .links .link_list {
  display: flex;
  justify-content: space-between;
  padding-left: 0;
}
.page.cosme_links .links .link_list_item {
  list-style: none;
  position: relative;
  width: 30.2083333333vw;
  margin-bottom: 0;
  padding: 0.5208333333vw;
  background: #E3007E;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .links .link_list_item {
    width: 49%;
    padding: 1.3333333333vw;
  }
}
.page.cosme_links .links .link_list_item dl dt {
  position: relative;
  padding: 0.5208333333vw 0 1.5625vw;
  font-family: var(--font-serif);
  font-size: 24px;
  line-height: 1;
  color: #fff;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .links .link_list_item dl dt {
    padding: 2.6666666667vw 0 4vw;
    font-size: 3.2vw;
    letter-spacing: 0.1rem;
  }
}
.page.cosme_links .links .link_list_item dl dt:after {
  content: "";
  display: block;
  position: absolute;
  left: 50%;
  bottom: 0;
  border-top: 1.5625vw solid #E3007E;
  border-left: 1.5625vw solid transparent;
  border-right: 1.5625vw solid transparent;
  border-bottom: 0;
  transform: translate(-50%, 100%);
}
@media screen and (max-width: 767px) {
  .page.cosme_links .links .link_list_item dl dt:after {
    bottom: 1px;
    border-top: 2.6666666667vw solid #E3007E;
    border-left: 2.6666666667vw solid transparent;
    border-right: 2.6666666667vw solid transparent;
  }
}
.page.cosme_links .links .link_list_item dl dt img {
  width: 21.3107638889vw;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .links .link_list_item dl dt img {
    width: 40.9166666667vw;
  }
}
.page.cosme_links .links .link_list_item dl dd {
  background: #fff;
}
.page.cosme_links .links .link_list_item dl dd a {
  display: block;
  padding: 2.6041666667vw 0;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .links .link_list_item dl dd a {
    padding: 6.6666666667vw 0;
  }
}
.page.cosme_links .links .link_list_item dl dd a img {
  width: 15.625vw;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .links .link_list_item dl dd a img {
    width: 32.5925925926vw;
  }
}
.page.cosme_links .links .link_list_item dl dd span {
  position: absolute;
  display: block;
  bottom: 0;
  left: 50%;
  padding: 0.2604166667vw 1.0416666667vw 0 calc(1.0416666667vw + 1em);
  width: 100%;
  font-size: 0.7291666667vw;
  text-indent: -1em;
  text-align: left;
  font-weight: 500;
  transform: translate(-50%, 100%);
}
@media screen and (max-width: 767px) {
  .page.cosme_links .links .link_list_item dl dd span {
    left: 0;
    padding: 0.6666666667vw 1.3333333333vw 0 calc(1.3333333333vw + 1em);
    width: 200%;
    font-size: 2.6666666667vw;
    transform: translate(0, 100%);
  }
}
.page.cosme_links .modal_window {
  position: fixed;
  display: none;
  z-index: 10000;
  top: 0;
  left: 0;
  width: 100%;
  height: 100svh;
}
.page.cosme_links .modal_window_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.7);
}
.page.cosme_links .modal_window_contents {
  position: relative;
  top: 50%;
  margin: 0 auto;
  width: 50%;
  height: 90svh;
  border: 2px solid #E3007E;
  overflow-y: scroll;
  background: #fff;
  transform: translateY(-50%);
}
@media screen and (max-width: 767px) {
  .page.cosme_links .modal_window_contents {
    width: 95%;
  }
}
.page.cosme_links .modal_window_contents .inner {
  padding: 1.5625vw 1.5625vw 2.6041666667vw;
  display: none;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .modal_window_contents .inner {
    padding: 4vw 4vw 6.6666666667vw;
  }
}
.page.cosme_links .modal_window_contents .inner.-show {
  display: block;
}
.page.cosme_links .modal_window_contents .inner .modal_header {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}
.page.cosme_links .modal_window_contents .inner .modal_header figure {
  display: block;
  width: 50%;
}
.page.cosme_links .modal_window_contents .inner .modal_header figure.-border {
  border: 2px solid #ccc;
}
.page.cosme_links .modal_window_contents .inner .modal_header figure img {
  width: 100%;
}
.page.cosme_links .modal_window_contents .inner .modal_header > dl {
  padding-left: 1.5625vw;
  width: 50%;
}
.page.cosme_links .modal_window_contents .inner .modal_header > dl > dt {
  font-size: 1.25vw;
  line-height: 1.5;
  letter-spacing: 0.2rem;
  font-weight: 700;
  color: #E3007E;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .modal_window_contents .inner .modal_header > dl > dt {
    font-size: 3.2vw;
    letter-spacing: 0.2rem;
  }
}
.page.cosme_links .modal_window_contents .inner .modal_header > dl > dd {
  font-size: 0.9375vw;
  line-height: 1.5;
  letter-spacing: 0.5rem;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .modal_window_contents .inner .modal_header > dl > dd {
    font-size: 2.9333333333vw;
    letter-spacing: 0.2rem;
  }
}
.page.cosme_links .modal_window_contents .inner .modal_header > dl > dd:last-child {
  padding-top: 1.5625vw;
  font-size: 0.8333333333vw;
  line-height: 1.5;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .modal_window_contents .inner .modal_header > dl > dd:last-child {
    padding-top: 4vw;
    font-size: 2.9333333333vw;
  }
}
.page.cosme_links .modal_window_contents .inner .modal_header > dl > dd.type dl {
  margin-top: 0.78125vw;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .modal_window_contents .inner .modal_header > dl > dd.type dl {
    margin-top: 2vw;
  }
}
.page.cosme_links .modal_window_contents .inner .modal_header > dl > dd.type dl:first-child {
  margin-top: 0;
}
.page.cosme_links .modal_window_contents .inner .modal_header > dl > dd.type dl dt {
  display: inline-block;
  padding: 0.2604166667vw;
  background: #E3007E;
  color: #fff;
  line-height: 1;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .modal_window_contents .inner .modal_header > dl > dd.type dl dt {
    padding: 0.6666666667vw;
    font-size: 2.9333333333vw;
  }
}
@media screen and (max-width: 767px) {
  .page.cosme_links .modal_window_contents .inner .modal_header > dl > dd.type dl dd {
    font-size: 2.9333333333vw;
  }
}
.page.cosme_links .modal_window_contents .inner .modal_header p {
  margin-top: 1.0416666667vw;
  width: 100%;
  font-size: 1.0416666667vw;
  line-height: 1.7;
  letter-spacing: 0.2rem;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .modal_window_contents .inner .modal_header p {
    margin-top: 2.6666666667vw;
    font-size: 2.9333333333vw;
    letter-spacing: 0.2rem;
  }
}
.page.cosme_links .modal_window_contents .inner .modal_body .modal_qa dt {
  position: relative;
  margin-top: 3.125vw;
  padding-top: 3.125vw;
  padding-left: 2.34375vw;
  border-top: 1px solid #ccc;
  font-size: 1.0416666667vw;
  line-height: 1.7;
  letter-spacing: 0.2rem;
  font-weight: 500;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .modal_window_contents .inner .modal_body .modal_qa dt {
    margin-top: 8vw;
    padding-top: 8vw;
    padding-left: 6vw;
    font-size: 2.9333333333vw;
    letter-spacing: 0.2rem;
  }
}
.page.cosme_links .modal_window_contents .inner .modal_body .modal_qa dt:before {
  content: "Q";
  display: block;
  position: absolute;
  left: 0;
  top: 3.125vw;
  font-size: 2.0833333333vw;
  line-height: 1;
  color: #E3007E;
  font-weight: 700;
  transform: translateY(-40%);
}
@media screen and (max-width: 767px) {
  .page.cosme_links .modal_window_contents .inner .modal_body .modal_qa dt:before {
    top: 8vw;
    font-size: 5.3333333333vw;
  }
}
.page.cosme_links .modal_window_contents .inner .modal_body .modal_qa dd {
  position: relative;
  margin-top: 1.0416666667vw;
  padding-left: 2.34375vw;
  font-size: 1.0416666667vw;
  line-height: 1.7;
  letter-spacing: 0.2rem;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .modal_window_contents .inner .modal_body .modal_qa dd {
    margin-top: 2.6666666667vw;
    padding-left: 6vw;
    font-size: 2.9333333333vw;
    letter-spacing: 0.2rem;
  }
}
.page.cosme_links .modal_window_contents .inner .modal_body .modal_qa dd:before {
  content: "A";
  display: block;
  position: absolute;
  left: 0.1041666667vw;
  top: 0;
  font-size: 2.0833333333vw;
  line-height: 1;
  color: #65402C;
  font-weight: 700;
  transform: translateY(-30%);
}
@media screen and (max-width: 767px) {
  .page.cosme_links .modal_window_contents .inner .modal_body .modal_qa dd:before {
    font-size: 5.3333333333vw;
  }
}
.page.cosme_links .modal_window_contents .inner .modal_body .modal_qa dd figure {
  display: block;
  padding-top: 1.5625vw;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .modal_window_contents .inner .modal_body .modal_qa dd figure {
    padding-top: 4vw;
  }
}
.page.cosme_links .modal_window_contents .inner .modal_body .modal_qa dd figure.-img_v {
  width: 50%;
}
.page.cosme_links .modal_window_contents .inner .modal_body .modal_sp {
  margin-top: 3.125vw;
  border: 1px solid #E3007E;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .modal_window_contents .inner .modal_body .modal_sp {
    margin-top: 8vw;
  }
}
.page.cosme_links .modal_window_contents .inner .modal_body .modal_sp dl dt {
  padding: 0.5208333333vw 1.5625vw;
  background: #E3007E;
  font-size: 1.0416666667vw;
  letter-spacing: 0.2rem;
  color: #fff;
  font-weight: 500;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .modal_window_contents .inner .modal_body .modal_sp dl dt {
    padding: 0.5208333333vw 1.5625vw;
    font-size: 2.9333333333vw;
  }
}
.page.cosme_links .modal_window_contents .inner .modal_body .modal_sp dl dd {
  padding: 1.5625vw;
  font-size: 1.0416666667vw;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .modal_window_contents .inner .modal_body .modal_sp dl dd {
    padding: 1.5625vw;
    font-size: 2.9333333333vw;
  }
}
.page.cosme_links .modal_window_contents .inner .modal_body .modal_sp dl dd span {
  display: block;
}
.page.cosme_links .modal_window_contents .inner .modal_body .modal_sp dl dd span.modal_sp_h {
  padding: 1.0416666667vw 0 0;
  font-weight: 500;
}
.page.cosme_links .modal_window_contents .inner .modal_body .modal_sp dl dd span.modal_sp_txt {
  padding: 0.5208333333vw 0 0;
}
.page.cosme_links .modal_window_contents .inner .modal_body .modal_sp dl dd figure figcaption {
  display: block;
  padding: 0.5208333333vw 0 0;
  font-size: 0.8333333333vw;
  line-height: 1.7;
  letter-spacing: 0.2rem;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .modal_window_contents .inner .modal_body .modal_sp dl dd figure figcaption {
    font-size: 2.4vw;
    letter-spacing: 0.2rem;
  }
}
.page.cosme_links .modal_window_contents .inner .modal_corp {
  margin-top: 4.1666666667vw;
  font-size: 1.0416666667vw;
  line-height: 1.7;
  letter-spacing: 0.2rem;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .modal_window_contents .inner .modal_corp {
    margin-top: 10.6666666667vw;
    font-size: 2.9333333333vw;
  }
}
.page.cosme_links .modal_window_contents .inner .modal_corp dt, .page.cosme_links .modal_window_contents .inner .modal_corp dd {
  font-size: 1.0416666667vw;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .modal_window_contents .inner .modal_corp dt, .page.cosme_links .modal_window_contents .inner .modal_corp dd {
    font-size: 2.9333333333vw;
  }
}
.page.cosme_links .modal_window_contents .inner .modal_corp a {
  display: inline-block;
  color: #E3007E;
}
.page.cosme_links .modal_window_contents .inner .modal_attention {
  margin-top: 4.1666666667vw;
  font-size: 0.8333333333vw;
  line-height: 1.7;
  letter-spacing: 0.2rem;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .modal_window_contents .inner .modal_attention {
    margin-top: 10.6666666667vw;
    font-size: 2.6666666667vw;
  }
}
.page.cosme_links .modal_window_contents .inner .modal_attention dt {
  font-size: 0.8333333333vw;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .modal_window_contents .inner .modal_attention dt {
    font-size: 2.6666666667vw;
  }
}
.page.cosme_links .modal_window_contents .inner .modal_attention ul li {
  padding-left: 3em;
  text-indent: -3em;
  font-size: 0.8333333333vw;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .modal_window_contents .inner .modal_attention ul li {
    font-size: 2.6666666667vw;
  }
}
.page.cosme_links .modal_window_close {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 10000;
  width: 4.6875vw;
  height: 4.1666666667vw;
  transform: translate(19svw, -45svh);
  transition: all 0.5s cubic-bezier(0.21, 0.51, 0.51, 1);
  cursor: pointer;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .modal_window_close {
    top: 5svh;
    left: auto;
    right: 2.5vw;
    border: none;
    width: 10.6666666667vw;
    height: 10.6666666667vw;
    transform: none;
  }
}
.page.cosme_links .modal_window_close:before, .page.cosme_links .modal_window_close:after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0.2604166667vw;
  height: 3.125vw;
  background: #E3007E;
  transition: all 0.5s cubic-bezier(0.21, 0.51, 0.51, 1);
}
@media screen and (max-width: 767px) {
  .page.cosme_links .modal_window_close:before, .page.cosme_links .modal_window_close:after {
    width: 0.6666666667vw;
    height: 8vw;
  }
}
.page.cosme_links .modal_window_close:before {
  transform: translate(-50%, -50%) rotate(45deg);
}
.page.cosme_links .modal_window_close:after {
  transform: translate(-50%, -50%) rotate(-45deg);
}
.page.cosme_links .button_up {
  display: block;
  position: fixed;
  z-index: 1000;
  right: 2.6041666667vw;
  bottom: 5.2083333333vw;
  width: 3.125vw;
  height: 3.125vw;
  border: 2px solid #E3007E;
  border-radius: 1.5625vw;
  background: #E3007E;
  transition: all 0.5s cubic-bezier(0.21, 0.51, 0.51, 1);
  opacity: 0;
  pointer-events: none;
}
@media screen and (max-width: 767px) {
  .page.cosme_links .button_up {
    right: 2.6666666667vw;
    bottom: 4vw;
    width: 10.6666666667vw;
    height: 10.6666666667vw;
    border-radius: 5.3333333333vw;
  }
}
.page.cosme_links .button_up.-show {
  opacity: 1;
  pointer-events: auto;
}
.page.cosme_links .button_up:before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  border-top: 0 solid transparent;
  border-left: 0.3645833333vw solid transparent;
  border-right: 0.3645833333vw solid transparent;
  border-bottom: 0.78125vw solid #fff;
  transform: translate(-50%, -50%);
  transition: all 0.5s cubic-bezier(0.21, 0.51, 0.51, 1);
}
@media screen and (max-width: 767px) {
  .page.cosme_links .button_up:before {
    border-left: 1.3333333333vw solid transparent;
    border-right: 1.3333333333vw solid transparent;
    border-bottom: 3.3333333333vw solid #fff;
  }
}
.page.cosme_links .button_up:hover {
  background: #fff;
}
.page.cosme_links .button_up:hover:before {
  border-bottom: 0.78125vw solid #E3007E;
}

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