/* =================================================================
共通
=================================================================*/

/* =================================================================
fv
=================================================================*/
#fv {position: relative;}
#fv:before {content: ""; display: block; background: url(../img/recruit/fv-bg.jpg); background-size: cover; width: calc(1904 / 2000 * 100%); aspect-ratio: 1904 / 1359; position: absolute; left: 0; top: 0; z-index: -1;}
#fv .inner {position: relative; width: 100%; max-width: 200rem; margin: auto; aspect-ratio: 2000 / 1404;}
#fv .image {position: absolute;}
#fv .img01 {top: 3.7rem; left: 12.6rem; width: 43.1rem;}
#fv .img02 {top: 47rem; left: 32.9rem; width: 36.8rem; z-index: 2;}
#fv .img03 {top: 93.4rem; left: 1.5rem; width:40.6rem ;}
#fv .img04 {top: 8.4rem; right: 25.7rem; width: 52.7rem;}
#fv .img05 {top: 61.4rem; right: 31.4rem; width: 40.9rem;}
#fv .img06 {top: 110.1rem; right: 1rem; width: 47.7rem;}

#fv .text {position: absolute; left: 0; right: 0; top: 44.8rem; z-index: 4; margin: auto; display: flex; justify-content: center; flex-direction: column; align-items: center; gap: 4.2rem;}
#fv .text h1 picture {display: block;}
#fv .text h1 img {width: 70.3rem;}
#fv .text p {font-size: 4.5rem; display: flex; flex-direction: column; align-items: center; gap: 4.2rem; font-family: "Zen Old Mincho", serif;}
#fv .text p span {font-size: 3.8rem;}

@media screen and (max-width: 768px) {
	#fv:before {width: 100%; aspect-ratio: 768 / 1372; background-image: url(../img/recruit/fv-bg_sp.jpg); }
	#fv .inner {aspect-ratio: 768 / 1372; overflow: hidden;}
	#fv .img01 {width: 24.7rem; top: 3.2rem; left: -4.7rem;}
	#fv .img02 {width: 24.2rem; top: 69.6rem; left: 9.6rem;}
	#fv .img04 {width: 40.6rem; top: 21.6rem; right: -15.7rem;}
	#fv .img05 {width: 26.1rem; top: 62.6rem; right: -4.6rem;}
	#fv .img03,
	#fv .img06 {display: none;}

	#fv .text {top: 43.3rem; gap: 18.9rem;}
	#fv .text h1 img {width: 59.7rem;}
	#fv .text p {text-align: center; line-height: 1.1; font-weight: normal;}

}

/* =================================================================
recruit-menu
=================================================================*/
#recruit-menu {width: 100%; max-width: 120rem; margin: 8.2rem auto;}
#recruit-menu h2 {font-size: 3.6rem; margin-bottom: 2.9rem;}
#recruit-menu .index_menu {display: flex; flex-wrap: wrap; border-top: 1px solid #171717;}
#recruit-menu .index_menu a {display: flex; padding: 3.8rem 4.4rem; width: calc((100%)/3); font-size: 2.3rem; border-bottom: 1px solid #171717; position: relative; display: flex; align-items: center; gap: 3.4rem;}
#recruit-menu .index_menu a::before {content: ""; display: block; width: 1.3rem; height: 1.5rem; background: url(../img/recruit/icon-arrow.svg); background-size: cover;;}
#recruit-menu .index_menu a:after {content: ""; display: block; width: 1px; height: 4.6rem; background: #171717; position: absolute; right: 0; top: 0; bottom: 0; margin: auto;}
#recruit-menu .index_menu a:nth-child(3):after,
#recruit-menu .index_menu a:nth-child(5):after {display: none;}
#recruit-menu .index_menu a:last-child {width: calc(100% - (100% / 3));}
#recruit-menu .index_menu a:hover {background: #f7f7f7; opacity: 1;}

@media screen and (max-width: 768px) {
	#recruit-menu {padding: 0 1.8rem; margin-top: 14.2rem; margin-bottom: 13.5rem;}
	#recruit-menu .index_menu a {width: calc((100%)/2); padding: 3.7rem 3rem; gap: 2.2rem;}
	#recruit-menu .index_menu a:nth-child(2):after,
	#recruit-menu .index_menu a:nth-child(4):after {display: none;}
	#recruit-menu .index_menu a:nth-child(3):after,
	#recruit-menu .index_menu a:nth-child(5):after {display: block;}
	#recruit-menu .index_menu a:last-child {width: calc(100%);}
	#recruit-menu .index_menu a:last-child:after {display: none;}
}

/* =================================================================
information
=================================================================*/
#information {width: 100%; max-width: 120rem; margin: auto;}
#information .heading {display: flex; justify-content: space-between; align-items: flex-start; padding-left: 3.1rem; padding-right: 5.1rem; padding-bottom: 6.3rem;}
#information .heading h2 {writing-mode: vertical-rl; text-orientation: mixed; font-size: 3rem; display: flex; flex-direction: column; gap: 2.1rem;}
#information .heading h2 span {color: #c03230; font-size: 2.2rem; font-weight: 300; }
#information .heading img {width: 33rem;}
#information .heading .text {display: flex; gap: 12.1rem;}
#information .heading .text h3 {font-size: 3.6rem; display: flex; flex-direction: column; gap: 2.2rem; position: relative; margin-bottom: 14.3rem;}
#information .heading .text h3 span {font-size: 2.2rem;}
#information .heading .text h3:after {content: ""; width: 6.4rem; height: 1px; display: flex; background: #171717; position: absolute; bottom: -4.7rem;}
#information .heading .text p {font-size: 2.2rem; line-height: 1.909090909090909; font-weight: 500;}

#information .detail {border-top: 3px solid #000000; display: flex; justify-content: space-between; padding: 0 2.2rem;}
#information .detail .box {width: 100%; max-width: 55.3rem;}
#information .detail h4 {font-weight: 800; display: flex; align-items: center; gap: 2.7rem; margin-bottom: 3.4rem;}
#information .detail h4:before {content: ""; display: block; width: 1rem; height: 1rem; background: #000; border-radius: 100%;}
#information .detail .item {padding: 4rem 0; border-bottom: 2px dotted #000;}
#information .detail .item p {font-size: 2rem; line-height: 1.4;}

#information .button {margin-top: 10rem;}
#information .button a {display: flex; justify-content: center; align-items: center; border: 3px solid #c03230; width: 54rem; height: 6rem; color: #c03230; font-size: 2rem; margin: auto;}

#information .sns {margin: 6.6rem auto 0; width: 36rem; display: flex; flex-direction: column; gap: 1.9rem;}
#information .sns a {display: flex; align-items: center; gap: 3.5rem; font-size: 2.2rem; font-weight: 600;}

@media screen and (max-width: 768px) {
	#information .heading {position: relative; padding-left: 7.2rem;}
	#information .heading h2 {font-size: 4rem;}

	#information .heading img {width: 29.9rem; position: absolute; top: 0; right: 3.9rem;}
	#information .heading .text {flex-direction: column; align-items: flex-start; gap: 22.8rem;}
	#information .heading .text h3 {margin-bottom: 9.4rem;}
	#information .heading .text p {font-size: 2.6rem;}

	#information .detail {flex-direction: column; border-top: 0;}
	#information .detail .box {max-width: 100%;}
	#information .detail .box:nth-child(1) {border-top: 3px solid #000000;}
	#information .detail .item {padding: 4.7rem 3.3rem;}
	#information .detail h4 {font-size: 2.4rem;}
	#information .detail .item p {font-size: 2.6rem;}

	#information .button {margin-top: 7.3rem;}
	#information .button a {width: 61rem; height: 7.1rem; font-size: 2.3rem;}

	#information .sns img {width: 4.8rem;}
}

/* =================================================================
consultation
=================================================================*/
#consultation {border-top: 1px solid #000; border-bottom: 1px solid #000; margin-top: 6.9rem;}
#consultation .inner {display: flex; justify-content: center;}
#consultation .box {border-left: 1px solid #000;}
#consultation .box:nth-child(2) {border-right: 1px solid #000;}
#consultation .image {border-top: 1px solid #000; border-bottom: 1px solid #000;}
#consultation .box h3 {padding: 2.8rem 3.9rem; font-weight: 600; display: flex; align-items: center; gap: 3.2rem;}
#consultation .box h3:before {content: ""; display: block; width: 1rem; height: 1rem; background: #000; border-radius: 100%;}
#consultation .box p {line-height: 2.363636363636364; padding: 4.4rem 7.7rem;}

@media screen and (max-width: 768px) {
	#consultation .inner {flex-direction: column;}
	#consultation .box {border: 0; border-bottom: 1px solid #000; padding: 0 3.7rem;}
	#consultation .box:nth-child(2) {border-bottom: 0; border-right: 0;}
	#consultation .box-inner {border-left: 1px solid #000; border-right: 1px solid #000;}
	#consultation .box h3 {font-size: 2.8rem; padding: 2rem 3.9rem; gap: 1.9rem;}
	#consultation .box p {padding: 4.2rem 3.9rem;}
}

/* =================================================================
curriculum
=================================================================*/
#curriculum {background: #e8e8e8; padding: 19.3rem 0 20.4rem;}
#curriculum .title {display: flex; justify-content: center;}
#curriculum h2 {font-size: 25rem; text-align: center; position: relative; line-height: 0.7; margin-bottom: 11.6rem;}
#curriculum h2 img {position: absolute; right: -15.3rem; top: -6.3rem; width: 52.4rem;}

#curriculum .heading {display: flex; align-items: flex-start; justify-content: space-between; width: 100%; max-width: 200rem; margin: auto; padding-right: 8.1rem;}
#curriculum .heading .text {padding-left: 20.9rem;}
#curriculum .heading .text p {font-size: 2.2rem; line-height: 2.090909090909091;}
#curriculum .heading .image {width: 103.3rem;}
#curriculum .heading .title {flex-direction: column; gap: 6.5rem; padding-top: 5rem;}
#curriculum .heading .title h3 {font-size: 4.1rem; position: relative; margin-bottom: 15.5rem;}
#curriculum .heading .title h3:after {content: ""; width: 6.6rem; height: 1px; display: flex; background: #171717; position: absolute; bottom: -7.6rem;}

#curriculum .list-wrap {overflow-x: scroll; height: auto; padding-left: 20rem; margin-top: 19.2rem;}
#curriculum .list-wrap { cursor: grab; user-select: none; }
#curriculum .list-wrap.is-dragging { cursor: grabbing; }

#curriculum .list {display: flex; white-space: nowrap; gap: .8rem; padding: 2rem 20rem 2rem 0; width: max-content;}
#curriculum .list .box {flex-shrink: 0; width: 53.8rem; height: 77.2rem; display: flex; flex-direction: column; justify-content: flex-end; position: relative;}
#curriculum .list .box:after {content: ">"; display: flex; justify-content: center; align-items: center; width: 9rem; height: 9rem; color: #fff; font-size: 3.2rem; background: #000; border-radius: 100%; position: absolute; right: -4.5rem; top: 40rem; z-index: 1; line-height: 1;}
#curriculum .list .box:last-child:after {display: none;}
#curriculum .list .box .box-inner {background: #fff; border-radius: 9999px; height: 72.4rem; display: flex; flex-direction: column; align-items: center;}
#curriculum .list .box .year {display: flex; flex-direction: column; align-items: center; font-size: 4.7rem; margin-top: -7rem; margin-bottom: 4rem;}
#curriculum .list .box .year .number {font-size: 12.5rem;}
#curriculum .list .box h4 {text-align: center; font-size: 3.2rem; font-weight: 600; line-height: 1.3125; height: 3em; margin-bottom: 3rem;}
#curriculum .list .box ul li {font-family: "Zen Kaku Gothic Antique", sans-serif; line-height: 1.909090909090909; font-weight: 500; display: flex; align-items: center; gap: 2.1rem;}
#curriculum .list .box ul li:before {content: ""; display: block; width: 1rem; height: 1rem; background: #828282; border-radius: 100%;}

@media screen and (max-width: 768px) {
	#curriculum {padding-top: 22rem;}
	#curriculum h2 {font-size: 19.5rem; font-weight: 100;}
	#curriculum h2 img {right: 7.4rem; top: -12.9rem;}

	#curriculum .heading {flex-direction: column; padding-right: 0; gap: 13.3rem;}
	#curriculum .heading .text {padding-left: 5.4rem; padding-right: 2.4rem; width: 100%;}
	#curriculum .heading .text p {font-size: 2.6rem;}
	#curriculum .heading .title {padding-top: 0; gap: 6rem;}
	#curriculum .heading .title h3 {font-size: 6rem;}
	#curriculum .heading .image {padding: 0 3rem; width: 100%;}

	#curriculum .list-wrap {margin-top: 13.9rem; padding-left: 4.5rem;}
	#curriculum .list {padding-right: 4.5rem;}
	#curriculum .list .box {width: 58.3rem; height: 85.5rem;}
	#curriculum .list .box .box-inner {width: 58.3rem; height: 80rem;}
	#curriculum .list .box ul li {font-size: 2.4rem;}
}

/* =================================================================
Training
=================================================================*/
#training {display: flex; justify-content: space-between; position: relative;}
#training .left-menu {width: 41.95%; height: 97.5rem; background: #1e1e1e; color: #fff; padding: 23rem 0 0; display: flex; justify-content: flex-start; align-items: center; flex-direction: column;}
#training .left-menu .title {display: inline-flex; justify-content: center; width: 100%; margin-bottom: 10rem;}
#training .left-menu h2 {font-size: 12.4rem; text-align: center; position: relative;}
#training .left-menu h2 img {position: absolute; left: 1.7rem; top: -3rem;}
#training .left-menu ul {display: flex; flex-direction: column; gap: 1.8rem;}
#training .left-menu ul a {border: 1px solid #1e1e1e; color: #fff; padding: 1.7rem 3rem; font-size: 2.1rem; display: inline-flex; align-items: center; justify-content: flex-start;}
#training .left-menu ul a:hover {border: 1px solid #fff; border-radius: 9999px;}
#training .left-menu ul a.current {border: 1px solid #fff; border-radius: 9999px;}

#training .swiper {width: 58.05%; border-bottom: 1px solid #000;}
#training .swiper .image {border-bottom: 1px solid #000;}
#training .swiper .text {display: flex; justify-content: space-between; padding: 7.2rem 17.1rem 0 6.4rem; gap: 42.4rem;}
#training .swiper .text h3 {writing-mode: vertical-rl; text-orientation: mixed; font-size: 3.3rem;  font-weight: 600; display: flex; flex-direction: column; gap: 1.9rem;}
#training .swiper .text h3 span {font-size: 2.2rem;}
#training .swiper .text p {line-height: 1.909090909090909;}

#training .button {position: absolute; right: 6.6rem; bottom: -4.5rem; display: flex; gap: 2.5rem; z-index: 1;}
#training .swiper-button {display: flex; justify-content: center; align-items: center; background: #020202; border-radius: 100%; width: 9rem; height: 9rem; color: #fff; font-size: 3.2rem; cursor: pointer;}

@media screen and (max-width: 768px) {
	#training {flex-direction: column;}
	#training .left-menu {width: 100%; height: 94.8rem; padding-top: 27.7rem;}
	#training .left-menu ul a {font-size: 3.2rem; padding: 2.7rem 5.4rem;}
	#training .left-menu h2 img {width: 13.6rem;}
	#training .swiper {width: 100%;}
	#training .swiper .text {padding: 9.5rem 3.9rem 9.5rem 7.3rem; gap: 9.4rem;}
	#training .swiper .text h3 {font-size: 3.8rem;}
	#training .swiper .text h3 span {font-size: 2.6rem;}
}

/* =================================================================
other-feature
=================================================================*/
#other-feature {margin-top: 21.6rem;}
#other-feature .inner {display: flex; justify-content: center; align-items: flex-start; gap: 7.7rem; margin-bottom: 29.3rem;}
#other-feature .inner .box {width: 76.7rem; border: 1px solid #000; box-shadow: 1.2rem 1.6rem 0px 0px #000000;}
#other-feature .inner .box:nth-child(2) {margin-top: 8rem;}
#other-feature .inner .text {display: flex; justify-content: space-between; padding: 3.8rem 7.2rem 8.2rem 6.5rem;}
#other-feature .inner .text .main-text .en {margin-bottom: 5.1rem;}
#other-feature .inner .text .main-text p {line-height: 1.909090909090909;}
#other-feature .inner .text h3 {writing-mode: vertical-rl; text-orientation: mixed; font-size: 3.3rem; font-weight: 600;}
#other-feature .inner .box img {width: 100%; border-top: 1px solid #000;}

@media screen and (max-width: 768px) {
	#other-feature {margin-top: 15.1rem;}
	#other-feature .inner {flex-direction: column; padding: 0 4.4rem; gap: 8rem;}
	#other-feature .inner .box {width: 100%;}
	#other-feature .inner .box:nth-child(2) {margin-top: 0rem;}
	#other-feature .inner .text {gap: 9.6rem;}
	#other-feature .inner .text .main-text p {font-size: 2.3rem;}
	#other-feature .inner .text .main-text .en {margin-bottom: 4.5rem; font-size: 2.6rem; line-height: 1;}
	#other-feature .inner .text h3 {font-size: 2.9rem;}
}

/* =================================================================
interview
=================================================================*/
#interview {padding: 9.5rem 0 0;}
#interview .inner {background: #e8e8e8; padding-bottom:  16.6rem;;}
#interview .title {display: inline-flex; justify-content: center; width: 100%;}
#interview h2 {font-size: 16.9rem; text-align: center; position: relative; margin-top: -3.4rem; margin-bottom: 18rem;}
#interview h2 img {position: absolute; top: -4.8rem; left: 11rem;}

#interview .slider{overflow: hidden; width: 100%;}
#interview .slider + .slider {margin-top: 2.6rem;}
#interview .slider .track{display: flex; width: 200%; animation: scroll-left 40s linear infinite;}
#interview .slider:nth-of-type(even) .track{animation-direction: reverse;}
#interview .slider:hover .track{animation-play-state: paused;}
#interview .slide{flex-shrink: 0; width: 41rem; height: 61.7rem;}
#interview .slide img {width: 41rem; height: 61.7rem; object-fit: cover;}

#interview .link {width: 42.9rem;}
#interview a {writing-mode: vertical-rl; text-orientation: mixed; display: flex; flex-direction: column; justify-content: space-between; gap: 2.1rem; width: 100%; height: 100%; padding: 3.1rem 4rem; background: #fff;}
#interview a h4 {font-size: 3.3rem; line-height: 2.060606060606061;}
#interview .name {font-family: "Zen Old Mincho", serif; align-self: flex-end; display: flex; align-items: center; gap: 3.4rem;}
#interview .name:after {content: ""; display: block; width: 3rem; height: 3rem; background-image: url(../img/recruit/icon-link_plus.svg); background-size: contain;}

@media screen and (max-width: 768px) {
	#interview h2 img {width: 31.8rem;}
	#interview .slide .text .en {font-size: 2.2rem;}
	#interview .slider + .slider {margin-top: 3.2rem;}
}

/* =================================================================
awards
=================================================================*/
#awards {padding-top: 13.1rem;}
#awards .inner {display: flex; width: 100%; max-width: 120rem; margin: auto; gap: 28.6rem;}
#awards .inner h2 {font-size: 8.6rem; margin-bottom: 13.1rem; padding-left: 2rem;}
#awards .inner .title p {writing-mode: vertical-rl; text-orientation: mixed; display: flex; flex-direction: column; gap: 1.8rem; font-family: "Zen Old Mincho", serif; font-size: 3.3rem; padding-left: 5.7rem;}
#awards .inner .title p span {font-size: 2.2rem;}

#awards .kiroku {line-height: 2.125; padding-top: 1.9rem;}

#awards .mugen-scroll {overflow: hidden; width: 100%; margin-top: 10.2rem;}
#awards .mugen-scroll .track {display: flex; width: max-content; animation: scroll-left 40s linear infinite;}
#awards .mugen-scroll img {display: block;}

@keyframes scroll-left {
	from {
		transform: translateX(0);
	}
	to {
		transform: translateX(-50%);
	}
}

@keyframes scroll-right {
	from {
		transform: translateX(-50%);
	}
	to {
		transform: translateX(0);
	}
}

@media screen and (max-width: 768px) {
	#awards {padding-top: 11.2rem;}
	#awards .inner {flex-direction: column; gap: 11.8rem;}
	#awards .inner h2 {padding: 0;}
	#awards .inner .title {display: flex; justify-content: space-between; padding: 0 8.1rem 0 7.4rem;}
	#awards .kiroku {line-height: 1.821428571428571; font-size: 2.8rem; padding: 0 7.8rem;}

	#awards .mugen-scroll {margin-top: 15.8rem;}
	#awards .mugen-scroll img {width: auto; height: 33.8rem;}
}


/* =================================================================
about
=================================================================*/
#about {margin-top: 13.4rem;}
#about h2 {font-size: 4.1rem; line-height: 2.048780487804878; margin-bottom: 17.3rem;}
#about .text {display: flex; align-items: flex-end; justify-content: space-between;}
#about .text p {line-height: 1.909090909090909;}
#about .text h3 {font-size: 8.6rem;}

#about .inner {width: 100%; max-width: 120rem; margin: auto;}
#about .inner .graf {border: 1px solid #000; display: flex; padding: 5.5rem 0 13rem 8.4rem; gap: 7.9rem; margin-top: 10rem;}
#about .inner .graf h3 {writing-mode: vertical-rl; text-orientation: mixed; display: flex; flex-direction: column; gap: 2.1rem; font-size: 3.3rem;}
#about .inner .graf h3 span {font-size: 2.2rem;}
#about .inner .graf picture {display: block;}
#about .inner .graf .flex {display: flex; align-items: flex-start; gap: 9.3rem;}
#about .inner .graf .img01 {margin-top: 6.3rem; width: 15.1rem;}
#about .inner .graf .img02 {width: 55.8rem;}
#about .inner .graf .img03 {margin-top: 4rem; width: 83.2rem;}
#about .inner .graf .img04 {margin-top: 10.1rem; width: 82.5rem;}

@media screen and (max-width: 768px) {
	#about {margin-top: 20.4rem;}
	#about h2 {padding: 0 5.3rem; margin-bottom: 11.2rem;}
	#about .text {padding: 0 3.9rem 0 5.5rem; flex-direction: column;}
	#about .text h3 {font-size: 8.6rem; margin-top: 18.9rem;}
	#about .inner .graf-wrap {padding: 0 3.7rem;}
	#about .inner .graf {flex-direction: column; width: 100%; position: relative; padding: 5.6rem 3.5rem;}
	#about .inner .graf h3 {position: absolute; left: 5.3rem; top: 4.3rem;}
	#about .inner .graf .flex {flex-direction: column; gap: 0;}
	#about .inner .graf .img01 {margin-top: 6.3rem; width: 25.8rem; margin-top: 0; align-self: flex-end;}
	#about .inner .graf .img02 {width: 60rem; margin-top: 26.7rem;}
	#about .inner .graf .img03 {margin-top: 14.8rem; width: 62.4rem; margin-top: 14.8rem;}
	#about .inner .graf .img04 {margin-top: 12.2rem; width: 62.3rem; margin-top: 12.2rem;}
}

/* =================================================================
reason
=================================================================*/
#reason {margin-top: 13.1rem; padding-bottom: 14.1rem;}
#reason h2 {font-size: 5.5rem; text-align: center; margin-bottom: 6.7rem;}
#reason p {text-align: center; line-height: 1.909090909090909;}
#reason .image {margin-top: 8.1rem; display: flex; gap: 1.5rem; position: relative;}
#reason .image img {width: calc((100% - 1.5rem*4) / 5); will-change: transform;}

@media screen and (max-width: 768px) {
	#reason {overflow: hidden;}
	#reason h2 {line-height: 1.3;}
	#reason p {text-align: left; max-width: 52rem; margin: auto;}
	#reason .image-wrap {display: flex; justify-content: center;}
	#reason .image {width: 220.4rem; flex-shrink: 0;}
}

/* =================================================================
entry-form
=================================================================*/
#entry-form {padding-top: 14.1rem;}
#entry-form h2 {font-size: 8.6rem; text-align: center; margin-bottom: 7.4rem;}
#entry-form h3 {text-align: center; font-size: 3.6rem; margin-bottom: 5.6rem;}
#entry-form p {text-align: left; line-height: 1.909090909090909;}

#entry-form .form-area {border: 1px solid #000; background: #e6e3e3; width: 100%; max-width: 109.3rem; margin: 10.9rem auto 0; padding: 10.6rem 12.3rem 7.8rem;}
#entry-form .form-area table {width: 100%;}
#entry-form .form-area th {text-align: left; font-size: 2.6rem; width: 19.2rem; padding-top: 1.8rem; line-height: 1; font-weight: 600;}
#entry-form .form-area td {padding-bottom: 3.4rem; vertical-align: top;}
#entry-form .form-area input[type=text],
#entry-form .form-area input[type=tel],
#entry-form .form-area input[type=email],
#entry-form .form-area textarea {width: 100%; border: 0; min-height: 6.7rem; padding: 1rem; font-size: 2.2rem;}
#entry-form .form-area textarea {min-height: 17.9rem;}
#entry-form .form-area select {border: 0; min-height: 6.7rem; padding: 1rem; font-size: 2.2rem; font-family: "Zen Old Mincho", serif; font-weight: 600;}
#entry-form .select-wrap select {appearance: none; -webkit-appearance: none; -moz-appearance: none; background-image: url("../img/recruit/icon-arrow_select.svg"); background-repeat: no-repeat; background-position: right 1.2rem center; background-size: 1.2rem; padding-right: 4rem;}

#entry-form .radio-wrap label { display: flex; align-items: center; gap: 1rem; cursor: pointer; font-size: 2.6rem; }
#entry-form .radio-wrap label + label {margin-top: 1.2rem;}
#entry-form .radio-wrap input[type="radio"] { appearance: none; -webkit-appearance: none; width: 3rem; height: 3rem; background: #fff; border-radius: 50%; position: relative; cursor: pointer; }
#entry-form .radio-wrap input[type="radio"]::after { content: ""; position: absolute; top: 50%; left: 50%; width: 1.7rem; height: 1.7rem; background: #000; border-radius: 50%; transform: translate(-50%, -50%) scale(0); transition: transform 0.2s ease; }
#entry-form .radio-wrap input[type="radio"]:checked::after { transform: translate(-50%, -50%) scale(1); }

#entry-form .form-area .button {display: flex; justify-content: center; padding-top: 4.9rem;}
#entry-form .form-area .button input {width: 43.4rem; height: 7.9rem; background: #000; border: 0; color: #fff; font-size: 2.6rem; font-family: "Zen Old Mincho", serif;}

#entry-form .sns {width: 100%; max-width: 109.3rem; margin: 6.2rem auto 0; display: flex; align-items: center; justify-content: space-between;}
#entry-form .sns p {text-align: left; font-weight: 700; font-family: "Zen Old Mincho", serif; padding-left: 6.6rem;}
#entry-form .sns ul {display: flex; flex-direction: column; gap: 1.9rem;}
#entry-form .sns ul li a {display: flex; align-items: center; gap: 3.5rem; font-weight: 700;}

@media screen and (max-width: 768px) {
	#entry-form {padding-top: 0rem;}
	#entry-form p {font-size: 2.2rem;}
	#entry-form .form-area-wrap {padding: 0 2rem;}
	#entry-form .form-area {padding: 10.6rem 3.9rem 7.8rem;}
	#entry-form .form-area th,
	#entry-form .form-area td {display: block; width: 100%;}
	#entry-form .form-area th {padding-bottom: 1.3rem;}

	#entry-form .form-area .flex {display: flex; gap: 14.7rem;}
	#entry-form .form-area .address .sp-only {padding-top: 2rem;}

	#entry-form .sns {flex-direction: column; align-items: flex-start; padding-left: 6.3rem;}
	#entry-form .sns p {padding-left: 0;}
	#entry-form .sns ul {margin-top: 12.1rem; font-size: 2.3rem;}
}