@charset "UTF-8";

@font-face {
  font-family: Noto Sans JP;
  font-style: normal;
  font-weight: 400;
  src: url(../../assets/fonts/NotoSansJP-Regular.woff2) format("woff2");
  font-display: swap
}

@font-face {
  font-family: Noto Sans JP;
  font-style: normal;
  font-weight: 500;
  src: url(../../assets/fonts/NotoSansJP-SemiBold.woff2) format("woff2");
  font-display: swap
}

@font-face {
  font-family: Noto Sans JP;
  font-style: normal;
  font-weight: 700;
  src: url(../../assets/fonts/NotoSansJP-Bold.woff2) format("woff2");
  font-display: swap
}

@font-face {
  font-family: Roboto;
  font-style: normal;
  font-weight: 400;
  src: url(../../assets/fonts/Roboto-Regular.woff2) format("woff2");
  font-display: swap
}

@font-face {
  font-family: Roboto;
  font-style: normal;
  font-weight: 500;
  src: url(../../assets/fonts/Roboto-Medium.woff2) format("woff2");
  font-display: swap
}

@font-face {
  font-family: Roboto;
  font-style: normal;
  font-weight: 700;
  src: url(../../assets/fonts/Robot-Bold.woff2) format("woff2");
  font-display: swap
}

html.is-fixed,
html.is-fixed .kvSec {
  overflow: hidden
}

body {
  position: relative;
  font-family: Noto Sans JP, sans-serif;
  font-size: 20px;
  font-weight: 700;
  -webkit-font-feature-settings: "palt" on;
  font-feature-settings: "palt" on;
  line-height: 1.8;
  color: #231815;
  letter-spacing: .05em;
  background: url(../images/BG_workshop.png) repeat-y top/100%;
}

body * {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale
}

body *:focus {
  outline: none
}

body * img {
  width: 100%;
  max-width: 100%;
  height: auto;
}

body main {
  position: relative;
  margin: auto
}

:root {
  --accent: 136, 58, 234;
  --accent-light: 224, 204, 250;
  --accent-dark: 49, 10, 101;
  --accent-gradient: linear-gradient(45deg, rgb(var(--accent)), rgb(var(--accent-light)) 30%, white 60%)
}

code {
  font-family: Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace
}

@media screen and (width >=769px) {
  .pc-none {
    display: none !important
  }
}

@media screen and (width <=768px) {
  .sp-none {
    display: none !important
  }
}

.dashed {
  position: relative
}

.dashed:before {
  position: absolute;
  top: 100%;
  width: 100%;
  height: 2px;
  content: "";
  background: -webkit-repeating-linear-gradient(left, #cfeeff, #cfeeff 4px, transparent 4px, transparent 8px);
  background: repeating-linear-gradient(to right, #cfeeff, #cfeeff 4px, transparent 4px, transparent 8px);
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%)
}

.c-button {
  max-width: 330px;
  margin: auto;
  text-align: center
}

.c-button-inr {
  display: inline-block;
  width: 100%;
  padding: .75rem 1.5rem;
  font-size: 14px;
  font-weight: 700;
  text-align: center;
  border-radius: 100px;
  -webkit-transition: background-color .3s, color .3s;
  transition: background-color .3s, color .3s
}

.c-button-apply {
  color: #fff;
  background: #df2e6a;
  box-shadow: 0 5px #991944
}

.c-button-apply-closed {
  color: #8f8f8f;
  background-color: #dcdcdc
}

@media screen and (width >=769px) {
  .c-button-apply:hover {
    box-shadow: none;
    -webkit-transform: translateY(4px);
    transform: translateY(4px)
  }
}

.c-button-last {
  margin-bottom: 20px;
  color: #fff;
  background: #0086d1;
  box-shadow: 0 5px #00598b
}

@media screen and (width >=769px) {
  .c-button-last:hover {
    box-shadow: none;
    -webkit-transform: translateY(4px);
    transform: translateY(4px)
  }
}

.c-card {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(24ch, 1fr));
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  padding: 0 min(80px, 5.5555555556vw)
}

@media screen and (width <=768px) {
  .c-card {
    grid-template-columns: 1fr;
    padding: 0 28px
  }
}

.c-card__contDetail {
  max-width: 20.8333333333vw;
  margin: 0 auto
}

@media screen and (width <=1010px) {
  .c-card__contDetail {
    max-width: 250px
  }
}

@media screen and (width <=768px) {
  .c-card__contDetail.u-alt {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
  }
}

.c-card__cont {
  position: relative;
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;
  background: #fff;
  border: 3px solid #4e2020;
  border-radius: 9px
}

.c-card__cont-note {
  font-size: 12px;
  font-weight: 600;
  text-align: center
}

.c-card__contBadge {
  position: absolute;
  top: -8%;
  right: -8%;
  z-index: 1;
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  justify-content: center;
  aspect-ratio: 1/1;
  padding: 8px 14px;
  font-size: 20px;
  font-weight: 700;
  color: #fff;
  text-align: center;
  background-color: #df2e6a;
  border-radius: 100px
}

.c-card__contBadge :after {
  position: absolute;
  bottom: -10%;
  left: 20%;
  content: "";
  border-top: 40px solid #df2e6a;
  border-right: 12px solid transparent;
  border-left: 12px solid transparent;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg)
}

@media screen and (width <=768px) {
  .c-card__contBadge {
    top: -7%;
    right: -5%;
    font-size: 18px
  }
}

.c-card__contBadge--txt {
  line-height: 1.3
}

.c-card__contHead {
  padding: .2rem .5rem;
  line-height: 0;
  background: #bdd1ea;
  border-bottom: 3px solid #4e2020;
  border-radius: 5px 5px 0 0
}

.c-card__contMain {
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;
  -webkit-box-pack: justify;
  justify-content: space-between;
  height: 100%;
  padding: 32px 45px 40px
}

@media screen and (width <=768px) {
  .c-card__contMain {
    padding: 30px 16px 40px
  }
}

.c-card__contMain--top {
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;
  gap: 32px
}

.c-card__contMain--ttl {
  display: -webkit-box;
  display: flex;
  border-bottom: none;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  padding-top: 0;
  flex-direction: column;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  justify-content: center;
  height: 82px;
  font-size: clamp(16px, 2.2222222222vw, 32px);
  font-weight: 700;
  line-height: 1.2;
  color: #0086d1;
  text-align: center
}

@media screen and (width <=768px) {
  .c-card__contMain--ttl {
    margin-bottom: 32px;
    font-size: 34px
  }
}

.c-card__contMain--text {
  font-size: min(14px, .9722222222vw);
  font-weight: 700;
  color: #231815;
  text-align: center
}

@media screen and (width <=768px) {
  .c-card__contMain--text {
    font-size: 14px;
    text-align: left
  }
}

.c-card__contMain--msg {
  margin-top: 12px;
  font-size: 12px;
  color: #231815;
  text-align: center
}

.c-card__contMainDate--inr {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto
}

.c-card__contMainDate--txt {
  display: inline-block;
  padding: .3rem;
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
  color: #0086d1;
  border: 1px solid #0086d1;
  border-radius: 4px
}

@media screen and (width <=768px) {
  .c-card__contMainDate--txt {
    font-size: 12px
  }
}

.c-card__contMainDate--txt .robot {
  font-family: Roboto, sans-serif;
  font-size: 16px;
  font-weight: 500
}

.c-card__contMainDate--date {
  font-size: clamp(12px, 1.25vw, 18px);
  letter-spacing: 0
}

@media screen and (width <=768px) {
  .c-card__contMainDate--date {
    font-size: 18px
  }
}

.c-card__contMainDate .u-num {
  font-family: Roboto, sans-serif;
  font-size: clamp(22px, 1.9444444444vw, 28px);
  font-weight: 600;
  color: #0086d1
}

@media screen and (width <=768px) {
  .c-card__contMainDate .u-num {
    font-size: 28px
  }
}

.c-card__contMainDate--notes {
  margin-top: 1.6666666667vw;
  font-size: 12px;
  text-align: center
}

.c-card__contMainDate--overviewNotes {
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 40px
}

.c-card__contMainDate--overviewNote {
  position: relative;
  padding-left: 1rem;
  font-size: 12px
}

.c-card__contMainDate--overviewNote:before {
  position: absolute;
  top: 0;
  left: 0;
  font-size: 12px;
  content: "※"
}

.c-card__contMainDate--overviewNote .highlight {
  display: block;
  font-size: 11px;
  font-weight: 400;
  color: #7e7e7e
}

.c-card__contMainDate--overviewNote.u-alt {
  margin: auto;
  font-size: 11px
}

.c-card__desc {
  margin-bottom: 24px;
  font-size: 14px
}

.c-card__desc--item {
  position: relative;
  padding-left: 1rem
}

.c-card__desc--item:before {
  position: absolute;
  top: 23%;
  left: 0;
  width: 14px;
  height: 25px;
  content: "";
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="25" viewBox="0 0 14 25" fill="none"><path d="M9.50385 11.8359C10.6913 12.6275 10.6913 14.3725 9.50385 15.1641L3.1094 19.4271C1.78029 20.3131 1.28734e-06 19.3604 1.35879e-06 17.763L7.86507e-07 9.23703C8.57962e-07 7.63964 1.78029 6.68686 3.1094 7.57293L9.50385 11.8359Z" fill="%2373C0D4"/></svg>') no-repeat center;
  background-size: contain;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%)
}

.c-card__listStep {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-bottom: 24px;
  margin: 0 auto 24px
}

@media screen and (width <=768px) {
  .c-card__listStep {
    padding: 0 12px
  }
}

.c-card__listStep.u-1 .c-card__listStep--item {
  padding-left: 35px;
  counter-increment: step
}

@media screen and (width <=1100px) {
  .c-card__listStep.u-1 .c-card__listStep--item {
    padding-left: 30px
  }
}

.c-card__listStep.u-1 .c-card__listStep--item:before {
  position: absolute;
  top: 0;
  left: 0;
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
  font-family: Roboto, sans-serif;
  font-size: 18px;
  font-weight: 700;
  color: #73c0d4;
  content: "0" counter(step) ".";
  border-radius: 50%
}

@media screen and (width <=1100px) {
  .c-card__listStep.u-1 .c-card__listStep--item:before {
    font-size: 18px
  }
}

.c-card__listStep.u-2 .c-card__stepInfo {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  justify-content: center;
  width: clamp(46px, 3.1944444444vw, 46px);
  height: max(20px, 1.3888888889vw);
  margin-right: 10px;
  line-height: 1;
  color: #fff;
  background-color: #73c0d4;
  -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 46 19" ><path d="M39.5996 0.813602C39.2227 0.302003 38.625 0 37.9895 0H2.00012C0.895553 0 0.00012207 0.895431 0.00012207 2V17C0.00012207 18.1046 0.895552 19 2.00012 19H37.9895C38.625 19 39.2227 18.698 39.5996 18.1864L45.1259 10.6864C45.6458 9.98089 45.6458 9.01911 45.1259 8.3136L39.5996 0.813602Z"/></svg>') no-repeat center;
  mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 46 19" ><path d="M39.5996 0.813602C39.2227 0.302003 38.625 0 37.9895 0H2.00012C0.895553 0 0.00012207 0.895431 0.00012207 2V17C0.00012207 18.1046 0.895552 19 2.00012 19H37.9895C38.625 19 39.2227 18.698 39.5996 18.1864L45.1259 10.6864C45.6458 9.98089 45.6458 9.01911 45.1259 8.3136L39.5996 0.813602Z"/></svg>') no-repeat center
}

@media screen and (width <=768px) {
  .c-card__listStep.u-2 .c-card__stepInfo {
    width: 46px;
    height: 20px
  }
}

.c-card__listStep.u-2 .c-card__stepInfo--num {
  font-family: Roboto, sans-serif;
  font-size: clamp(14px, 1.1111111111vw, 16px)
}

@media screen and (width <=768px) {
  .c-card__listStep.u-2 .c-card__stepInfo--num {
    font-size: 16px
  }
}

.c-card__listStep.u-2 .c-card__stepInfo--txt {
  font-size: clamp(10px, .6944444444vw, 12px)
}

@media screen and (width <=768px) {
  .c-card__listStep.u-2 .c-card__stepInfo--txt {
    font-size: 10px
  }
}

.c-card__listStep.u-2 .c-card__listStep--item {
  line-height: 1.8;
  counter-increment: step
}

.c-card__listStep.u-3 .c-card__stepDate {
  width: 110px
}

@media screen and (width <=768px) {
  .c-card__listStep.u-3 .c-card__stepDate {
    width: 110px
  }
}

.c-card__listStep.u-3 .c-card__stepDiv {
  letter-spacing: .4em
}

.c-card__listStep.u-3 .c-card__listStep--item {
  padding-left: 1rem;
  font-size: 14px
}

.c-card__listStep.u-3 .c-card__listStep--item:before {
  position: absolute;
  top: 50%;
  left: 0;
  width: 14px;
  height: 25px;
  content: "";
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="25" viewBox="0 0 14 25" fill="none"><path d="M9.50385 11.8359C10.6913 12.6275 10.6913 14.3725 9.50385 15.1641L3.1094 19.4271C1.78029 20.3131 1.28734e-06 19.3604 1.35879e-06 17.763L7.86507e-07 9.23703C8.57962e-07 7.63964 1.78029 6.68686 3.1094 7.57293L9.50385 11.8359Z" fill="%2373C0D4"/></svg>') no-repeat center;
  background-size: contain;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%)
}

.c-card__listStep--item {
  position: relative;
  display: -webkit-box;
  display: flex;
  font-size: clamp(14px, .9722222222vw, 14px)
}

@media screen and (width <=768px) {
  .c-card__listStep--item {
    font-size: 14px
  }
}

.c-card__listStep--item:before {
  position: absolute;
  top: 0;
  left: 0;
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
  font-weight: 700
}

.c-info {
  position: relative;
  max-width: 1550px;
  padding: 0 80px;
  margin: 60px auto 0;
  border-radius: 8px
}

@media screen and (width <=768px) {
  .c-info {
    padding: 0 28px
  }
}

.c-info .corner {
  position: absolute;
  right: 0;
  bottom: 0;
  display: block;
  width: 20px;
  height: 20px;
  -webkit-transform: translateX(100%);
  transform: translate(100%)
}

.c-info .corner:before {
  position: absolute;
  top: -2px;
  right: 0;
  display: block;
  width: 200%;
  height: 200%;
  overflow: hidden;
  content: "";
  background: transparent;
  border-radius: 20%;
  box-shadow: -20px 20px #fff;
  -webkit-transform: translate(50%, -50%);
  transform: translate(50%, -50%)
}

.c-info__title {
  position: relative;
  z-index: 2;
  box-sizing: border-box;
  float: left;
  width: auto;
  padding: 1rem 2rem 8px;
  font-size: 16px;
  line-height: 1.1;
  text-align: center;
  background-color: #fff;
  border-radius: 8px 8px 0 0;
  -webkit-transition: all .2s ease;
  transition: all .2s ease
}

.c-info__cont {
  position: relative;
  top: -2px;
  padding: 32px 30px;
  clear: both;
  background: #fff;
  border-radius: 0 8px 8px
}

.c-info__logo {
  width: 210px;
  height: 33px
}

@media screen and (width >=769px) {
  .c-info__logo {
    -webkit-transition: opacity .3s ease;
    transition: opacity .3s ease
  }

  .c-info__logo:hover {
    opacity: .8
  }
}

.c-info__logo img {
  max-height: 50px
}

.c-info__contact {
  padding-top: 30px
}

@media screen and (width <=768px) {
  .c-info__contact {
    padding-top: 24px
  }
}

.c-info__contact--title {
  margin-bottom: 24px;
  font-size: 16px;
  font-weight: 700;
  line-height: 1
}

.c-info__contact--inr {
  display: -webkit-box;
  display: flex;
  gap: 8px;
  -webkit-box-align: end;
  align-items: flex-end;
  -webkit-box-pack: justify;
  justify-content: space-between;
  font-size: .9rem
}

@media screen and (width <=768px) {
  .c-info__contact--inr {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-align: center;
    align-items: center;
    word-break: break-all
  }
}

.c-info__contact--wrap {
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 24px
}

@media screen and (width <=768px) {
  .c-info__contact--wrap {
    margin-right: auto
  }
}

.c-info__contact--dept,
.c-info__contact--email {
  display: -webkit-box;
  display: flex;
  gap: 8px;
  -webkit-box-align: center;
  align-items: center;
  font-size: .9rem
}

@media screen and (width <=768px) {

  .c-info__contact--dept,
  .c-info__contact--email {
    -webkit-box-align: start;
    align-items: flex-start
  }
}

.c-info__list {
  padding: 0;
  margin-bottom: 22px;
  list-style: none
}

.c-info__list--item {
  position: relative;
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  padding-left: 1.5rem;
  margin-bottom: 8px;
  font-size: 1rem
}

.c-info__list--item:before {
  position: absolute;
  left: 0;
  width: 10px;
  height: 10px;
  font-size: 1.5rem;
  content: "";
  background-color: #73c0d4;
  border-radius: 50%
}

@media screen and (width <=768px) {
  .c-info__list--item:before {
    top: 8px
  }
}

@media screen and (width <=768px) {
  .c-info__list--item {
    font-size: .9rem
  }
}

.c-label {
  position: relative;
  margin-bottom: 24px;
  text-align: center
}

@media screen and (width <=768px) {
  .c-label {
    margin-bottom: 24px
  }
}

.c-label--dashed:before,
.c-label--dashed:after {
  position: absolute;
  top: 50%;
  width: 50%;
  height: 2px;
  content: "";
  background: -webkit-repeating-linear-gradient(left, #cfeeff, #cfeeff 4px, transparent 4px, transparent 8px);
  background: repeating-linear-gradient(to right, #cfeeff, #cfeeff 4px, transparent 4px, transparent 8px);
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%)
}

.c-label--dashed:before {
  left: 0
}

.c-label--dashed:after {
  right: 0
}

.c-label-inr {
  position: relative;
  z-index: 2;
  display: inline-block;
  width: auto;
  background: #cfeeff;
  border-radius: 100px
}

.c-label-text {
  padding: 3px 16px;
  font-size: 14px;
  font-weight: 700;
  color: #007bc0;
  text-align: center
}

.p-top {
  position: relative;
  padding-bottom: 4.1666666667vw
}

@media screen and (width <=768px) {
  .p-top {
    padding-bottom: 40px
  }
}

.p-top:before {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  display: block;
  width: 100%;
  height: 100%;
  content: "";
  background-image: url(../../assets/images/top_bg.svg);
  background-repeat: repeat-y;
  background-attachment: fixed;
  background-position: 0% 4%;
  background-size: cover
}

.p-top__top {
  max-width: 1550px;
  margin: 0 auto
}

.p-top__kv-fig img {
  width: 100%
}

.p-top__about {
  margin: min(120px, 8.3333333333vw) min(106px, 7.3611111111vw)
}

@media screen and (width <=768px) {
  .p-top__about {
    margin: 70px 40px 110px
  }
}

.p-top__about-inr {
  display: -webkit-box;
  display: flex;
  gap: min(52px, 3.6111111111vw)
}

@media screen and (width <=768px) {
  .p-top__about-inr {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column
  }
}

.p-top__about-figwrap {
  width: min(487px, 33.8194444444vw)
}

.p-top__about-figwrap img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
  object-fit: contain
}

@media screen and (width <=768px) {
  .p-top__about-figwrap {
    width: 100%
  }
}

.p-top__about-cont-lead {
  -webkit-box-flex: 1;
  flex: 1;
  font-size: clamp(10px, 1.25vw, 18px);
  font-weight: 700
}

@media screen and (width <=768px) {
  .p-top__about-cont-lead {
    text-align: center
  }
}

.p-top__about-cont-lead p {
  margin-top: 1rem;
  line-height: 1.8
}

.p-top__about-cont-lead p:first-of-type {
  margin-top: 0
}

.p-top__about-cont-lead strong {
  color: #0086d1;
  background: -webkit-linear-gradient(rgb(255, 255, 255) 0%, rgba(255, 255, 255, .7) 0%);
  background: linear-gradient(rgb(255, 255, 255) 0%, rgba(255, 255, 255, .7) 0%)
}

@media screen and (width <=768px) {
  .p-top__about-cont-lead {
    font-size: 14px
  }
}

.p-workshop {
  width: 100%;
  position: relative;
  padding: 100px 0;
}

@media screen and (width <=768px) {
  .p-workshop {
    padding: 50px 0;
  }
}

/* .p-workshop:before {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  display: block;
  width: 100%;
  height: 100%;
  content: "";
  background-image: url(../../assets/images/workshop_bg.svg);
  background-repeat: repeat-y;
  background-attachment: fixed;
  background-position: 0% 4%;
  background-size: cover
} */

.p-workshop .c-info {
  padding: 0 0 0
}

@media screen and (width <=768px) {
  .p-workshop .c-info {
    padding: 0 28px
  }
}

.p-workshop__inr {
  max-width: 980px;
  margin: 0 auto
}

.p-workshop__inr--head {
  padding-top: 30px;
  margin-left: -10%
}

@media screen and (width <=1100px) {
  .p-workshop__inr--head {
    padding: 20px 0 0;
    margin-left: 4%
  }
}

.p-workshop__inr--head img {
  width: 336px;
  height: 176.197px
}

@media screen and (width <=768px) {
  .p-workshop__inr--head img {
    width: 220.41px;
    height: 110.999px
  }
}

.p-workshop__header {
  padding: 0 0 50px;
  text-align: center
}

@media screen and (width <=768px) {
  .p-workshop__header {
    padding: 0 0 60px
  }
}

.p-workshop__header h1 {
  /* font-size: 48px;
  line-height: 1.4;
  color: #0086d1 */
  width: 500px;
  margin: auto;
}

@media screen and (width <=500px) {
  .p-workshop__header h1 {
    width: 100%;
  }
}

.p-workshop .p-workshopCont {
  padding: 50px 80px;
  margin-bottom: 20px;
  background-color: #fff;
  border-radius: 40px
}

@media screen and (width <=768px) {
  .p-workshop .p-workshopCont {
    width: calc(100% - 56px);
    margin: auto;
    padding: 60px 28px;
    border-radius: 20px 20px 0 0
  }
}

.p-workshop .p-workshopCont h2 {
  font-size: 20px;
  font-weight: 700
}

.p-workshop .p-workshopCont__intro {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: end;
  align-items: end;
  margin-bottom: 8px;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.8;
  color: #231815
}

@media screen and (width <=768px) {
  .p-workshop .p-workshopCont__intro {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    gap: 32px;
    margin-bottom: 46px
  }
}

.p-workshop .p-workshopCont__intro--text {
  -webkit-box-flex: 1;
  flex: 1;
  padding-bottom: 30px
}

.p-workshop .p-workshopCont__intro--text p {
  margin-top: 24px
}

@media screen and (width <=768px) {
  .p-workshop .p-workshopCont__intro--text p {
    font-size: 14px
  }
}

.p-workshop .p-workshopCont__intro--text p:first-of-type {
  margin-top: 0
}

.p-workshop .p-workshopCont__intro--img {
  width: 266px
}

@media screen and (width <=768px) {
  .p-workshop .p-workshopCont__intro--img {
    width: 100%
  }
}

.p-workshop .p-workshopCont__list {
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;
  gap: 60px;
  padding-top: 56px
}

@media screen and (width <=768px) {
  .p-workshop .p-workshopCont__list {
    gap: 40px;
    padding-top: 46px;
    margin-top: 46px
  }
}

.p-workshop .p-workshopCont__list--item {
  position: relative;
  /* padding-left: 3rem; */
  counter-increment: section
}

/* .p-workshop .p-workshopCont__list--item:before {
  position: absolute;
  top: 0;
  left: 0;
  font-family: Roboto, sans-serif;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.3;
  color: #0086d1;
  letter-spacing: 0;
  content: "0" counter(section) "."
} */

/* @media screen and (width <=768px) {
  .p-workshop .p-workshopCont__list--item:before {
    left: -3%;
    font-size: 20px;
    line-height: 1
  }
} */

.p-workshop .p-workshopCont__list--item h2 {
  margin-bottom: 8px;
  font-size: 20px;
  line-height: 1.3
}

@media screen and (width <=768px) {
  .p-workshop .p-workshopCont__list--item h2 {
    font-size: 16px
  }
}

.p-workshop .p-workshopCont__list--item .listCont {
  font-size: 16px;
  font-weight: 400;
  line-height: 1.8
}

@media screen and (width <=768px) {
  .p-workshop .p-workshopCont__list--item .listCont {
    font-size: 14px
  }
}

.p-workshop .p-workshopCont__list--item .listCont p {
  margin-top: 24px
}

.p-workshop .p-workshopCont__list--item .listCont p:first-of-type {
  margin-top: 0
}

.p-workshop .p-workshopCont__list--item .listCont__note {
  margin-top: 0 !important;
  font-size: 12px;
  font-weight: 400
}

.p-workshop .p-workshopCont__list--item .listCont__grid {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 8px 0;
  margin-top: 24px;
  font-size: 16px;
  line-height: 1.8
}

@media screen and (width <=768px) {
  .p-workshop .p-workshopCont__list--item .listCont__grid {
    margin-bottom: 8px;
    font-size: 14px
  }
}

.p-workshop .p-workshopCont__list--item .listCont__grid--item {
  display: contents
}

.p-workshop .p-workshopCont__list--item .listCont__grid--label,
.p-workshop .p-workshopCont__list--item .listCont__grid--value {
  align-self: start
}

.p-workshop .p-workshopCont__list--item .listCont .c-button {
  margin: 32px auto;
  letter-spacing: 0
}

@media screen and (width <=768px) {
  .p-workshop .p-workshopCont__list--item .listCont .c-button {
    max-width: 315px
  }
}

.p-workshop .button {
  display: inline-block;
  padding: 10px 20px;
  margin: 10px 0;
  font-size: 16px;
  color: #fff;
  text-align: center;
  text-decoration: none;
  background-color: #f50057;
  border-radius: 5px
}

.p-workshop__contact {
  padding: 20px;
  background-color: #e0e0e0;
  border-radius: 10px
}

.p-workshop__contact p {
  margin: 0
}


body {
  margin: 0;
  padding: 0;
  font-family: 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', Meiryo, sans-serif;
}

span.required {
  font-size: 0.75rem;
  margin-left: 4px;
  color: #dd0000;
}

.caption {
  font-size: 0.86rem;
  margin-top: 4px;
  color: #aaa;
}

a.link {
  color: #1000ff;
  text-decoration: underline;
}

@media screen and (min-width: 768px) {
  header {
    width: 1200px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 10px;
    clear: both;
  }

  main {
    width: 1200px;
    margin-left: auto;
    margin-right: auto;
    clear: both;
  }

  footer {
    width: 100%;
    background-color: #ddd;
    margin-top: 80px;
    clear: both;
  }

  h1 {
    font-size: 28px;
    font-weight: 800;
    clear: both;
    border-bottom: 1px solid #000000;
  }

  h2 {
    font-size: 24px;
    font-weight: 800;
    clear: both;
    padding-top: 40px;
    border-bottom: 1px solid #000000;
  }

  .font_l {
    font-size: 24px;
  }

  .font_bold {
    font-weight: 800;
  }

  header .logo1 {
    width: 200px;
    float: left;
    margin-right: 10px;
  }

  header .logo2 {
    width: 200px;
    float: left;
  }

  header .logo1 img,
  header .logo2 img {
    width: 100%;
  }

  .header_right {
    float: right;
  }

  .header_right .header_link {
    float: right;
  }

  .image {
    width: 1200px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
  }

  .image img {
    max-width: 100%;
  }

  .movie {
    width: 1200px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
  }

  dl.top dt {
    width: 160px;
    float: left;
    clear: both;
    padding-top: 10px;
    padding-right: 10px;
    padding-left: 0px;
    padding-bottom: 10px;
    font-weight: 800;
  }

  dl.top dd {
    width: 900px;
    float: left;
    padding: 10px;
    box-sizing: border-box;
  }

  ul.judge {
    display: flex;
    list-style-type: none;
    padding: 0;
    justify-content: space-between;
  }

  ul.judge li {
    width: 220px;
  }

  ul.judge .photo {
    width: 200px;
  }

  ul.judge .photo img {
    width: 100%;
    border-radius: 100px;
  }

  ul.judge .name {
    font-size: 1.4rem;
    font-weight: 600;
  }

  ul.judge .company {
    font-size: 1rem;
    font-weight: 600;
  }

  ul.judge .sub {
    font-size: 0.8rem;
  }

  .aword1 {
    font-size: 1.4rem;
    font-weight: 600;
    background-color: #FFA500;
    color: #fff;
    margin-bottom: 5px;
    padding: 5px;
    border-radius: 5px;
  }

  .aword2 {
    font-size: 1.2rem;
    font-weight: 600;
    background-color: #999;
    color: #fff;
    margin-bottom: 5px;
    padding: 5px;
    border-radius: 5px;
  }

  .aword2b {
    font-size: 1rem;
    font-weight: 600;
  }

  .aword3 {
    font-size: 1.2rem;
    font-weight: 600;
    background-color: #999;
    color: #fff;
    margin-bottom: 5px;
    padding: 5px;
    border-radius: 5px;
  }

  #entryworks ul.entryworks {
    list-style-type: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  #entryworks ul.entryworks li {
    width: 15%;
    margin-bottom: 40px;
  }

  #entryworks ul.entryworks li img {
    width: 100%;
    border-radius: 10px;
  }

  #entryworks ul.entryworks li .title {
    font-weight: 600;
  }

  #entryworks ul.entryworks::after {
    content: "";
    display: block;
    width: 49%;
  }

  .modal-inner {
    padding: 10px;
  }

  .modal-inner .title {
    text-align: center;
    font-size: 1.2rem;
    font-weight: 600;
    margin-top: 10px;
    margin-bottom: 10px;
  }

  .modal-inner .school {
    text-align: center;
    font-size: 1rem;
    font-weight: 600;
    margin-top: 10px;
    margin-bottom: 10px;
  }

  .modal-inner .photo {
    width: 40%;
    border-radius: 10px;
    margin-left: auto;
    margin-right: auto;
  }

  .modal-inner .photo img {
    width: 100%;
    border-radius: 10px;
  }

  .entry {
    clear: both;
    margin-top: 80px;
    width: 100%;
    text-align: center;
  }

  .entry_bt {
    display: inline-block;
    padding: 0.8em 3em;
    background-color: #e3364a;
    /* 背景色 */
    box-shadow: 0 5px 0 #a21727;
    /* 影の太さ・色 */
    border-radius: 60px;
    color: #fff;
    cursor: pointer;
    text-decoration: none;
    /* 文字の下線を消す */
    -webkit-box-shadow: 0 5px 0 #a21727;
    font-size: 1.4rem;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px;
    width: 300px;
    text-align: center;
  }

  .entry_bt:hover {
    box-shadow: none;
    transform: translateY(5px);
  }

  .entry_bt_close {
    display: inline-block;
    padding: 0.8em 3em;
    background-color: #666;
    /* 背景色 */
    box-shadow: 0 5px 0 #a21727;
    /* 影の太さ・色 */
    border-radius: 60px;
    color: #999;
    cursor: pointer;
    text-decoration: none;
    /* 文字の下線を消す */
    -webkit-box-shadow: 0 5px 0 #999;
    font-size: 1.4rem;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px;
    width: 300px;
    text-align: center;
  }

  .back_bt {
    display: inline-block;
    padding: 0.4em 2em;
    background-color: #666;
    /* 背景色 */
    box-shadow: 0 5px 0 #333;
    /* 影の太さ・色 */
    border-radius: 50px;
    color: #fff;
    cursor: pointer;
    text-decoration: none;
    /* 文字の下線を消す */
    -webkit-box-shadow: 0 5px 0 #333;
    font-size: 1rem;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px;
    width: 180px;
    text-align: center;
  }

  .back_bt:hover {
    box-shadow: none;
    transform: translateY(5px);
  }

  .contact_bt {
    display: inline-block;
    padding-top: 0.2em;
    padding-bottom: 0.2em;
    background-color: #1000ff;
    /* 背景色 */
    border-radius: 60px;
    color: #fff;
    cursor: pointer;
    text-decoration: none;
    /* 文字の下線を消す */
    font-size: 1rem;
    margin-left: auto;
    margin-right: auto;
    margin-top: 10px;
    width: 200px;
    text-align: center;
  }

  footer .footer {
    width: 1200px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 40px;
  }

  footer .footer_menu {
    float: right;
  }

  footer .copyright {
    text-align: center;
    font-size: 0.8rem;
    margin-top: 20px;
  }

  footer a:link,
  footer a:visited {
    color: #000;
    text-decoration: none;
  }

  footer a:hover {
    color: #000;
    text-decoration: underline;
  }

  dl.form {
    clear: both;
  }

  dl.form dt {
    width: 200px;
    float: left;
    clear: both;
    padding: 20px;
    font-weight: 600;
  }

  dl.form dd {
    width: 800px;
    float: left;
    padding: 10px;
    box-sizing: border-box;
  }

  dl.form dd .error {
    margin-top: 0.25rem;
    color: #dd0000;
  }

  .form_text1 {
    font-size: 16px;
    height: 44px;
    width: 400px;
    padding: 12px;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    background-color: #fff;
    box-sizing: border-box;
  }

  select {
    -webkit-appearance: none;
    appearance: none;
    /* デフォルトの矢印を非表示 */
    border-radius: 4px;
    height: 44px;
    padding-left: 10px;
    width: 140px;
    font-size: 16px;
    border: 1px solid #d9d9d9;
    margin-right: 5px;
  }

  select::-ms-expand {
    display: none;
    /* デフォルトの矢印を非表示(IE用) */
  }

  .form_select1 {
    position: relative;
    overflow: hidden;
  }

  .form_select1_area {
    position: relative;
  }

  .form_select1_area2 {
    margin-right: 5px;
  }

  .form_select1_area::before {
    pointer-events: none;
    position: absolute;
    color: #666666;
    top: 50%;
    left: 6.7em;
    transform: translateY(-50%);
    content: '▼';
  }

  .form_select1_area::after {
    pointer-events: none;
    position: absolute;
    color: #666666;
    top: 50%;
    left: 6.7em;
    transform: translateY(-50%);
    content: '▼';
  }

  .upload-area {
    margin: auto;
    height: 200px;
    position: relative;
    border: 1px dotted rgba(0, 0, 0, 0.4);
  }

  .upload-area i {
    position: absolute;
    font-size: 120px;
    opacity: 0.1;
    width: 100%;
    left: 0;
    top: 20px;
    text-align: center;
  }

  .upload-area p {
    width: 100%;
    position: absolute;
    bottom: 0;
    opacity: 0.8;
    text-align: center;
    font-size: 12px;
  }

  .input-files {
    top: 0;
    left: 0;
    opacity: 0;
    position: absolute;
    width: 100%;
    height: 100%;
  }

  .submit-btn {
    display: inline-block;
    font-weight: bold;
    font-size: 16px;
    margin-top: 20px;
    border-radius: 3px;
    width: 200px;
    height: 45px;
    background-color: rgba(108, 168, 255, 0.7);
    border: none;
    box-shadow: 0 5px 0 rgba(0, 0, 0, 0.6);
    opacity: 0.6;
    cursor: pointer;
  }

  .submit-btn:disabled {
    background-color: rgba(108, 168, 255, 0.3);
  }

  .submit-btn:enabled:hover {
    background-color: rgba(108, 168, 255, 1);
  }

  .submit-btn:enabled:active {
    position: relative;
    top: 5px;
    box-shadow: none;
  }

  .formrun label {
    float: left;
    width: 200px;
    clear: both;
    margin-bottom: 5px;
  }

  .formrun input {
    font-size: 1rem;
    padding: 5px;
    border-radius: 5px;
    width: 400px;
    margin-bottom: 5px;
  }

  .formrun input.radio {
    width: auto;
  }

  .formrun textarea {
    padding: 5px;
    width: 400px;
    height: 100px;
    margin-bottom: 5px;
  }

  .formrun .formrun-system-show {
    color: #dd0000;
  }

  button {
    color: #fff;
    background-color: #088baa;
    padding-top: 10px;
    padding-right: 20px;
    padding-left: 20px;
    padding-bottom: 10px;
    font-size: 1.2rem;
    border-radius: 10px;
    border: none;
  }

  .formrun .form1 {
    clear: both;
    margin-bottom: 5px;
  }

  .sns {
    margin-top: 80px;
  }

  .sns ul {
    list-style: none;
    display: flex;
    width: 240px;
    justify-content: space-between;
    margin-left: auto;
    margin-right: auto;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
  }

  .sns ul img {
    width: 60px;
  }
}

@media screen and (max-width: 767px) {
  header {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-top: 10px;
    font-size: 3vw;
    clear: both;
  }

  main {
    width: 96%;
    margin-left: auto;
    margin-right: auto;
    clear: both;
  }

  footer {
    width: 100%;
    background-color: #ddd;
    margin-top: 80px;
    clear: both;
  }

  h1 {
    font-size: 28px;
    font-weight: 800;
    clear: both;
    margin-top: 40px;
    border-bottom: 1px solid #000000;
  }

  h2 {
    font-size: 24px;
    font-weight: 800;
    clear: both;
    margin-top: 40px;
    border-bottom: 1px solid #000000;
  }

  .pc {
    display: none;
  }

  .font_l {
    font-size: 24px;
  }

  .font_bold {
    font-weight: 800;
  }

  header .logo1 {
    width: 20%;
    float: left;
    margin-top: 2%;
    margin-right: 5px;
  }

  header .logo2 {
    width: 40%;
    float: left;
  }

  header .logo1 img,
  header .logo2 img {
    width: 100%;
  }

  .header_right {
    float: right;
  }

  .header_right .header_link {
    float: right;
  }

  .image {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
  }

  .image img {
    width: 100%;
  }

  .movie {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
  }

  .movie .movie2 {
    width: 80%;
  }

  dl.top dt {
    clear: both;
    width: 100%;
    padding-top: 20px;
    padding-right: 10px;
    padding-left: 0px;
    padding-bottom: 0px;
    font-weight: 800;
  }

  dl.top dd {
    padding: 0px;
    box-sizing: border-box;
    width: 100%;
    margin: 0;
  }

  ul.judge {
    display: flex;
    list-style-type: none;
    padding: 0;
    justify-content: space-between;
    flex-wrap: wrap;
  }

  ul.judge li {
    width: 45%;
    margin-bottom: 20px;
  }

  ul.judge .photo {
    width: 120px;
  }

  ul.judge .photo img {
    width: 100%;
    border-radius: 100px;
  }

  ul.judge .name {
    font-size: 1.2rem;
    font-weight: 600;
  }

  ul.judge .company {
    font-size: 0.8rem;
    font-weight: 600;
  }

  ul.judge .sub {
    font-size: 0.6rem;
  }

  .aword1 {
    font-size: 1.2rem;
    font-weight: 600;
    background-color: #FFA500;
    color: #fff;
    margin-bottom: 5px;
    padding: 5px;
    border-radius: 5px;
  }

  .aword2 {
    font-size: 1rem;
    font-weight: 600;
    background-color: #999;
    color: #fff;
    margin-bottom: 5px;
    padding: 5px;
    border-radius: 5px;
  }

  .aword2b {
    font-size: 1rem;
    font-weight: 600;
  }

  .aword3 {
    font-size: 1rem;
    font-weight: 600;
    background-color: #999;
    color: #fff;
    margin-bottom: 5px;
    padding: 5px;
    border-radius: 5px;
  }

  #entryworks ul.entryworks {
    list-style-type: none;
    margin: 0;
    padding: 0;
    list-style-type: none;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  #entryworks ul.entryworks li {
    width: 45%;
    margin-bottom: 40px;
  }

  #entryworks ul.entryworks li img {
    width: 100%;
    border-radius: 10px;
  }

  #entryworks ul.entryworks li .title {
    font-size: 4vw;
    font-weight: 600;
  }

  .modal-inner {
    padding: 10px;
  }

  .modal-inner .title {
    text-align: center;
    font-size: 1.2rem;
    font-weight: 600;
    margin-top: 10px;
    margin-bottom: 10px;
  }

  .modal-inner .school {
    text-align: center;
    font-size: 1rem;
    font-weight: 600;
    margin-top: 10px;
    margin-bottom: 10px;
  }

  .modal-inner .photo {
    width: 50%;
    border-radius: 10px;
    margin-left: auto;
    margin-right: auto;
  }

  .modal-inner .photo img {
    width: 100%;
    border-radius: 10px;
  }

  .modal-inner .title {
    font-size: 4.5vw;
    font-weight: 600;
  }

  .modal-inner .school {
    font-size: 3.5vw;
    font-weight: 600;
  }

  .modal-inner .text {
    font-size: 3.5vw;
  }

  .entry {
    clear: both;
    margin-top: 80px;
    width: 100%;
    text-align: center;
  }

  .entry_bt {
    display: inline-block;
    padding: 0.8em 1em;
    background-color: #e3364a;
    /* 背景色 */
    box-shadow: 0 5px 0 #a21727;
    /* 影の太さ・色 */
    border-radius: 60px;
    color: #fff;
    cursor: pointer;
    text-decoration: none;
    /* 文字の下線を消す */
    -webkit-box-shadow: 0 5px 0 #a21727;
    font-size: 6vw;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px;
    width: 80%;
    max-width: 300px;
    text-align: center;
  }

  .entry_bt:hover {
    box-shadow: none;
    transform: translateY(5px);
  }

  .entry_bt_close {
    display: inline-block;
    padding: 0.8em 1em;
    background-color: #666;
    /* 背景色 */
    box-shadow: 0 5px 0 #a21727;
    /* 影の太さ・色 */
    border-radius: 60px;
    color: #999;
    cursor: pointer;
    text-decoration: none;
    /* 文字の下線を消す */
    -webkit-box-shadow: 0 5px 0 #999;
    font-size: 6vw;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px;
    width: 80%;
    max-width: 300px;
    text-align: center;
  }

  .back_bt {
    display: inline-block;
    padding: 0.2em;
    background-color: #666;
    /* 背景色 */
    box-shadow: 0 5px 0 #333;
    /* 影の太さ・色 */
    border-radius: 60px;
    color: #fff;
    cursor: pointer;
    text-decoration: none;
    /* 文字の下線を消す */
    -webkit-box-shadow: 0 5px 0 #333;
    font-size: 5vw;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px;
    width: 60%;
    max-width: 200px;
    text-align: center;
  }

  .back_bt:hover {
    box-shadow: none;
    transform: translateY(5px);
  }

  .contact_bt {
    display: inline-block;
    padding-top: 0.2em;
    padding-bottom: 0.2em;
    padding-left: 1em;
    padding-right: 1em;
    background-color: #1000ff;
    /* 背景色 */
    border-radius: 60px;
    color: #fff;
    cursor: pointer;
    text-decoration: none;
    /* 文字の下線を消す */
    font-size: 4vw;
    margin-left: auto;
    margin-right: auto;
    margin-top: 10px;
    text-align: center;
  }

  footer .footer {
    width: 96%;
    margin-left: auto;
    margin-right: auto;
    padding-top: 40px;
    padding-bottom: 40px;
  }

  footer .footer_menu {
    margin-bottom: 40px;
  }

  footer .copyright {
    text-align: center;
    font-size: 4vw;
    margin-top: 20px;
  }

  footer a:link,
  footer a:visited {
    color: #000;
    text-decoration: none;
  }

  footer a:hover {
    color: #000;
    text-decoration: underline;
  }

  dl.form {
    clear: both;
  }

  dl.form dt {
    clear: both;
    padding: 10px;
    font-weight: 600;
    margin: 0;
    padding-top: 10px;
    padding-bottom: 0;
  }

  dl.form dd {
    width: 100%;
    margin: 0;
    padding: 10px;
    box-sizing: border-box;
  }

  dl.form dd .error {
    margin-top: 0.25rem;
    color: #dd0000;
  }

  .form_text1 {
    font-size: 16px;
    height: 44px;
    width: 100%;
    padding: 12px;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    background-color: #fff;
    box-sizing: border-box;
  }

  select {
    -webkit-appearance: none;
    appearance: none;
    /* デフォルトの矢印を非表示 */
    border-radius: 4px;
    height: 44px;
    padding-left: 10px;
    width: 140px;
    font-size: 16px;
    border: 1px solid #d9d9d9;
    margin-right: 5px;
  }

  select::-ms-expand {
    display: none;
    /* デフォルトの矢印を非表示(IE用) */
  }

  .form_select1 {
    position: relative;
    overflow: hidden;
  }

  .form_select1_area {
    position: relative;
    margin-bottom: 5px;
  }

  .form_select1_area2 {
    margin-bottom: 5px;
  }

  .form_select1_area::before {
    pointer-events: none;
    position: absolute;
    color: #666666;
    top: 50%;
    left: 6.7em;
    transform: translateY(-50%);
    content: '▼';
  }

  .form_select1_area::after {
    pointer-events: none;
    position: absolute;
    color: #666666;
    top: 50%;
    left: 6.7em;
    transform: translateY(-50%);
    content: '▼';
  }

  .upload-area {
    margin: auto;
    height: 200px;
    position: relative;
    border: 1px dotted rgba(0, 0, 0, 0.4);
  }

  .upload-area i {
    position: absolute;
    font-size: 120px;
    opacity: 0.1;
    width: 100%;
    left: 0;
    top: 20px;
    text-align: center;
  }

  .upload-area p {
    width: 100%;
    position: absolute;
    bottom: 0;
    opacity: 0.8;
    text-align: center;
    font-size: 12px;
  }

  .input-files {
    top: 0;
    left: 0;
    opacity: 0;
    position: absolute;
    width: 100%;
    height: 100%;
  }

  .submit-btn {
    display: inline-block;
    font-weight: bold;
    font-size: 16px;
    margin-top: 20px;
    border-radius: 3px;
    width: 200px;
    height: 45px;
    background-color: rgba(108, 168, 255, 0.7);
    border: none;
    box-shadow: 0 5px 0 rgba(0, 0, 0, 0.6);
    opacity: 0.6;
    cursor: pointer;
  }

  .submit-btn:disabled {
    background-color: rgba(108, 168, 255, 0.3);
  }

  .submit-btn:enabled:hover {
    background-color: rgba(108, 168, 255, 1);
  }

  .submit-btn:enabled:active {
    position: relative;
    top: 5px;
    box-shadow: none;
  }

  .formrun label {
    clear: both;
  }

  .formrun input {
    font-size: 1rem;
    padding: 5px;
    border-radius: 5px;
    width: 96%;
    margin-bottom: 5px;
  }

  .formrun textarea {
    padding: 5px;
    width: 96%;
    height: 100px;
    margin-bottom: 5px;
  }

  .formrun .formrun-system-show {
    color: #dd0000;
  }

  button {
    color: #fff;
    background-color: #088baa;
    padding-top: 10px;
    padding-right: 20px;
    padding-left: 20px;
    padding-bottom: 10px;
    font-size: 1.2rem;
    border-radius: 10px;
    border: none;
  }

  .formrun .form1 {
    clear: both;
    margin-bottom: 10px;
  }

  .formrun input.radio {
    width: auto;
  }

  .sns {
    margin-top: 80px;
  }

  .sns ul {
    list-style: none;
    display: flex;
    width: 240px;
    justify-content: space-between;
    margin-left: auto;
    margin-right: auto;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
  }

  .sns ul img {
    width: 60px;
  }
}

.red {
  color: red;
}