@charset "UTF-8";
/* CSS Document */
/*---------------------------------

  mainvisual

---------------------------------*/
#mainvisual {
  position: relative;
  /*height: 80vh;*/
  height: 72rem;
}
#mainvisual .copy {
  margin: auto;
  position: absolute;
  left: 10%;
  bottom: 15%;
  width: 60rem;
  height: 40rem;
  z-index: 1;
}
#mainvisual .copy img {
  width: 100%;
  vertical-align: bottom;
}
#mainvisual .slider {
  margin: auto;
  height: 100%;
  width: 100%;
}
#mainvisual .slider * {
  height: 100%;
}
#mainvisual .slider .s_img {
  width: 100%;
  height: 100%;
}
#mainvisual .slider .s_img img {
  object-fit: cover;
  width: 100%;
}
@media screen and (max-width: 1440px) {
  #mainvisual .copy {
    width: 45rem;
    height: 32rem;
  }
}
@media screen and (max-width: 1024px) {
  #mainvisual .copy {
    left: 5%;
    bottom: 25%;
  }
}
@media screen and (max-width: 896px) {}
@media screen and (max-width: 480px) {
  #mainvisual {
    height: auto;
  }
  #mainvisual .slider {
    height: 70vh;
  }
  #mainvisual .copy {
    width: 30rem;
    height: 20rem;
    bottom: 30vh;
  }
}
/*---------------------------------
  news-ticker
---------------------------------*/
#news-ticker {
  background: var(--co-main);
  border-radius: 7.5rem 0 0 0;
  display: flex;
  align-items: center;
  padding: 3rem 4rem 0rem 1rem;
  position: absolute;
  bottom: 0;
  right: 0;
  max-width: 66rem;
  width: 100%;
  z-index: 1;
}
#news-ticker::before, #news-ticker::after {
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  content: '';
  position: absolute;
  width: 4rem;
  height: 4rem;
}
#news-ticker::before {
  background-image: url("../images/kadomaru/p_b.svg");
  top: -4rem;
  right: 0;
}
#news-ticker::after {
  background-image: url("../images/kadomaru/p_b.svg");
  left: -4rem;
  bottom: 0;
}
#news-ticker h2 {
  border-right: 1px dashed #e6e6e6;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
}
#news-ticker h2 a {
  background: url("../images/important_more.svg") no-repeat center bottom/3rem;
  color: #e6e6e6;
  display: block;
  padding: .5rem 2rem 3rem 2rem;
}
#news-ticker h2 span {
  display: block;
  font: var(--maru-go);
  font-weight: 700;
  font-size: 1.9rem;
  line-height: 1.2;
}
#news-ticker .splide__track {
  flex: 1 1 auto;
}
#news-ticker li {
  padding: 0 3rem;
}
#news-ticker li ._txt a {
  color: #fff;
  line-height: 1.3;
}
#news-ticker li ._txt a:hover {
  color: #F3E271;
}
#news-ticker li ._txt time {
  color: #e6e6e6;
  display: block;
  font-size: .85em;
  margin-bottom: .5rem;
}
#news-ticker li ._txt p {
  text-align: justify;
}
#news-ticker .splide__arrows {
  width: 3rem;
}
#news-ticker .splide__arrows .splide__arrow {
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  border: 1px solid #f2f2f2;
  border-radius: 50%;
  cursor: pointer;
  margin: .5rem 0;
  width: 3rem;
  height: 3rem;
  vertical-align: bottom;
}
#news-ticker .splide__arrows .splide__arrow svg {
  display: none;
}
#news-ticker .splide__arrows .splide__arrow.splide__arrow--prev {
  background-image: url("../images/tp_arr_prev.svg");
}
#news-ticker .splide__arrows .splide__arrow.splide__arrow--next {
  background-image: url("../images/tp_arr_next.svg");
}
@media screen and (max-width: 1440px) {}
@media screen and (max-width: 1024px) {
  #news-ticker {
    padding: 2rem 4rem 0;
  }
}
@media screen and (max-width: 896px) {
  #news-ticker {
    font-size: .9em;
  }
}
@media screen and (max-width: 480px) {
  #news-ticker {
    border-radius: 3rem 0 0 0;
    display: block;
    margin-top: -2rem;
    padding: 1rem 2rem 0;
    position: inherit;
  }
  #news-ticker h2 {
    border: none;
    writing-mode: horizontal-tb;
    margin-bottom: 1rem;
  }
  #news-ticker h2 a {
    background-position: center right;
    padding: .5rem 2rem 0rem 0rem;
}
  #news-ticker h2 span {
    display: inline-block;
    font-size: 1.1em;
  }
  #news-ticker .splide__track {
    border-left: none;
  }
  #news-ticker li {
    padding: 0 0;
  }
  #news-ticker .splide__arrows {
    display: flex;
    justify-content: center;
    margin-top: 2rem;
    width: auto;
  }
  #news-ticker .splide__arrows .splide__arrow {
    margin: 0 1rem;
  }
  #news-ticker .splide__arrows .splide__arrow.splide__arrow--prev {
    transform: rotate(-90deg);
  }
  #news-ticker .splide__arrows .splide__arrow.splide__arrow--next {
    transform: rotate(-90deg);
  }
}
/*---------------------------------

  共通

---------------------------------*/
section {
  padding: 10rem 0;
}
section .wrap {
  margin: auto;
  max-width: var(--width);
  width: 90%;
}
section .title {
  font: var(--maru-go);
  font-weight: 900;
  position: relative;
  text-align: center;
}
section .title h2 {
  font-size: 2.3em;
  letter-spacing: .05em;
}
section .title h2.ab_ttl {
  margin: auto;
  position: absolute;
  left: 0;
  right: 0;
  bottom: -2rem;
  z-index: 1;
}
section .title .en {
  color: #fff;
  font-size: 12rem;
  line-height: 1;
  letter-spacing: .2em;
  opacity: .4;
  text-transform: uppercase;
}
section .title .en::after {
  content: attr(data-en);
  color: rgba(0, 0, 0, .0);
  -webkit-text-stroke: 1px var(--co-main);
  text-stroke: 1px var(--co-main);
  position: absolute;
  top: .3rem;
  left: .3rem;
}
@media screen and (max-width: 1440px) {}
@media screen and (max-width: 1024px) {}
@media screen and (max-width: 896px) {
  section {
    padding: 7rem 0;
  }
  section .title h2 {
    font-size: 2em;
  }
  section .title .en {
    font-size: 9rem;
  }
}
@media screen and (max-width: 480px) {
  section {
    padding: 5rem 0;
  }
  section .title h2 {
    font-size: 1.3em;
  }
  section .title .en {
    font-size: 6rem;
  }
}
/*---------------------------------

  NEWS

---------------------------------*/
.newsBlock {
  background: #f0f0eb;
  position: relative;
}
.newsBlock::before {
  background: url("../images/news_bg.svg") no-repeat center/100% auto;
  content: '';
  position: absolute;
  top: 0;
  width: 100%;
  height: 50rem;
}
.newsBlock .infoWrapper {}
.newsBlock .tab_ttl_wrap {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}
.newsBlock .tab_ttl_wrap .title {
  color: #fff;
  display: flex;
  align-items: baseline;
  line-height: 1;
  padding: 0 2rem 2rem;
}
.newsBlock .tab_ttl_wrap .title h2 {
  background: url("../images/news_icon.svg") no-repeat center left/4rem;
  padding-left: 5.5rem;
}
.newsBlock .tab_ttl_wrap .title p {
  color: #ccc;
  letter-spacing: .4em;
  margin: 0 2rem;
}
.newsBlock .tab_ttl_wrap .tabList {
  border-radius: 2rem 2rem 0 0;
  display: flex;
  list-style: none;
  overflow: hidden;
}
.newsBlock .tab_ttl_wrap .tabList .tab {
  color: #b3b3b3;
  cursor: pointer;
  font: var(--maru-go);
  font-weight: 700;
  font-size: 1.8rem;
  margin: 0;
  min-width: 17rem;
  padding: 1.5rem 2rem;
  text-align: center;
}
.newsBlock .tab_ttl_wrap .tabList .tab:nth-child(1) {
  background: var(--co-sub04);
}
.newsBlock .tab_ttl_wrap .tabList .tab:nth-child(2) {
  background: var(--co-sub03);
}
.newsBlock .tab_ttl_wrap .tabList .tab:nth-child(3) {
  background: var(--co-sub02);
}
.newsBlock .tab_ttl_wrap .tabList .tab:nth-child(4) {
  background: var(--co-sub01);
}
.newsBlock .tab_ttl_wrap .tabList .tab.is-active {
  background: #e6e6e6;
  color: #333;
}
.newsBlock .wrap .panel-group {
  background: #fff;
  border: 1rem solid #e6e6e6;
  border-radius: 5rem 0;
}
.newsBlock .wrap .panel-group .inner {
  padding: 5rem 5rem 6rem;
  position: relative;
}
.newsBlock .wrap .letterList {
  list-style: none;
}
.newsBlock .wrap .letterList li + li {
  margin-top: 2.5rem;
}
.newsBlock .wrap .letterList li .item {}
.newsBlock .wrap .letterList li .item a {
  color: #333;
  display: flex;
  align-items: flex-start;
}
.newsBlock .wrap .letterList li .item time {
  color: #808080;
  display: inline-block;
}
.newsBlock .wrap .letterList li .item .catTag {
  background: #f2f2f2;
  border-radius: 5px;
  color: var(--co-main);
  display: inline-block;
  flex: 0 0 auto;
  font-size: .8em;
  margin: 0 3rem;
  padding: .2rem 1rem;
  text-align: center;
  width: 12rem;
}
.newsBlock .wrap .letterList li .item p {
  font-weight: 500;
  text-align: justify;
  transition: all .1s;
}
.newsBlock .wrap .letterList li .item a:hover {
  color: var(--co-main);
}
.newsBlock .wrap .letterList li .item a:hover p {
  transform: translate(.5rem, 0);
}
/* 一覧をみる */
.newsBlock .wrap .ListBtn {
  margin-top: 4rem;
  text-align: right;
  position: absolute;
  right: 0;
  bottom: 0;
}
.newsBlock .wrap .ListBtn a {
  background: #4d4d4d;
  border-radius: 4rem 0;
  color: #fff;
  display: inline-block;
  font-size: .8em;
  font-weight: 500;
  padding: 1rem 3rem;
  position: relative;
}
.newsBlock .wrap .ListBtn a span {
  background: url("../images/arr_next.svg") no-repeat center right/1.5rem;
  padding-right: 3rem;
}
.newsBlock .wrap .ListBtn a:hover {
  background: #1d1d1d;
}
@media screen and (max-width: 1440px) {
  .newsBlock .tab_ttl_wrap .title {
    display: block;
    padding: 0 2rem 1rem;
  }
  .newsBlock .tab_ttl_wrap .title p {
    margin: 1rem;
  }
}
@media screen and (max-width: 1024px) {
  .newsBlock .tab_ttl_wrap .title h2 {
    background-size: 3rem;
    padding-left: 4.5rem;
    font-size: 1.5em;
  }
  .newsBlock .tab_ttl_wrap .tabList {
    max-width: fit-content;
    margin: 0 0 0 auto;
  }
}
@media screen and (max-width: 896px) {
  .newsBlock::before {
    height: 30rem;
  }
  .newsBlock .tab_ttl_wrap {
    display: block;
  }
  .newsBlock .tab_ttl_wrap .title {
    margin: 0;
    max-width: fit-content;
    padding: 0 0 .5rem;
  }
  .newsBlock .tab_ttl_wrap .title p {
    font-size: .9em;
    margin: .5rem;
  }
  .newsBlock .tab_ttl_wrap .tabList .tab {
    font-size: 1.6rem;
    min-width: 14rem;
    padding: 1rem 2rem;
  }
  .newsBlock .wrap .panel-group .inner {
    padding: 3rem 3rem 6rem;
  }
  .newsBlock .wrap .letterList li .item {
    font-size: .9em;
  }
}
@media screen and (max-width: 480px) {
  .newsBlock .tab_ttl_wrap {
    display: block;
  }
  .newsBlock .tab_ttl_wrap .title {
    margin: 0 auto 2rem;
  }
  .newsBlock .tab_ttl_wrap .tabList {
    border-radius: 1rem 1rem 0 0;
  }
  .newsBlock .tab_ttl_wrap .tabList .tab {
    font-size: 1.2rem;
    min-width: inherit;
    padding: 1rem 1.2rem;
  }
  .newsBlock .wrap .panel-group {
    border: .5rem solid #e6e6e6;
    border-radius: 2rem 0;
  }
  .newsBlock .wrap .letterList li + li {
    margin-top: 1rem;
  }
  .newsBlock .wrap .letterList li .item a {
    display: block;
  }
  .newsBlock .wrap .letterList li .item time {}
  .newsBlock .wrap .letterList li .item .catTag {
    margin: 0 0 0 3rem;
    width: 10rem;
  }
  .newsBlock .wrap .letterList li .item p {
    margin-top: .5rem;
  }
  .newsBlock .wrap .ListBtn {
    margin: 0;
    width: 100%;
    text-align: center;
  }
  .newsBlock .wrap .ListBtn a {
    border-radius: 0 0 1.5rem 0;
    display: block;
    width: 100%;
  }
}
/*---------------------------------
　タブ切り替えスタイル
---------------------------------*/
.tab__outer .panel {
  display: none;
}
.tab__outer .panel.is-show {
  display: block;
  animation: tabAnim ease 0.6s forwards;
  -ms-animation: tabAnim ease 0.6s forwards;
}
@keyframes tabAnim {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
/*---------------------------------

　生活支援コーディネーター日誌 + 広報誌きずな

---------------------------------*/
.newsBlock .dmWrapper {
  display: flex;
  justify-content: space-between;
  margin: 10rem 0 5rem;
}
@media screen and (max-width: 1024px) {
  .newsBlock .dmWrapper {
    margin: 6rem 0 5rem;
  }
}
@media screen and (max-width: 896px) {
  .newsBlock .dmWrapper {
    display: block;
  }
}
@media screen and (max-width: 480px) {}
/*---------------------------------
　主要リンク
---------------------------------*/
.newsBlock .dmWrapper .LinkBox {
  flex-basis: 45%;
  position: relative;
}
.newsBlock .dmWrapper .LinkBox ul {
  display: grid;
  gap: 2rem;
  list-style: none;
  margin: auto;
  height: 100%;
  width: 100%;
}
.newsBlock .dmWrapper .LinkBox ul li {
  background: #000;
  border-radius: 2rem;
  overflow: hidden;
}
.newsBlock .dmWrapper .LinkBox ul li a {
  background: var(--co-main);
  color: #fff;
  display: grid;
  align-items: center;
  padding: 2rem 4rem;
  height: 100%;
}
.newsBlock .dmWrapper .LinkBox ul li:nth-child(2) a {
  background: #f17395;
}
.newsBlock .dmWrapper .LinkBox ul li:nth-child(3) a {
  background: #f98937;
}
.newsBlock .dmWrapper .LinkBox ul li a span {
  display: block;
  font: var(--maru-go);
  font-size: 2.5rem;
  font-weight: 700;
  padding-right: 6rem;
  position: relative;
}
.newsBlock .dmWrapper .LinkBox ul li a span::after {
  background: url("../images/arr_next.svg") no-repeat center/2rem;
  border: 1px solid #ddd;
  border-radius: 50%;
  content: '';
  margin: auto;
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  width: 6rem;
  height: 6rem;
}
.newsBlock .dmWrapper .LinkBox ul li a:hover {
  opacity: .8;
}
@media screen and (max-width: 1440px) {}
@media screen and (max-width: 1024px) {
  .newsBlock .dmWrapper .LinkBox ul {
    gap: 1.5rem;
  }
  .newsBlock .dmWrapper .LinkBox ul li a span {
    font-size: 2rem;
    padding-right: 4rem;
  }
  .newsBlock .dmWrapper .LinkBox ul li a span::after {
    background-size: 1.5rem;
    width: 4rem;
    height: 4rem;
  }
}
@media screen and (max-width: 896px) {
  .newsBlock .dmWrapper .LinkBox ul {
    display: block;
  }
  .newsBlock .dmWrapper .LinkBox ul li {
    border-radius: 1rem;
    margin-bottom: 1rem;
  }
}
@media screen and (max-width: 480px) {
  .newsBlock .dmWrapper .LinkBox ul li a {
    padding: 1.5rem 2rem;
  }
  .newsBlock .dmWrapper .LinkBox ul li a span {
    font-size: 1.8rem;
  }
  .newsBlock .dmWrapper .LinkBox ul li a span::after {
    background-size: 1rem;
    width: 3rem;
    height: 3rem;
  }
}
/*---------------------------------
　広報誌きずな
---------------------------------*/
.newsBlock .dmWrapper .magazineBox {
  background: #fff;
  border-radius: 1rem;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-basis: 50%;
  padding: 3rem;
}
.newsBlock .dmWrapper .magazineBox ._txt {
  flex-basis: 53%;
}
.newsBlock .dmWrapper .magazineBox ._txt h3 {
  font: var(--maru-go);
  font-size: 2.7rem;
  font-weight: 700;
}
.newsBlock .dmWrapper .magazineBox ._txt p {
  margin: 2rem 0 5rem;
  text-align: justify;
}
.newsBlock .dmWrapper .magazineBox ._txt .btn {}
.newsBlock .dmWrapper .magazineBox ._txt .btn a {
  border-width: 2px;
}
.newsBlock .dmWrapper .magazineBox ._txt .backnumber {
  margin-top: 2rem;
}
.newsBlock .dmWrapper .magazineBox ._txt .backnumber a {
  color: var(--co-main);
  display: block;
  font-weight: 500;
  position: relative;
  padding-left: 4rem;
}
.newsBlock .dmWrapper .magazineBox ._txt .backnumber a::before {
  background: var(--co-main) url("../images/arr_next.svg") no-repeat center/1.2rem;
  border-radius: 50%;
  content: '';
  margin: auto;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  width: 3rem;
  height: 3rem;
  transform: all .3s;
}
.newsBlock .dmWrapper .magazineBox ._txt .backnumber a:hover {
  color: var(--co-sub02);
}
.newsBlock .dmWrapper .magazineBox ._txt .backnumber a:hover::before {
  background-color: var(--co-sub02);
}
.newsBlock .dmWrapper .magazineBox ._latest {
  background: #000;
  border: 1px solid #ccc;
  flex-basis: 40%;
}
.newsBlock .dmWrapper .magazineBox ._latest a {
  display: block;
}
.newsBlock .dmWrapper .magazineBox ._latest ._img {}
.newsBlock .dmWrapper .magazineBox ._latest ._img img {
  width: 100%;
  vertical-align: bottom;
}
.newsBlock .dmWrapper .magazineBox ._latest p {
  background: #00237e;
  color: #fff;
  font-size: 1.1em;
  font-weight: 600;
  padding: 1rem;
  text-align: center;
}
.newsBlock .dmWrapper .magazineBox ._latest a:hover {
  opacity: .9;
}
@media screen and (max-width: 1440px) {}
@media screen and (max-width: 1024px) {
  .newsBlock .dmWrapper .magazineBox {
    flex-basis: 50%;
    padding: 2.5rem;
  }
  .newsBlock .dmWrapper .magazineBox ._txt {
    flex-basis: 50%;
  }
  .newsBlock .dmWrapper .magazineBox ._txt p {
    font-size: .9em;
    margin: 1rem 0 3rem;
  }
}
@media screen and (max-width: 896px) {
  .newsBlock .dmWrapper .magazineBox {
    margin-top: 3rem;
  }
  .newsBlock .dmWrapper .magazineBox ._txt {
    flex-basis: 70%;
  }
  .newsBlock .dmWrapper .magazineBox ._latest {
    flex-basis: 25%;
  }
}
@media screen and (max-width: 480px) {
  .newsBlock .dmWrapper .magazineBox {
    display: block;
    padding: 2rem;
  }
  .newsBlock .dmWrapper .magazineBox ._latest {
    margin: 2rem auto 0;
    max-width: 15rem;
  }
}
/*---------------------------------

  潮来市社協のサービス

---------------------------------*/
.serviceBlock {
  background: url("../images/se_bg.jpg") no-repeat top center/cover;
  padding: 15rem 0 40rem;
  position: relative;
}
.serviceBlock::before, .serviceBlock::after {
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  content: '';
  position: absolute;
  width: 12rem;
  height: 12rem;
}
.serviceBlock::before {
  background-image: url("../images/kadomaru/b_b.svg");
  top: -12rem;
  right: 0;
}
.serviceBlock::after {
  background-image: url("../images/kadomaru/g_t.svg");
  left: 0;
  top: 0
}
.serviceBlock .wrap {
  max-width: none;
}
.serviceBlock .title {
  margin-bottom: 7rem;
}
.serviceBlock .title h2 {
  color: #fff;
}
.serviceBlock .serviceWrapper {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.serviceBlock .serviceWrapper ._box {
  border-radius: 2rem;
  box-shadow: 0 0 1rem 0 rgba(0, 0, 0, 0.3);
  flex-basis: 31%;
  margin-top: 4%;
  overflow: hidden;
}
.serviceBlock .serviceWrapper ._box a {
  background: #fff;
  display: block;
  padding: 7rem;
  position: relative;
}
.serviceBlock .serviceWrapper ._box a:hover {
  background: #EAE5EB;
}
.serviceBlock .serviceWrapper ._box a::after {
  content: '';
  position: absolute;
}
.serviceBlock .serviceWrapper ._box a ._icon {
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  display: block;
  margin: 0 auto 1rem;
  width: 19rem;
  height: 19rem;
}
.serviceBlock .serviceWrapper ._box a p.ttl {
  font: var(--maru-go);
  font-size: 1.8em;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-align: center;
}
.serviceBlock .serviceWrapper ._box:nth-child(-n+3) a::after {
  background: #000;
  border-radius: 0 0 1rem 0;
  right: 2rem;
  bottom: 2rem;
  width: 5rem;
  aspect-ratio: 1;
  clip-path: polygon(100% 0, 0 100%, 100% 100%);
}
.serviceBlock .serviceWrapper ._box:nth-last-child(-n+2) {
  flex-basis: 48%;
}
.serviceBlock .serviceWrapper ._box:nth-last-child(-n+2) a {
  display: flex;
  align-items: center;
  padding: 3rem 5rem;
}
.serviceBlock .serviceWrapper ._box:nth-last-child(-n+2) a::after {
  background: url("../images/arr_n_p.svg") no-repeat center/2rem;
  border: 1px solid #ccc;
  border-radius: 50%;
  margin: auto;
  right: 5rem;
  top: 0;
  bottom: 0;
  width: 6rem;
  height: 6rem;
}
.serviceBlock .serviceWrapper ._box:nth-last-child(-n+2) a ._icon {
  margin: 0;
  margin-right: 4rem;
  width: 10rem;
  height: 10rem;
}
.serviceBlock .serviceWrapper ._box._soudan a::after {
  background: #b168a8;
}
.serviceBlock .serviceWrapper ._box._soudan a ._icon {
  background-image: url("../images/se_i_01.svg");
}
.serviceBlock .serviceWrapper ._box._use a::after {
  background: #be2dbe;
}
.serviceBlock .serviceWrapper ._box._use a ._icon {
  background-image: url("../images/se_i_02.svg");
}
.serviceBlock .serviceWrapper ._box._join a::after {
  background: #5a2db4;
}
.serviceBlock .serviceWrapper ._box._join a ._icon {
  background-image: url("../images/se_i_03.svg");
}
.serviceBlock .serviceWrapper ._box._donation a ._icon {
  background-image: url("../images/se_i_04.svg");
}
.serviceBlock .serviceWrapper ._box._volunteer a ._icon {
  background-image: url("../images/se_i_05.svg");
}
@media screen and (max-width: 1280px) {
  .serviceBlock .serviceWrapper ._box a {
    padding: 3rem;
  }
  .serviceBlock .serviceWrapper ._box a ._icon {
    margin: 0 auto;
    width: 16rem;
    height: 16rem;
  }
  .serviceBlock .serviceWrapper ._box a p.ttl {
    font-size: 1.4em;
  }
  .serviceBlock .serviceWrapper ._box:nth-last-child(-n+2) a {
    padding: 3rem;
  }
  .serviceBlock .serviceWrapper ._box:nth-last-child(-n+2) a::after {
    background-size: 1.5rem;
    right: 3rem;
    width: 5rem;
    height: 5rem;
  }
}
@media screen and (max-width: 1024px) {
  .serviceBlock {
    padding: 10rem 0 40rem;
  }
  .serviceBlock .serviceWrapper ._box a p.ttl {
    font-size: 1.2em;
  }
  .serviceBlock .serviceWrapper ._box:nth-child(-n+3) a::after {
    right: 1rem;
    bottom: 1rem;
    width: 4rem;
  }
  .serviceBlock .serviceWrapper ._box:nth-last-child(-n+2) a ._icon {
    margin-right: 2rem;
    width: 8rem;
    height: 8rem;
  }
}
@media screen and (max-width: 896px) {
  .serviceBlock {
    padding: 7rem 0 30rem;
  }
  .serviceBlock::before {
    top: -8rem;
  }
  .serviceBlock::before, .serviceBlock::after {
    width: 8rem;
    height: 8rem;
  }
  .serviceBlock .serviceWrapper ._box a ._icon {
    margin: 0 auto;
    width: 12rem;
    height: 12rem;
  }
  .serviceBlock .serviceWrapper ._box a p.ttl {
    font-size: 1.1em;
  }
  .serviceBlock .serviceWrapper ._box:nth-last-child(-n+2) {
    flex-basis: 100%;
  }
  .serviceBlock .serviceWrapper ._box:nth-last-child(-n+2) a {
    padding: 2rem 5rem;
  }
  .serviceBlock .serviceWrapper ._box:nth-last-child(-n+2) a ._icon {
    margin-right: 2rem;
    width: 5rem;
    height: 5rem;
  }
  .serviceBlock .serviceWrapper ._box:nth-last-child(-n+2) a::after {
    right: 2rem;
    width: 4rem;
    height: 4rem;
  }
}
@media screen and (max-width: 480px) {
  .serviceBlock {
    padding: 5rem 0 13rem;
  }
  .serviceBlock::before {
    top: -5rem;
  }
  .serviceBlock::before, .serviceBlock::after {
    width: 5rem;
    height: 5rem;
  }
  .serviceBlock .serviceWrapper {
    display: block;
  }
  .serviceBlock .serviceWrapper ._box a {
    display: flex;
    align-items: center;
    padding: 3rem 2rem;
  }
  .serviceBlock .serviceWrapper ._box a ._icon {
    margin: 0;
    margin-right: 2rem;
    width: 9rem;
    height: 9rem;
  }
  .serviceBlock .serviceWrapper ._box:nth-last-child(-n+2) a {
    padding: 2rem;
  }
  .serviceBlock .serviceWrapper ._box:nth-last-child(-n+2) a ._icon {
    width: 4rem;
    height: 4rem;
  }
}
/*---------------------------------

  公式SNS

---------------------------------*/
.socialBlock {
  background: #f0f0eb;
  border-radius: 12rem 12rem 0 0;
  margin-top: -12rem;
  position: relative;
  z-index: 1;
}
.socialBlock .title {
  margin-bottom: 7rem;
}
.socialBlock .socialWrapper {
  display: flex;
  justify-content: center;
  font: var(--maru-go);
  font-weight: 700;
}
.socialBlock .socialWrapper .instaBox {
  flex-basis: 45rem;
}
.socialBlock .socialWrapper .instaBox h3 a {
  background: url("../images/sns_insta.svg") no-repeat left center/5rem;
  color: #4d4d4d;
  display: flex;
  align-items: center;
  font-size: 1.2em;
  margin-bottom: 1rem;
  height: 5rem;
  padding-left: 6rem;
}
.socialBlock .socialWrapper .instaBox .instaWrapper {
  width: 100%;
  height: 45rem;
  position: relative;
}
.socialBlock .socialWrapper .instaBox .instaWrapper .iframeBody {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.socialBlock .socialWrapper .instaBox .instaWrapper .iframeBody iframe {
  border: none;
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
}
.socialBlock .socialWrapper .snsList {
  flex-basis: 37rem;
  list-style: none;
  margin-left: 10rem;
}
.socialBlock .socialWrapper .snsList li {
  margin-bottom: 2rem;
}
.socialBlock .socialWrapper .snsList li a {
  background: #fff;
  border: 5px solid #e6e6e6;
  border-radius: 5rem;
  display: block;
  padding: 2rem 7rem;
}
.socialBlock .socialWrapper .snsList li a:hover {
  background: #f3f3f3;
}
.socialBlock .socialWrapper .snsList li a span {
  background-repeat: no-repeat;
  background-position: center left;
  background-size: 5rem;
  display: flex;
  align-items: center;
  font-size: 1.2em;
  height: 5rem;
  padding-left: 8rem;
}
.socialBlock .socialWrapper .snsList li._insta a span {
  background-image: url("../images/sns_insta.svg");
}
.socialBlock .socialWrapper .snsList li._x a span {
  background-image: url("../images/sns_x.svg");
}
.socialBlock .socialWrapper .snsList li._fb a span {
  background-image: url("../images/sns_facebook.svg");
}
.socialBlock .socialWrapper .snsList li._line a span {
  background-image: url("../images/sns_line.svg");
}
.socialBlock .socialWrapper .snsList li._yt a span {
  background-image: url("../images/sns_youtube.svg");
}
/* -- SNSリンクのみ -- */
.socialBlock .socialWrapper .snsList._width100 {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  flex-basis: 100%;
  margin-left: 0;
}
.socialBlock .socialWrapper .snsList li {
  flex-basis: calc(100%/3 - 2rem);
  margin: 0 1rem;
  margin-bottom: 2rem;
}
@media screen and (max-width: 1024px) {
  .socialBlock .socialWrapper .snsList {
    flex-basis: 33rem;
    margin-left: 5rem;
  }
}
@media screen and (max-width: 896px) {
  .socialBlock {
    border-radius: 10rem 10rem 0 0;
    margin-top: -10rem;
  }
  .socialBlock .title {
    margin-bottom: 5rem;
  }
  .socialBlock .socialWrapper .instaBox {
    flex-basis: 40rem;
  }
  .socialBlock .socialWrapper .instaBox h3 {
    background-size: 4rem;
    height: 4rem;
    padding-left: 6rem;
  }
  .socialBlock .socialWrapper .instaBox .instaWrapper {
    height: 40rem;
    margin: 1rem 0;
  }
  .socialBlock .socialWrapper .snsList {
    flex-basis: 37rem;
  }
  .socialBlock .socialWrapper .snsList li a {
    padding: 2rem 4rem;
  }
  .socialBlock .socialWrapper .snsList li a span {
    background-size: 4rem;
    font-size: 1.1em;
    height: 4rem;
    padding-left: 6rem;
  }
}
@media screen and (max-width: 480px) {
  .socialBlock {
    border-radius: 5rem 5rem 0 0;
    margin-top: -5rem;
  }
  .socialBlock .socialWrapper {
    display: block;
  }
  .socialBlock .socialWrapper .instaBox .instaWrapper {
    height: 30rem;
    margin: 2rem 0;
  }
  .socialBlock .socialWrapper .snsList {
    margin: 3rem auto 0;
  }
  .socialBlock .socialWrapper .snsList li {
    margin-bottom: 0.5rem;
  }
}
/*---------------------------------
  バナー
---------------------------------*/
.socialBlock .bunnerWrapper {
  margin-top: 10rem;
}
.socialBlock .bunnerWrapper #bunner-slider {}
.socialBlock .bunnerWrapper #bunner-slider .bu {}
.socialBlock .bunnerWrapper #bunner-slider .bu a {
  display: block;
}
.socialBlock .bunnerWrapper #bunner-slider .bu a img {
  border: 1px solid #ccc;
  width: 100%;
  height: auto;
  vertical-align: bottom;
}
.socialBlock .bunnerWrapper .splide-controller {
  margin: 5rem auto;
  max-width: fit-content;
  padding: 0 7rem;
  position: relative;
}
.socialBlock .bunnerWrapper .splide-controller .splide__pagination {
  display: block;
}
.socialBlock .bunnerWrapper .splide-controller .splide__pagination li {
  margin: 0 .5rem;
}
.socialBlock .bunnerWrapper .splide-controller .splide__pagination li .splide__pagination__page {
  background: #ccc;
  border: none;
  border-radius: 50%;
  width: 1.3rem;
  height: 1.3rem;
  vertical-align: bottom;
}
.socialBlock .bunnerWrapper .splide-controller .splide__pagination li .splide__pagination__page.is-active {
  background: var(--co-main);
}
.socialBlock .bunnerWrapper .splide-controller .splide__arrows {}
.socialBlock .bunnerWrapper .splide-controller .splide__arrows .splide__arrow {
  background-position: center;
  background-repeat: no-repeat;
  background-size: 2rem;
  background-color: #4d4d4d;
  border: none;
  border-radius: 50%;
  cursor: pointer;
  margin: auto;
  position: absolute;
  top: 0;
  bottom: 0;
  width: 5rem;
  height: 5rem;
  vertical-align: bottom;
}
.socialBlock .bunnerWrapper .splide-controller .splide__arrows .splide__arrow svg {
  display: none;
}
.socialBlock .bunnerWrapper .splide-controller .splide__arrows .splide__arrow.splide__arrow--prev {
  background-image: url("../images/arr_prev.svg");
  left: 0;
}
.socialBlock .bunnerWrapper .splide-controller .splide__arrows .splide__arrow.splide__arrow--next {
  background-image: url("../images/arr_next.svg");
  right: 0;
}
@media screen and (max-width: 1440px) {}
@media screen and (max-width: 1024px) {}
@media screen and (max-width: 896px) {}
@media screen and (max-width: 480px) {}
/*---------------------------------
  404
---------------------------------*/
.notfoundBlock {
  background: #f0f0eb;
  padding: 25rem 0 12rem;
  text-align: center;
}
.notfoundBlock .wrap .title {
  margin-bottom: 5rem;
}
.notfoundBlock .wrap .title h2 span {
  display: inline-block;
}
.notfoundBlock .wrap .txt {
  line-height: 2;
}
.notfoundBlock .btn {
  margin: 5rem auto 0;
  text-align: left;
}
@media screen and (max-width: 1440px) {}
@media screen and (max-width: 1024px) {
  .notfoundBlock {
    padding: 15rem 0 12rem;
  }
}
@media screen and (max-width: 896px) {
  .notfoundBlock {
    padding: 10rem 0 12rem;
  }
  .notfoundBlock .wrap .title {
    margin-bottom: 3rem;
  }
}
@media screen and (max-width: 480px) {}