/*=======================================================
head
=======================================================*/
.p-blog_single {
  max-width: min(1167 / 1167 * 100vw, 1167px);
  padding: min(50 / 1167 * 100vw, 50px) min(40 / 1167 * 100vw, 40px) 0;
  font-size: min(16 / 1167 * 100vw, 16px);
  line-height: calc(24/16);
  font-weight: 500;
  letter-spacing: 0.03em;
}
.p-blog_single-head {
  margin-bottom: min(52 / 1167 * 100vw, 52px);
}
.p-blog_single-head .p-head-info {
  display: flex;
  flex-wrap: wrap;
  gap: min(24 / 1167 * 100vw, 24px);
  align-items: center;
  margin-bottom: min(12 / 1167 * 100vw, 12px);
}
.p-blog_single-head .p-head-info-time {
  font-size: min(14 / 1167 * 100vw, 14px);
  color: #3C4358;
  font-weight: 400;
}
.p-blog_single-head .p-head-info-cat {
  border-radius: min(11 / 1167 * 100vw, 11px);
  padding: min(1 / 1167 * 100vw, 1px) min(11 / 1167 * 100vw, 11px);
  background: #FB7554;
  color: #FFFFFF;
  font-size: min(14 / 1167 * 100vw, 14px);
  line-height: calc(20/14);
  display: flex;
  justify-content: center;
  align-items: center;
  min-width: min(110 / 1167 * 100vw, 110px);
}
.p-blog_single-head .p-head-ttl {
  font-size: min(28 / 1167 * 100vw, 28px);
  line-height: calc(35/28);
}

@media screen and (max-width: 767px) {
  .p-blog_single {
    max-width: none;
    padding: min(64 / 767 * 100vw, 64px) min(30 / 767 * 100vw, 30px) 0;
    font-size: min(26 / 767 * 100vw, 26px);
  }
  .p-blog_single-head {
    margin-bottom: min(78 / 767 * 100vw, 78px);
  }
  .p-blog_single-head .p-head-info {
    gap: min(36 / 767 * 100vw, 36px);
    margin-bottom: min(18 / 767 * 100vw, 18px);
  }
  .p-blog_single-head .p-head-info-time {
    font-size: min(24 / 767 * 100vw, 24px);
  }
  .p-blog_single-head .p-head-info-cat {
    border-radius: min(16.5 / 767 * 100vw, 16.5px);
    padding: min(1.5 / 767 * 100vw, 1.5px) min(16.5 / 767 * 100vw, 16.5px);
    font-size: min(24 / 767 * 100vw, 24px);
    min-width: min(165 / 767 * 100vw, 165px);
  }
  .p-blog_single-head .p-head-ttl {
    font-size: min(40 / 767 * 100vw, 40px);
  }
}
/*=======================================================
main
=======================================================*/
.p-blog_single .l-common-article {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: min(60 / 1167 * 100vw, 60px);
  margin-bottom: min(100 / 1167 * 100vw, 100px);
}
.p-blog_single .l-common-main {
  flex: 0 1 min(697 / 1167 * 100vw, 697px);
  border-radius: min(4 / 1167 * 100vw, 4px);
  align-self: start;
}
.p-blog_single .l-common-main .p-head-imgWrapper {
  display: flex;
  border-radius: min(4 / 1167 * 100vw, 4px);
  overflow: hidden;
  margin-bottom: min(18 / 1167 * 100vw, 18px);
}
.p-blog_single .l-common-main .p-head-imgWrapper > img {
  width: min(646 / 1167 * 100vw, 646px);
  height: min(314 / 1167 * 100vw, 314px);
  object-fit: cover;
}
.p-blog_single .l-common-main .p-head-list {
  display: flex;
  justify-content: end;
  gap: min(12 / 1167 * 100vw, 12px);
  margin-bottom: min(24 / 1167 * 100vw, 24px);
}
.p-blog_single .l-common-main .p-head-item-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  width: min(120 / 1167 * 100vw, 120px);
  height: min(35 / 1167 * 100vw, 35px);
  border-radius: min(18 / 1167 * 100vw, 18px);
  border: 1px solid #c6c6c6;
  font-size: min(14 / 1167 * 100vw, 14px);
}
.p-blog_single .l-common-main .p-head-item-btn-inner {
  display: flex;
  align-items: center;
  gap: min(3 / 1167 * 100vw, 3px);
}
.p-blog_single .l-common-main .p-head-item-btn-inner::before {
  content: "";
}
.p-blog_single .l-common-main .p-head-item.facebook .p-head-item-btn-inner::before {
  width: min(21 / 1167 * 100vw, 21px);
  height: min(22 / 1167 * 100vw, 22px);
  background: url("../assets/images/common/icon_facebook.svg") top center/contain no-repeat;
}
.p-blog_single .l-common-main .p-head-item.x .p-head-item-btn-inner::before {
  width: min(17 / 1167 * 100vw, 17px);
  height: min(16 / 1167 * 100vw, 16px);
  background: url("../assets/images/common/icon_x.png") top center/contain no-repeat;
}
.p-blog_single .l-common-main .p-lecture {
  border: 1px solid #c6c6c6;
  border-radius: min(4 / 1167 * 100vw, 4px);
  padding: min(33 / 1167 * 100vw, 33px) min(28 / 1167 * 100vw, 28px) min(20 / 1167 * 100vw, 20px);
  margin-bottom: min(30 / 1167 * 100vw, 30px);
}
.p-blog_single .l-common-main .p-lecture-head {
  display: flex;
  gap: min(16 / 1167 * 100vw, 16px);
  align-items: center;
  margin-bottom: min(20 / 1167 * 100vw, 20px);
}
.p-blog_single .l-common-main .p-lecture-head .p-head-imgWrapper {
  display: flex;
  flex: 0 1 min(55 / 1167 * 100vw, 55px);
  margin-bottom: 0;
}
.p-blog_single .l-common-main .p-lecture-head .p-head-imgWrapper > img {
  height: min(55 / 1167 * 100vw, 55px);
  object-fit: cover;
  border-radius: 50%;
}
.p-blog_single .l-common-main .p-lecture-head .p-head-box {
  flex: 1;
}
.p-blog_single .l-common-main .p-lecture-head .p-head-def {
  display: flex;
  align-items: center;
  gap: min(5 / 1167 * 100vw, 5px);
  font-size: min(14 / 1167 * 100vw, 14px);
  line-height: calc(20/14);
  margin-bottom: min(7 / 1167 * 100vw, 7px);
}
.p-blog_single .l-common-main .p-lecture-head .p-head-dttl {
  border-radius: min(18 / 1167 * 100vw, 18px);
  border: 1px solid #c6c6c6;
  padding: min(2 / 1167 * 100vw, 2px) min(11 / 1167 * 100vw, 11px) min(3 / 1167 * 100vw, 3px);
}
.p-blog_single .l-common-main .p-lecture-head .p-head-company {
  padding-left: min(2 / 1167 * 100vw, 2px);
  font-size: min(14 / 1167 * 100vw, 14px);
  color: #959595;
}
.p-blog_single .l-common-main .p-lecture-body {
  font-size: min(14 / 1167 * 100vw, 14px);
}
.p-blog_single .l-common-main #toc_container {
  margin: min(30 / 1167 * 100vw, 30px) 0 min(50 / 1167 * 100vw, 50px);
  border-radius: min(4 / 1167 * 100vw, 4px);
  overflow: hidden;
  background: #FFFAF8;
}
.p-blog_single .l-common-main #toc_container .toc_title {
  background: #FB7554;
  color: #FFFFFF;
  padding: min(8 / 1167 * 100vw, 8px) min(24 / 1167 * 100vw, 24px) min(10 / 1167 * 100vw, 10px);
  font-size: min(18 / 1167 * 100vw, 18px);
  line-height: calc(24/18);
}
.p-blog_single .l-common-main #toc_container .toc_list {
  display: grid;
  gap: min(10 / 1167 * 100vw, 10px);
  padding: min(18 / 1167 * 100vw, 18px) min(24 / 1167 * 100vw, 24px) min(22 / 1167 * 100vw, 22px);
}
.p-blog_single .l-common-main .p-post-cont {
  margin-bottom: min(64 / 1167 * 100vw, 64px);
}
.p-blog_single .l-common-main .p-post-cont > h2 > span {
  display: block;
  background: #F8F8F7;
  padding: min(22 / 1167 * 100vw, 22px) min(33 / 1167 * 100vw, 33px);
  position: relative;
  font-size: min(24 / 1167 * 100vw, 24px);
  line-height: 1.5;
  margin: min(50 / 1167 * 100vw, 50px) 0 min(24 / 1167 * 100vw, 24px);
  font-weight: 700;
}
.p-blog_single .l-common-main .p-post-cont > h2 > span::before {
  position: absolute;
  content: "";
  width: min(8 / 1167 * 100vw, 8px);
  height: 100%;
  background: #FB7554;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}
.p-blog_single .l-common-main .p-post-cont > h3 {
  margin: min(50 / 1167 * 100vw, 50px) 0 min(24 / 1167 * 100vw, 24px);
  padding: 0 min(11 / 1167 * 100vw, 11px) min(13 / 1167 * 100vw, 13px);
  line-height: 1.5;
  font-size: min(20 / 1167 * 100vw, 20px);
  font-weight: 700;
  position: relative;
  background-image: radial-gradient(circle, #FB7554 min(1.5 / 1167 * 100vw, 1.5px), transparent min(1.5 / 1167 * 100vw, 1.5px));
  background-position: left bottom;
  background-repeat: repeat-x;
  background-size: min(5 / 1167 * 100vw, 5px) min(3 / 1167 * 100vw, 3px);
}
.p-blog_single .l-common-main .p-post-cont > p {
  padding: 0 min(11 / 1167 * 100vw, 11px);
  margin: min(24 / 1167 * 100vw, 24px) 0;
}
.p-blog_single .l-common-main .p-together-ttl {
  border-bottom: 1px solid #FB7554;
  margin-bottom: min(20 / 1167 * 100vw, 20px);
}
.p-blog_single .l-common-main .p-together-ttl-inner {
  background: #FB7554;
  color: #FFFFFF;
  padding: min(2 / 1167 * 100vw, 2px) min(7 / 1167 * 100vw, 7px) min(4 / 1167 * 100vw, 4px);
  display: inline-flex;
  justify-content: center;
  align-items: center;
}
.p-blog_single .l-common-main .p-together-list {
  display: grid;
  gap: min(20 / 1167 * 100vw, 20px);
}
.p-blog_single .l-common-main .p-together-item .p-item-link {
  display: flex;
  flex-wrap: wrap;
  gap: min(27 / 1167 * 100vw, 27px);
}
.p-blog_single .l-common-main .p-together-item .p-item-imgWrapper {
  flex: 0 1 min(190 / 1167 * 100vw, 190px);
  border-radius: min(4 / 1167 * 100vw, 4px);
  overflow: hidden;
}
.p-blog_single .l-common-main .p-together-item .p-item-imgWrapper > img {
  object-fit: cover;
  height: min(100 / 1167 * 100vw, 100px);
}
.p-blog_single .l-common-main .p-together-item .p-item-body {
  flex: 1;
}
.p-blog_single .l-common-main .p-together-item .p-item-ttl {
  margin-bottom: min(9 / 1167 * 100vw, 9px);
}
.p-blog_single .l-common-main .p-together-item .p-item-time {
  font-size: min(14 / 1167 * 100vw, 14px);
}

@media screen and (max-width: 767px) {
  .p-blog_single .l-common-article {
    gap: min(42 / 767 * 100vw, 42px);
    margin-bottom: min(100 / 767 * 100vw, 100px);
  }
  .p-blog_single .l-common-main {
    flex: 0 1 100%;
    border-radius: min(6 / 767 * 100vw, 6px);
  }
  .p-blog_single .l-common-main .p-head-imgWrapper {
    border-radius: min(6 / 767 * 100vw, 6px);
    margin-bottom: min(27 / 767 * 100vw, 27px);
    justify-content: center;
  }
  .p-blog_single .l-common-main .p-head-imgWrapper > img {
    width: min(645 / 767 * 100vw, 645px);
    height: min(362 / 767 * 100vw, 362px);
  }
  .p-blog_single .l-common-main .p-head-list {
    gap: min(18 / 767 * 100vw, 18px);
    margin-bottom: min(36 / 767 * 100vw, 36px);
  }
  .p-blog_single .l-common-main .p-head-item-btn {
    width: min(220 / 767 * 100vw, 220px);
    height: min(64 / 767 * 100vw, 64px);
    border-radius: min(36 / 767 * 100vw, 36px);
    border-width: min(2 / 767 * 100vw, 2px);
    font-size: min(24 / 767 * 100vw, 24px);
  }
  .p-blog_single .l-common-main .p-head-item-btn-inner {
    gap: min(4.5 / 767 * 100vw, 4.5px);
  }
  .p-blog_single .l-common-main .p-head-item.facebook .p-head-item-btn-inner::before {
    width: min(40 / 767 * 100vw, 40px);
    height: min(45 / 767 * 100vw, 45px);
  }
  .p-blog_single .l-common-main .p-head-item.x .p-head-item-btn-inner::before {
    width: min(34 / 767 * 100vw, 34px);
    height: min(32 / 767 * 100vw, 32px);
  }
  .p-blog_single .l-common-main .p-lecture {
    border-width: min(2 / 767 * 100vw, 2px);
    border-radius: min(6 / 767 * 100vw, 6px);
    padding: min(32 / 767 * 100vw, 32px) min(30 / 767 * 100vw, 30px) min(40 / 767 * 100vw, 40px);
    margin-bottom: min(45 / 767 * 100vw, 45px);
  }
  .p-blog_single .l-common-main .p-lecture-head {
    gap: min(24 / 767 * 100vw, 24px);
    margin-bottom: min(30 / 767 * 100vw, 30px);
  }
  .p-blog_single .l-common-main .p-lecture-head .p-head-imgWrapper {
    flex: 0 1 min(82.5 / 767 * 100vw, 82.5px);
  }
  .p-blog_single .l-common-main .p-lecture-head .p-head-imgWrapper > img {
    height: min(82.5 / 767 * 100vw, 82.5px);
  }
  .p-blog_single .l-common-main .p-lecture-head .p-head-def {
    gap: min(7.5 / 767 * 100vw, 7.5px);
    font-size: min(24 / 767 * 100vw, 24px);
    margin-bottom: min(10.5 / 767 * 100vw, 10.5px);
  }
  .p-blog_single .l-common-main .p-lecture-head .p-head-dttl {
    border-radius: min(27 / 767 * 100vw, 27px);
    border-width: min(2 / 767 * 100vw, 2px);
    padding: min(3 / 767 * 100vw, 3px) min(16.5 / 767 * 100vw, 16.5px) min(4.5 / 767 * 100vw, 4.5px);
  }
  .p-blog_single .l-common-main .p-lecture-head .p-head-company {
    padding-left: min(3 / 767 * 100vw, 3px);
    font-size: min(24 / 767 * 100vw, 24px);
  }
  .p-blog_single .l-common-main .p-lecture-body {
    font-size: min(24 / 767 * 100vw, 24px);
  }
  .p-blog_single .l-common-main #toc_container {
    margin: min(45 / 767 * 100vw, 45px) 0 min(75 / 767 * 100vw, 75px);
    border-radius: min(6 / 767 * 100vw, 6px);
  }
  .p-blog_single .l-common-main #toc_container .toc_title {
    padding: min(12 / 767 * 100vw, 12px) min(36 / 767 * 100vw, 36px) min(15 / 767 * 100vw, 15px);
    font-size: min(30 / 767 * 100vw, 30px);
  }
  .p-blog_single .l-common-main #toc_container .toc_list {
    gap: min(15 / 767 * 100vw, 15px);
    padding: min(27 / 767 * 100vw, 27px) min(36 / 767 * 100vw, 36px) min(33 / 767 * 100vw, 33px);
  }
  .p-blog_single .l-common-main .p-post-cont {
    margin-bottom: min(96 / 767 * 100vw, 96px);
  }
  .p-blog_single .l-common-main .p-post-cont > h2 > span {
    padding: min(33 / 767 * 100vw, 33px) min(46.5 / 767 * 100vw, 46.5px);
    font-size: min(36 / 767 * 100vw, 36px);
    margin: min(75 / 767 * 100vw, 75px) 0 min(36 / 767 * 100vw, 36px);
  }
  .p-blog_single .l-common-main .p-post-cont > h2 > span::before {
    width: min(12 / 767 * 100vw, 12px);
  }
  .p-blog_single .l-common-main .p-post-cont > h3 {
    margin: min(75 / 767 * 100vw, 75px) 0 min(36 / 767 * 100vw, 36px);
    padding: 0 0 min(19.5 / 767 * 100vw, 19.5px);
    font-size: min(30 / 767 * 100vw, 30px);
    background-size: min(5 / 767 * 100vw, 5px) min(3 / 767 * 100vw, 3px);
  }
  .p-blog_single .l-common-main .p-post-cont > p {
    padding: 0;
    margin: min(36 / 767 * 100vw, 36px) 0;
  }
  .p-blog_single .l-common-main .p-together-ttl {
    border-width: min(2 / 767 * 100vw, 2px);
    margin-bottom: min(30 / 767 * 100vw, 30px);
  }
  .p-blog_single .l-common-main .p-together-ttl-inner {
    padding: min(3 / 767 * 100vw, 3px) min(10.5 / 767 * 100vw, 10.5px) min(6 / 767 * 100vw, 6px);
  }
  .p-blog_single .l-common-main .p-together-list {
    gap: min(30 / 767 * 100vw, 30px);
  }
  .p-blog_single .l-common-main .p-together-item .p-item-link {
    gap: min(32 / 767 * 100vw, 32px);
  }
  .p-blog_single .l-common-main .p-together-item .p-item-imgWrapper {
    flex: 0 1 min(240 / 767 * 100vw, 240px);
    border-radius: min(6 / 767 * 100vw, 6px);
  }
  .p-blog_single .l-common-main .p-together-item .p-item-imgWrapper > img {
    height: min(135 / 767 * 100vw, 135px);
  }
  .p-blog_single .l-common-main .p-together-item .p-item-ttl {
    margin-bottom: min(13.5 / 767 * 100vw, 13.5px);
  }
  .p-blog_single .l-common-main .p-together-item .p-item-time {
    font-size: min(24 / 767 * 100vw, 24px);
  }
}
/*=======================================================
aside
=======================================================*/
.p-blog_single .l-common-aside {
  flex: 1;
}
.p-blog_single .l-common-aside .p-main_bnr {
  margin-bottom: min(48 / 1167 * 100vw, 48px);
  border-radius: min(4 / 1167 * 100vw, 4px);
  overflow: hidden;
}
.p-blog_single .l-common-aside .p-main_bnr > a {
  display: flex;
}
.p-blog_single .l-common-aside .p-new {
  margin-bottom: min(54 / 1167 * 100vw, 54px);
}
.p-blog_single .l-common-aside .p-new-ttl {
  padding-bottom: min(8 / 1167 * 100vw, 8px);
  border-bottom: min(2 / 1167 * 100vw, 2px) solid #FB7554;
  font-size: min(20 / 1167 * 100vw, 20px);
  line-height: calc(35/20);
  margin-bottom: min(20 / 1167 * 100vw, 20px);
  text-align: center;
}
.p-blog_single .l-common-aside .p-new-list {
  display: grid;
  gap: min(30 / 1167 * 100vw, 30px);
}
.p-blog_single .l-common-aside .p-new-item .p-item-link {
  display: flex;
  align-items: center;
  gap: min(22 / 1167 * 100vw, 22px);
}
.p-blog_single .l-common-aside .p-new-item .p-item-imgWrapper {
  display: flex;
  flex: 0 1 min(135 / 1167 * 100vw, 135px);
  border-radius: min(4 / 1167 * 100vw, 4px);
  overflow: hidden;
}
.p-blog_single .l-common-aside .p-new-item .p-item-imgWrapper > img {
  height: min(90 / 1167 * 100vw, 90px);
  object-fit: cover;
}
.p-blog_single .l-common-aside .p-new-item .p-item-ttl {
  flex: 1;
}
.p-blog_single .l-common-aside .p-cat {
  margin-bottom: min(60 / 1167 * 100vw, 60px);
}
.p-blog_single .l-common-aside .p-cat-ttl {
  padding-bottom: min(8 / 1167 * 100vw, 8px);
  border-bottom: min(2 / 1167 * 100vw, 2px) solid #FB7554;
  font-size: min(20 / 1167 * 100vw, 20px);
  line-height: calc(35/20);
  margin-bottom: min(20 / 1167 * 100vw, 20px);
  text-align: center;
}
.p-blog_single .l-common-aside .p-cat-list {
  display: flex;
  flex-wrap: wrap;
  gap: min(10 / 1167 * 100vw, 10px);
}
.p-blog_single .l-common-aside .p-cat-item .p-item-link {
  display: flex;
  padding: min(2 / 1167 * 100vw, 2px) min(9 / 1167 * 100vw, 9px) min(4 / 1167 * 100vw, 4px);
  background: #FB7554;
  color: #FFFFFF;
  border-radius: min(4 / 1167 * 100vw, 4px);
}
.p-blog_single .l-common-aside .p-cat-item .p-item-link-deco::before {
  content: "#";
}
.p-blog_single .l-common-aside .p-sub_bnr-list {
  display: grid;
  gap: min(20 / 1167 * 100vw, 20px);
}
.p-blog_single .l-common-aside .p-sub_bnr-item .p-item-imgWrapper {
  border-radius: min(4 / 1167 * 100vw, 4px);
  overflow: hidden;
}
.p-blog_single .l-common-aside .p-sub_bnr-item .p-item-imgWrapper > a {
  display: flex;
}

@media screen and (max-width: 767px) {
  .p-blog_single .l-common-aside .p-main_bnr {
    margin-bottom: min(64 / 767 * 100vw, 64px);
    border-radius: min(6 / 767 * 100vw, 6px);
  }
  .p-blog_single .l-common-aside .p-new {
    margin-bottom: min(80 / 767 * 100vw, 80px);
  }
  .p-blog_single .l-common-aside .p-new-ttl {
    padding-bottom: min(18 / 767 * 100vw, 18px);
    border-width: min(3 / 767 * 100vw, 3px);
    font-size: min(30 / 767 * 100vw, 30px);
    margin-bottom: min(30 / 767 * 100vw, 30px);
  }
  .p-blog_single .l-common-aside .p-new-list {
    gap: min(45 / 767 * 100vw, 45px);
  }
  .p-blog_single .l-common-aside .p-new-item .p-item-link {
    gap: min(33 / 767 * 100vw, 33px);
  }
  .p-blog_single .l-common-aside .p-new-item .p-item-imgWrapper {
    flex: 0 1 min(240 / 767 * 100vw, 240px);
    border-radius: min(6 / 767 * 100vw, 6px);
  }
  .p-blog_single .l-common-aside .p-new-item .p-item-imgWrapper > img {
    height: min(135 / 767 * 100vw, 135px);
  }
  .p-blog_single .l-common-aside .p-cat {
    margin-bottom: min(90 / 767 * 100vw, 90px);
  }
  .p-blog_single .l-common-aside .p-cat-ttl {
    padding-bottom: min(12 / 767 * 100vw, 12px);
    border-width: min(3 / 767 * 100vw, 3px);
    font-size: min(30 / 767 * 100vw, 30px);
    margin-bottom: min(30 / 767 * 100vw, 30px);
  }
  .p-blog_single .l-common-aside .p-cat-list {
    gap: min(15 / 767 * 100vw, 15px);
  }
  .p-blog_single .l-common-aside .p-cat-item .p-item-link {
    padding: min(3 / 767 * 100vw, 3px) min(13.5 / 767 * 100vw, 13.5px) min(6 / 767 * 100vw, 6px);
    border-radius: min(6 / 767 * 100vw, 6px);
  }
  .p-blog_single .l-common-aside .p-sub_bnr-list {
    gap: min(30 / 767 * 100vw, 30px);
  }
  .p-blog_single .l-common-aside .p-sub_bnr-item .p-item-imgWrapper {
    border-radius: min(6 / 767 * 100vw, 6px);
  }
}
/*=======================================================
connection
=======================================================*/
.p-connection {
  width: min(1080 / 1080 * 100vw, 1080px);
  padding: 0 min(40 / 1080 * 100vw, 40px) min(140 / 1167 * 100vw, 140px);
  margin: 0 auto;
}
.p-connection-ttl {
  font-size: min(24 / 1080 * 100vw, 24px);
  margin-bottom: min(20 / 1080 * 100vw, 20px);
  text-align: center;
  line-height: calc(29/24);
  font-weight: 500;
}
.p-connection-swiper-box {
  position: relative;
}
.p-connection-wrapper {
  overflow-x: hidden;
}
.p-connection-list {
  justify-content: start;
  flex-wrap: nowrap;
  gap: min(20 / 1080 * 100vw, 20px);
}
.p-connection-item {
  margin-right: 0 !important;
  height: auto;
}
.p-connection .swiper-button-prev, .p-connection .swiper-button-next {
  top: calc(min(209 / 1080 * 100vw, 209px) - min(36 / 1080 * 100vw, 36px)/2);
  width: min(36 / 1080 * 100vw, 36px);
  height: min(36 / 1080 * 100vw, 36px);
  margin-top: 0;
}
.p-connection .swiper-button-prev::before, .p-connection .swiper-button-next::before {
  position: absolute;
  content: "";
  width: min(36 / 1080 * 100vw, 36px);
  height: min(36 / 1080 * 100vw, 36px);
  background: url("../assets/images/common/swiper_arrow.svg") top center/contain no-repeat;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.p-connection .swiper-button-prev::after, .p-connection .swiper-button-next::after {
  display: none;
}
.p-connection .swiper-button-prev {
  left: max(-40 / 1167 * 100vw, -40px);
  right: initial;
}
.p-connection .swiper-button-next {
  right: max(-40 / 1167 * 100vw, -40px);
  left: initial;
}
.p-connection .swiper-button-next::before {
  transform: translate(-50%, -50%) scale(-1, 1);
}

@media screen and (max-width: 767px) {
  .p-connection {
    width: 100%;
    padding: 0 min(30 / 767 * 100vw, 30px) min(120 / 767 * 100vw, 120px);
  }
  .p-connection-ttl {
    font-size: min(36 / 767 * 100vw, 36px);
    margin-bottom: min(30 / 767 * 100vw, 30px);
  }
  .p-connection-list {
    gap: min(30 / 767 * 100vw, 30px);
  }
  .p-connection .swiper-button-prev, .p-connection .swiper-button-next {
    top: 50%;
    width: min(64 / 767 * 100vw, 64px);
    height: min(64 / 767 * 100vw, 64px);
  }
  .p-connection .swiper-button-prev::before, .p-connection .swiper-button-next::before {
    width: min(64 / 767 * 100vw, 64px);
    height: min(64 / 767 * 100vw, 64px);
  }
  .p-connection .swiper-button-prev {
    left: max(-32 / 767 * 100vw, -32px);
  }
  .p-connection .swiper-button-next {
    right: max(-32 / 767 * 100vw, -32px);
  }
}