/*====================================================
////id |  flow
====================================================*/
.flow-item-wrapper {
 display: flex;
 gap: 24px;
}

.flow-item {
 background: #fff;
 border-radius: 12px;
 flex: 1;
 padding: 30px 20px;
}

.flow-item-img {
 margin: auto;
 position: relative;
 width: 105px;
}

.flow-item-img .coverImg {
 border-radius: 12px;
 padding-top: 100%;
}

.flow-item-no {
 background: #013188;
 border-radius: 100%;
 color: #fff;
 display: flex;
 align-items: center;
 justify-content: center;
 font-size: 1.6rem;
 font-weight: 700;
 margin: auto;
 position: absolute;
 top: -.75em;
 left: -.75em;
 width: 2.5em;
 height: 2.5em;
 z-index: 10;
}

.flow-text {
 font-size: 1.8rem;
 margin-top: 24px;
 text-align: center;
}

.flow-text .title {
 color: #013188;
 font-weight: 700;
 line-height: 1.4;
}

.flow-text>div>.text {
 font-size: 1.4rem;
 margin-top: 10px;
}

.flow-text .link {
 display: flex;
 justify-content: center;
 font-size: 1.4rem;
 margin-top: 10px;
}

/* ////////// mobile ////////// */
@media screen and (max-width: 769.0px) {
 .flow-item-wrapper {
  flex-direction: column;
  margin: auto;
  max-width: 500px;
 }
}

/* ////////// PC ////////// */
@media print,
screen and (min-width: 769.1px) {
 .flow-text {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 3.2em;
 }
}


/*====================================================
////id |  detail
====================================================*/
.detail-item-wrapper {
 display: grid;
 grid-gap: 20px;
 margin-top: 20px;
}



.detail-item {
 background: #fff;
 border-radius: 12px;
 box-shadow: 0 4px 10px rgba(0, 0, 0, .05);
 display: grid;
 grid-gap: 18px;
 place-items: start;
 align-self: start;
 padding: 32px;
}

.detail-item-title {
 display: flex;
 align-items: center;
 gap: .8em;
 font-size: 2rem;
 font-weight: 700;
}

.detail-item-title .title {
 flex: 1;
}

.detail-item-title .img {
 width: 60px;
}

.detail-item-title .img .coverImg {
 border-radius: 100%;
 padding-top: 100%;
}

.detail-list {
 display: grid;
 grid-gap: 18px;
}

.detail-list dt {
 font-size: 1.6rem;
 font-weight: 700;
 margin-bottom: .3em;
}

.detail-list dd {
 font-size: 1.4rem;
}

/* ////////// mobile ////////// */
@media screen and (max-width: 960.0px) {
 .detail-inner {
  margin-top: -64px;
 }

}

/* ////////// PC ////////// */
@media print,
screen and (min-width: 960.1px) {
 .detail-inner {
  margin-top: -96px;
 }

 .detail-item-wrapper {
  grid-template-columns: 1fr 1fr;
  align-items: start;
 }

 .one-fr {
  grid-template-columns: 1fr;
 }

 .three-fr {
  grid-template-columns: 1fr 1fr 1fr;
 }
}

@media (hover: hover) {}



/*====================================================
////id |  xxx
====================================================*/

/* ////////// mobile ////////// */
@media screen and (max-width: 769.0px) {}

/* ////////// PC ////////// */
@media print,
screen and (min-width: 769.1px) {}

@media (hover: hover) {}


.nav-item-wrapper {
 display: flex;
 flex-wrap: wrap;
 gap: 14px;
}

.nav-item {
 display: flex;
 align-items: center;
 gap: .55em;
 font-weight: 600;
}

.nav-item .arrow {
 transform: rotate(90deg);
}

/* ////////// mobile ////////// */
@media screen and (max-width: 769.0px) {
 .nav-item-wrapper {}
}

/* ////////// PC ////////// */
@media print,
screen and (min-width: 769.1px) {
 .nav-item-wrapper {}

}

@media screen and (min-width:1200px) {
 .nav-item-wrapper {
  gap: 14px;
 }
}
