@charset "UTF-8";

.c-visually-hidden {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	border: 0;
}

html{
	scroll-behavior: smooth;
}

body {
	font-family: Yu Gothic Medium, "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
	font-size: 1rem;
	font-feature-settings: "palt";
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
	word-break: normal;
	display: flex;
	flex-direction: column;
	min-width: 320px;
	min-height: 100vh;
}

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

a {
	color: #000;
	text-decoration: none;
	transition: all 0.3s ease;
}

.c-wysiwyg h1 {
	font-size: 2rem;
	font-weight: bold;
	text-align: center;
	margin-bottom: 64px;
}

.c-wysiwyg h2 {
	font-size: 1.5rem;
	font-weight: bold;
	margin-bottom: 16px;
}

.c-wysiwyg p + h2,
.c-wysiwyg ul + h2,
.c-wysiwyg ol + h2 {
	margin-top: 48px;
}

.c-wysiwyg p + h3,
.c-wysiwyg ul + h3,
.c-wysiwyg ol + h3 {
	margin-top: 32px;
}

.c-wysiwyg h3 {
	position: relative;
	padding-left: 20px;
	font-size: 1.5rem;
	font-weight: bold;
	margin-bottom: 16px;
}

.c-wysiwyg h3::before{
	content: "";
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: 3px;
	height: 100%;
	border-radius: 50vh;
	background: #007BB2;
}

.c-wysiwyg h4 {
	font-weight: bold;
	color: #007BB2;
	font-size: 1.25rem;
	line-height: 1.2;
	margin-bottom: 16px;
}

.c-wysiwyg h5 {
	position: relative;
	padding-left: 16px;
	font-size: 1.125rem;
	font-weight: bold;
	margin-bottom: 16px;
}

.c-wysiwyg h5::before{
	content: "";
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: 3px;
	height: 100%;
	border-radius: 50vh;
	background: #007BB2;
}

.c-wysiwyg h6 {
	color: #007BB2;
	font-size: 1.125rem;
	font-weight: 700;
	line-height: 1.2;
	margin-bottom: 16px;
}

.c-wysiwyg p {
	color: #6B6B6B;
	font-size: 1.125rem;
	line-height: 2;
	margin-bottom: 16px;
}

.c-wysiwyg a {
	color: #007BB2;
	text-decoration: underline;
}

.c-wysiwyg a:hover {
	text-decoration: none;
}

.c-wysiwyg table {
	width: 100%;
	line-height: 1.5;
	margin-bottom: 16px;
}

.c-wysiwyg th {
	padding: 24px;
	text-align: left;
	font-size: 1.125rem;
	font-weight: bold;
	color: #fff;
	background: #6B6B6B;
	border: 1px solid #EDEDED;
}

.c-wysiwyg td {
	padding: 24px;
	text-align: left;
	font-size: 1.125rem;
	background: #fff;
	border: 1px solid #EDEDED;
}

.p-formWrapper .c-wysiwyg th,
.p-formWrapper .c-wysiwyg td{
	padding: 8px;
	font-size: 1rem;
}

.p-formWrapper .c-wysiwyg th{
	color: #000;
	font-weight: normal;
	background: #d9d9d9;
}

.c-wysiwyg ul {
 list-style: none;
}

.c-wysiwyg ul li {
	position: relative;
	color: #6B6B6B;
	font-size: 1.125rem;
	padding-left: 1em;
	line-height: 1.5;
}

.p-formWrapper .c-wysiwyg ul li{
	font-size: 1rem;
}

.c-wysiwyg ul li:not(:last-child) {
	margin-bottom: 16px;
}

.c-wysiwyg ul li::before {
	content: "";
	display: block;
	position: absolute;
	top: 0.4em;
	left: 0;
	width: 8px;
	height: 8px;
	border-radius: 4px;
	background: #007BB2;
}

.c-wysiwyg ol li {
	color: #6B6B6B;
	font-size: 1.125rem;
	margin: 0 0 0.85rem 1.6rem;
	list-style: decimal;
	line-height: 1.5;
}

.c-wysiwyg td ul li,
.c-wysiwyg td ol li{
	color: #000;
}

.c-wysiwyg ol li:not(:last-child) {
	margin-bottom: 16px;
}

.c-attachment__list{
	margin-top: 24px;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.c-attachment__transition{
	width: fit-content;
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 16px 80px 16px 30px;
	border: 1px solid #6B6B6B;
	border-radius: 50vh;
	color: #6B6B6B;
	font-size: 1.125rem;
	font-weight: bold;
	position: relative;
}

.c-attachment__transition:hover{
	border: 1px solid #fff;
	background: #007BB2;
	color: #fff;
}

.c-attachment__transition--ico{
	opacity: 0;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	height: 100%;
	aspect-ratio: 1 / 1;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 50vh;
}

.c-attachment__transition:hover .c-attachment__transition--ico{
	transition: .3s;
	opacity: 1;
}

.c-attachment__transition:hover .c-attachment__transition--external{
	animation: attachmentExternalAnimation .3s linear;
	transform: translate(1px, -1px);
}

@keyframes attachmentExternalAnimation {
	from {
		transform: translate(-5px, 5px);
	}
	to {
		transform: translate(1px, -1px);
	}
}

.c-btnArea{
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 24px;
}

.c-btn{
	position: relative;
	transition: .3s;
	min-width: 200px;
	padding: 16px 48px;
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 7px;
	line-height: 1;
	color: #fff;
	font-size: 1.125rem;
	font-weight: bold;
	background: #007BB2;
	border: 2px solid #007BB2;
	border-radius: 50vh;
	box-shadow: 0 0 8px 0 rgba(0,0,0,0.2);
}

.c-btn:hover{
	background: #00A0E9;
	border-color: #00A0E9;
}

.c-btn--inactive{
	pointer-events: none;
	opacity: 0.3;
	box-shadow: none;
}

.c-btn--negative{
	color: #007BB2;
	background: #fff;
}

.c-btn--negative:hover{
	color: #fff;
	background: #6B6B6B;
	border-color: #6B6B6B;
}

.c-btn__status{
	color: #007BB2;
	font-size: 1.125rem;
	font-weight: bold;
	text-align: center;
}

.c-btn__txt{
	font-size: 1.125rem;
	font-weight: bold;
	color: #007BB2;
}

.c-btn__txt:hover{
	text-decoration: underline;
}

.c-btn__icon{
	opacity: 0;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	height: 100%;
	aspect-ratio: 1 / 1;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 50vh;
}

.c-btn__icon.c-btn__icon--left{
	left: 0;
	right: inherit;
}

.c-btn:hover .c-btn__icon{
	transition: .3s;
	opacity: 1;
}

.c-btn:hover .c-btn__icon--arrowR{
	animation: btnArrowRightAnimation .3s linear;
	transform: translateX(1px);
}

@keyframes btnArrowRightAnimation {
	from {
		transform: translateX(-7px);
	}
	to {
		transform: translateX(1px);
	}
}

.c-btn:hover .c-btn__icon--arrowL{
	animation: btnArrowLeftAnimation .3s linear;
	transform: translateX(-1px);
}

@keyframes btnArrowLeftAnimation {
	from {
		transform: translateX(7px);
	}
	to {
		transform: translateX(-1px);
	}
}

.c-btn:hover .c-btn__icon--external{
	animation: btnExternalAnimation .3s linear;
	transform: translate(1px, -1px);
}

@keyframes btnExternalAnimation {
	from {
		transform: translate(-5px, 5px);
	}
	to {
		transform: translate(1px, -1px);
	}
}

.c-btn:hover .c-btn__icon--mail{
	animation: btnMailAnimation .3s linear;
	transform: translateY(1px);
}

@keyframes btnMailAnimation {
	from {
		transform: translateY(-7px);
	}
	to {
		transform: translateY(1px);
	}
}

.c-btn:hover .c-btn__icon--login{
	animation: btnLoginAnimation .3s linear;
	transform: translateX(1px);
}

@keyframes btnLoginAnimation {
	from {
		transform: translateX(-7px);
	}
	to {
		transform: translateX(1px);
	}
}

.c-modal {
	position: fixed;
	inset: 0;
	display: none;
	z-index: 9999;
}

.c-modal__overlay {
	position: absolute;
	inset: 0;
	background: rgba(0,0,0,0.6);
}

.js-close-modal{
	cursor: pointer;
}

.c-modal__window {
	position: absolute;
	top: 50%;
	left: 50%;
	width: calc(100% - 32px);
	max-width: 1080px;
	max-height: calc(100vh - 64px);
	overflow-y: scroll;
	background: #fff;
	border-radius: 15px;
	padding: 48px;
	transform: translate(-50%, -50%);
}

.c-modal__window--mymenu{
	top: 64px;
	right: 64px;
	left: auto;
	display: inline-block;
	width: max-content;
	max-width: calc(100% - 32px);
	transform: none;
	background: #007BB2;
	padding: 0!important;
}

.c-modal__window--complete{
	max-width: 675px;
}

.c-modal__window--mymenu .c-btnArea{
	border-top: 1px solid #fff;
	padding: 16px;
}

.c-modal__window--mymenu .c-btn--negative{
	border-color: #fff;
	color: #fff;
	background: #007BB2;
}

.c-modal__window--mymenu .c-btn--negative:hover{
	color: #007BB2;
	background: #fff;
}

.p-notice{
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	padding: 16px;
	color: #fff;
	font-size: 1.125rem;
	background: #007BB2;
	border-radius: 5px;
	box-shadow: 0 0 8px 0 rgba(0,0,0,0.2);
}

.p-notice__close{
	width: 32px;
	height: 32px;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 50vh;
	background: #006A9A;
	border: 1px solid #6B6B6B;
}

.p-notice__close:hover{
	transition: .3s;
	background: #6B6B6B;
}

.p-header{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 16px;
	border-bottom: 1px solid #EDEDED;
	background: #fff;
}

.p-header.is-sticky{
	position: sticky;
	top: 0;
	z-index: 3;
}

.p-header.p-header--from{
	justify-content: center;
}

.p-header__transition:hover{
	opacity: 0.8;
}

.p-login__transition{
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 8PX;
	border-radius: 50vh;
	border: 2px solid #00A0E9;
	background-color: #dff5ff;
	padding-left: 24px;
}

.p-login__transition:hover{
	color: #fff;
	background-color: #00A0E9;
}

.p-login__txt{
	font-weight: bold;
}

.p-login__icon{
	width: 48px;
	height: 48px;
	display: flex;
	justify-content: center;
	align-items: center;
	border: 1px solid #EDEDED;
	border-radius: 50vh;
	background: #007BB2;
}

.p-login__transition:hover .p-login__icon{
	transition: .3s;
}

.p-login__transition:hover .p-login__icon--arrow,
.c-btn__txt:hover .p-login__icon--arrow{
	animation: loginArrowAnimation .3s linear;
	transform: translateX(1px);
}

@keyframes loginArrowAnimation {
	from {
		transform: translateX(-7px);
	}
	to {
		transform: translateX(1px);
	}
}

.p-mymmenu{
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 16px;
}

.p-mymenu__icon{
	width: 48px;
	height: 48px;
	display: flex;
	justify-content: center;
	align-items: center;
	border: 1px solid #007BB2;
	border-radius: 50vh;
	background: #fff;
}

.p-mymmenu .p-mymenu__icon{
	border: 1px solid #007BB2;
	background: #fff;
}

.p-mymenu__transition,
.p-mymenuClose__transition{
	cursor: pointer;
}

.p-mymenu__transition .p-mymenu__icon:hover{
	transition: .3s;
	background: #007BB2;
}

.p-mymenu__transition .p-mymenu__icon:hover svg{
	stroke: #fff;
}

.p-mymmenu__transition{
	color: #fff;
	font-weight: bold;
	font-size: 1.125rem;
}

.p-mymmenu__transition:hover{
	text-decoration: underline;
}

.p-mymenuClose__transition{
	top: 16px;
	right: 16px;
	position: absolute;
}

.p-mymenuClose__icon{
	width: 48px;
	height: 48px;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 50vh;
	background: #6B6B6B;
	border: 1px solid #fff;
}

.p-mymenuClose__icon:hover{
	transition: .3s;
	background: #006A9A;
}

.p-main{
	flex: 2;
}

.p-main__inner{
	display: flex;
	align-items: flex-start;
	gap: 24px;
	width: 100%;
	max-width: 1080px;
	margin: 64px auto 0;
}

.p-pageTop{
	width: calc(100% - 32px);
	max-width: 1080px;
	margin: 64px auto 0;
	text-align: right;
}

.p-pageTop__transition{
	display: inline-flex;
	justify-content: center;
	align-items: center;
	gap: 8px;
	color: #fff;
	font-size: 0.75rem;
	font-weight: bold;
	background: #6B6B6B;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	padding: 8px;
}

.p-pageTop__icon{
	display: flex;
}

.p-pageTop__icon svg{
	stroke-width: 1;
}

.p-pageTop__transition:hover .p-pageTop__icon--arrow{
	animation: pageTopAnimation .3s linear;
	transform: translateY(0px);
}

@keyframes pageTopAnimation {
	from {
		transform: translateY(7px);
	}
	to {
		transform: translateY(0px);
	}
}

.p-footer{
	border-top: 1px solid #EDEDED;
	padding: 48px 16px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24px;
}

.p-footerLogo__transition:hover{
	opacity: 0.8;
}

.p-footerNavi__list{
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	gap: 24px;
}

.p-footerNavi__transition{
	color: #007BB2;
}

.p-footerNavi__transition:hover{
	text-decoration: underline;
}

.p-footer__copyright{
	text-align: center;
	color: #6B6B6B;
	font-size: 0.75rem;
}

.p-topInfo{
	font-size: 1.125rem;
	padding: 16px;
	background: #E88E00;
	text-align: center;
}

.p-topKv{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
	background: url(../img/kv.jpg) no-repeat;
	background-position: center;
	background-size: cover;
	color: #fff;
	font-size: 1.5rem;
	text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
	padding: 170px 16px;
}

.p-topKv__logo{
	padding: 8px 16px;
	margin: 8px;
	border-radius: 5px;
	border: 1px solid #fff;
}

.p-topKv__copy{
	margin-top: 16px;
	font-weight: bold;
	line-height: 1.75;
}

.p-topEntryList{
	margin-top: -85px;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 16px;
}

.p-topEntryItem{
	position: relative;
	width: 300px;
	overflow: hidden;
	border-radius: 5px;
	background: #fff;
	box-shadow: 0 0 8px 0 rgba(0,0,0,0.2);
	display: flex;
	flex-direction: column;
	transition: .3s;
}

.p-topEntryItem:hover{
	transform: scale(1.05, 1.05);
	box-shadow: 0 0 4px 0 rgba(0,0,0,0.1);
}

.p-topEntryItem__deadline{
	position: absolute;
	top: 16px;
	left: 0;
	color: #fff;
	font-size: 0.875rem;
	font-weight: bold;
	background: #007BB2;
	padding: 0 8px;
}

.p-topEntryItem__txt{
	position: relative;
	padding: 16px;
}

.p-topEntryItem__status{
	width: fit-content;
	display: inline-flex;
	justify-content: center;
	align-items: center;
	color: #fff;
	font-size: 0.875rem;
	font-weight: bold;
	border-radius: 50vh;
	padding: 0 8px;
	position: absolute;
	top: -12px;
	left: 0;
	right: 0;
	margin: auto;
	z-index: 2;
}

.p-topEntryItem--open .p-topEntryItem__status{
	background: #007BB2;
	border: 3px solid #fff;
}

.p-topEntryItem--stopped .p-topEntryItem__status{
	background: #6B6B6B;
	border: 3px solid #fff;
}

.p-topEntryItem__title{
	font-size: 1.5rem;
	font-weight: bold;
}

.p-topEntryItem__summary{
	color: #6B6B6B;
	line-height: 2;
	margin-top: 16px;
	overflow: hidden;
	display: -webkit-box;
	text-overflow: ellipsis;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 4;
}

.p-detail{
	flex: 2;
	margin-bottom: 64px;
}

.p-detail__thumb{
	width: 100%;
	border-radius: 5px;
	overflow: hidden;
	position: relative;
	z-index: -1;
	margin-bottom: -125px;
}

.p-detail__thumb img{
	width: 100%;
	height: auto;
}

.p-detail__thumb::after{
	content: "";
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	width: 100%;
	height: 100%;
	background: linear-gradient(180deg,rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 70%);
}

.p-detail__deadline{
	color: #6B6B6B;
}

.p-detail__title{
	margin-top: 8px;
	font-size: 2rem;
	font-weight: bold;
}

.p-detail__caution{
	color: #6B6B6B;
	font-size: 1.5rem;
	margin-top: 24px;
	margin-bottom: 16px;
}

.p-detail__caution span{
	color: #D40808;
	font-weight: bold;
}

.p-detailPoint__list{
	margin-top: 8px;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.p-detailPoint__item{
	color: #007BB2;
	border: 1px solid #007BB2;
	border-radius: 5px;
	padding: 0 8px;
}

.p-detailPoint{
	margin-top: 64px;
}

.p-detailPoint dt{
	font-size: 1.5rem;
	font-weight: bold;
}

.p-detailPoint dt:first-child{
	padding-top: 24px;
	border-top: 1px solid #EDEDED;
}

.p-detailPoint dd{
	color: #6B6B6B;
	font-size: 1.125rem;
	line-height: 2;
	padding-bottom: 24px;
	border-bottom: 1px solid #EDEDED;
	margin-top: 8px;
	margin-bottom: 24px;
}

.p-detail__summary{
	color: #6B6B6B;
	line-height: 2;
	margin-top: 24px;
}

.p-detailLecturer{
	margin-top: 64px;
	display: flex;
	align-items: flex-start;
	gap: 24px;
	padding: 24px;
	border: 1px solid #EDEDED;
	border-radius: 5px;
	background: #FAFBF6;
}

.p-detailLecturer__thumb{
	overflow: hidden;
	border-radius: 50vh;
}

.p-detailLecturer__txt{
	flex: 2;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.p-detailLecturer__title{
	font-weight: bold;
}

.p-detailLecturer__summary{
	color: #6B6B6B;
	font-size: 0.875rem;
	font-weight: bold;
	line-height: 2;	
}

.p-detailLecturer__message{
	color: #6B6B6B;
	line-height: 2;	
}

.p-detailSection__title{
	margin-top: 64px;
	position: relative;
	padding-left: 20px;
	font-size: 1.5rem;
	font-weight: bold;
}

.p-detailSection__title::before{
	content: "";
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: 3px;
	height: 100%;
	border-radius: 50vh;
	background: #007BB2;
}

.p-detailWrapper{
	margin-top: 64px;
	display: flex;
	align-items: flex-start;
	justify-content: center;
	gap: 24px;
}

.p-detailSection__title + .p-detailWrapper{
	margin-top: 24px;
}

.p-detailWrapper__img{
	overflow: hidden;
	border-radius: 5px;
}

.p-detailWrapper p{
	font-size: 1.125rem;
	line-height: 2;
	flex: 2;
}

.p-detailStep{
	margin-top: 24px;
}

.p-detailStep__title{
	font-size: 1.125rem;
	font-weight: bold;
	padding: 16px;
	background: #FAFBF6;
	border: 1px solid #EDEDED;
	border-radius: 5px;
}

.p-detailStep__title--comp{
	color: #fff;
	background: #007BB2;
}

.p-detailStep__summary{
	position: relative;
	color: #6B6B6B;
	font-size: 1.125rem;
	padding: 16px 0 24px 48px;
}

.p-detailStep__summary::before{
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 24px;
	margin: auto;
	width: 3px;
	height: 100%;
	background: #EDEDED;
}

.p-detailStep__summary:last-child::before{
	content: none;
}

.p-detailSide{
	position: sticky;
	top: 100px;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	padding: 16px;
	background: #FAFBF6;
	border: 1px solid #EDEDED;
	border-radius: 5px;
	margin-bottom: 24px;
	transition: transform .3s ease-in;
}

.p-detailSide.is-hidden {
	transform: translateY(100%);
}

.p-detailSidePoint{
	width: 100%;
}

.p-detailSidePoint dt{
	color: #6B6B6B;
}

.p-detailSidePoint dd{
	font-size: 1.5rem;
	font-weight: bold;;
}

.p-detailSidePoint dd span{
	font-size: 0.875rem;
	color: #6B6B6B;
}

.p-detailSidePoint dd + dt{
	margin-top: 8px;
}

.p-detailInfo{
	position: relative;
	padding: 64px 16px;
	background: #FAFBF6;
}

.p-detailInfo__inner{
	display: flex;
	flex-direction: column;
	gap: 24px;
	width: 100%;
	max-width: 1080px;
	margin: 0 auto;
}

.p-detailInfo__title{
	font-size: 2rem;
	font-weight: bold;
	text-align: center;
}

.p-detailInfo__code{
	position: absolute;
	top: 24px;
	right: 24px;
	color: #6B6B6B;
	text-align: right;
}

.p-detailInfo__summary{
	font-size: 1.125rem;
	line-height: 2;
}

.p-detailInfoContact__title{
	font-size: 1.5rem;
	font-weight: bold;
}

.p-detailInfoContact__summary{
	margin-top: -16px;
	font-size: 1.125rem;
	line-height: 2;
}

.p-cc__list{
	margin-top: 16px;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 24px;
}

.p-form{
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 64px;
}

.p-formHeader{
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 16px;
	border: 1px solid #EDEDED;
	border-radius: 5px;
	background: #FAFBF6;
	padding: 24px;
}

.p-formHeader.p-formHeader--err {
	border: 2px solid #D40808;
	background: #FFEAEA;
}

.p-formHeaderStepCircle{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 120px;
	height: 120px;
	margin: 0 auto;
	border-radius: 50vh;
	background: conic-gradient(#007bb2 0deg, #d9d9d9 0deg 360deg);
}

.p-formHeaderStepCircle {
	--progress-color: #007bb2;
	--bg-color: #d9d9d9;
}

.p-formHeader--err .p-formHeaderStepCircle {
	--progress-color: #D40808;
}

.p-formHeaderStepCircle__txt{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 4px;
	width: 108px;
	height: 108px;
	border-radius: 50vh;
	background: #fff;
	line-height: 1;
}

.p-formHeaderStepCircle__step{
	color: #007BB2;
	font-size: 0.75rem;
	font-weight: bold;
}

.p-formHeader--err .p-formHeaderStepCircle__step{
	color: #D40808;
}

.p-formHeaderStepCircle__data{
	color: #6B6B6B;
	font-size: 1.25rem;
	font-weight: bold;
}

.p-formHeaderStepCircle__current{
	color: #007BB2;
	font-size: 2rem;
	font-weight: bold;
}

.p-formHeader--err .p-formHeaderStepCircle__current{
	color: #D40808;
}

.p-formHeaderNotice{
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px 16px;
	font-size: 0.875rem;
	color: #6B6B6B;
}

.p-formHeaderNotice__current{
	color: #007BB2;
	font-weight: bold;
}

.p-formHeader--err .p-formHeaderNotice__current{
	color: #D40808;
}

.p-formHeader__title{
	font-size: 2rem;
	font-weight: bold;
}

.p-from__summary{
	font-size: 1.125rem;
	line-height: 2;
	font-weight: bold;
	text-align: center;
}

.p-formWrapper{
	display: flex;
	flex-direction: column;
	gap: 24px;
	border: 1px solid #EDEDED;
	border-radius: 5px;
	background: #FAFBF6;
	padding: 24px;
}

.p-formWrapper__scroll{
	margin-top: 24px;
	padding: 24px;
	background: #fff;
	border: 4px solid #EDEDED;
	border-radius: 5px;
	height: 300px;
	overflow-y: scroll;
	box-shadow: 0 -8px 20px -5px rgba(107, 107, 107, 0.2) inset;
}

.js-agreeTarget {
 display: none;
}

.js-agreeTarget.is-show {
 display: block;
}

.p-formTerms__summary{
	color: #6B6B6B;
	font-size: 1.125rem;
	text-align: center;
}

.p-form__inner{
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 64px;
}

.p-form__label{
	font-size: 1.125rem;
	font-weight: bold;
	display: flex;
	align-items: center;
	gap: 8px;
}

.p-form__label--note{
	color: #6B6B6B;
	font-weight: bold;
	font-size: 1rem;
}

.p-form__label input[type="checkbox"]{
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.p-form__checkbox{
	display: inline-block;
	width: 24px;
	height: 24px;
	background-repeat: no-repeat;
	background-size: cover;
	background-image: url(../img/checkebox.svg);
}

input[type="checkbox"]:checked + .p-form__checkbox{
	background-image: url(../img/checkebox-checked.svg);
}

.p-form__label input[type="radio"]{
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.p-form__radio{
	display: inline-block;
	width: 24px;
	height: 24px;
	background-repeat: no-repeat;
	background-size: cover;
	background-image: url(../img/radio.svg);
}

input[type="radio"]:checked + .p-form__radio{
	background-image: url(../img/radio-checked.svg);
}

.p-form__agree{
	margin-top: -8px;
	display: flex;
	justify-content: center;
}

.p-form__agree .p-form__label{
	cursor: pointer;
}

.p-from__list{
	max-width: 360px;
	margin: auto;
	display: inline-flex;
	flex-direction: column;
	gap: 48px;
}

.p-from__list--confirm{
	width: calc(100% - 32px);
	margin-bottom: 24px;
}

.p-from__item{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 8px;
	min-width: 360px;
}

.p-from__list--confirm .p-from__item{
	position: relative;
}

.p-from__list--confirm .p-from__item::after{
	content: "";
	position: absolute;
	margin: auto;
	right: 0;
	bottom: -24px;
	left: 0;
	width: 100%;
	height: 1px;
	background: #EDEDED;
}

.p-from__required{
	padding: 0 8px;
	border-radius: 5px;
	font-size: 0.875rem;
	font-weight: bold;
	color: #fff;
	background: #D40808;
}

.p-form__label--point{
	color: #007BB2;
	font-size: 1.5rem;
	font-weight: bold;
}

.p-form__input,
.p-form__select{
	font-family: Yu Gothic Medium, "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
	max-width: 360px;
	width: 100%;
	padding: 8px 16px;
	font-size: 1.125rem;
	border: 2px solid #6B6B6B;
	border-radius: 5px;
	background: #fff;
}

.p-form__input--wrapper{
	display: flex;
	align-items: center;
	gap: 8px;
	margin-top: 8px;
}

.p-form__input--wrapper .p-form__input{
	max-width: 90px;
}

.p-form__input--wrapper .c-btn{
	border-radius: 5px;
	padding: 8px;
	min-width: inherit;
	line-height: inherit;
}

.p-form__select{
	padding-right: 50px;
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
}

.p-form__select--wrapper{
	position: relative;
}

.p-form__select--wrapper::after{
	content: "";
	position: absolute;
	top: 0;
	right: 16px;
	bottom: 0;
	margin: auto;
	width: 24px;
	height: 24px;
	background: url(../img/chevron-down.svg) no-repeat;
	background-size: cover;
}

.p-from__item--err .p-form__input,
.p-from__item--err .p-form__select{
	border-color: #D40808;
	background: #FFEAEA;
	box-shadow: 0 0 8px 0 rgba(0,0,0,0.2);
}

.p-from__err{
	color: #D40808;
	font-weight: bold;
}

.p-from__note{
	line-height: 2;
}

.p-from__confirm{
	color: #6B6B6B;
	font-size: 1.125rem;
}

.p-form__title{
	color: #6B6B6B;
	font-size: 1.5rem;
	font-weight: bold;
	text-align: center;
}

.p-from__item + .p-form__title{
	margin-top: 16px;
	padding-top: 64px;
	border-top: 3px solid #EDEDED;
}

.p-form__password--wrapper{
	position: relative;
	max-width: 360px;
	width: 100%;
}

.p-form__password--wrapper .p-form__input{
	padding-right: 50px;
}

.p-form__password--toggle{
	content: "";
	position: absolute;
	top: 0;
	right: 16px;
	bottom: 0;
	margin: auto;
	width: 24px;
	height: 24px;
	background: url(../img/eye-off.svg) no-repeat;
	background-size: cover;
}

.p-form__password--toggle.is-active {
	background: url(../img/eye.svg) no-repeat;
	background-size: cover;
}

.p-chapterList{
	margin-top: 64px;
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.p-chapterItem{
	position: relative;
	border-radius: 10px;
	background: #fff;
	box-shadow: 0 0 8px 0 rgba(0,0,0,0.2);
	transition: .3s;
}

@media (hover: hover) {
	.p-chapterItem:hover{
		transform: scale(1.05, 1.05);
		box-shadow: 0 0 4px 0 rgba(0,0,0,0.1);
	}
}

.p-chapterItem--lock{
	box-shadow: none;
}

.p-chapterItem--lock.p-chapterItem:hover{
	transform: none;
	box-shadow: none;
}

.p-chapterItem--current::before{
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: -24px;
	margin: auto;
	width: 24px;
	height: 24px;
	background: url(../img/ch-current.svg) no-repeat;
	background-position: center;
}

.p-chapterItem--current .p-chapterItemStatus{
	display: none !important;
	opacity: 0;
}

.p-chapterItem__transition{
	display: flex;
}

.p-chapterItem__thumb{
	overflow: hidden;
	width: 200px;
	border-radius: 10px 0 0 10px;
}

.p-chapterItem__txt{
	flex: 2;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 16px;
}

.p-chapterItem__title{
	font-size: 1.5rem;
	font-weight: bold;
	overflow: hidden;
	display: -webkit-box;
	text-overflow: ellipsis;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

.p-chapterItem__time{
	color: #6B6B6B;
}

.p-chapterItemStatus{
	border-radius: 10px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 10px;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
	color: #fff;
	background: rgba(0, 123, 178, 0.9);
	padding: 16px;
}

.p-chapterItem--lock .p-chapterItemStatus{
	background: rgba(0, 0, 0, 0.9);
}

@media (hover: hover) {
	.p-chapterItem:hover .p-chapterItemStatus{
		transition: .3s;
		opacity: 0;
	}
}

.p-chapterItemStatus__note{
	overflow: hidden;
	display: -webkit-box;
	text-overflow: ellipsis;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
}

.p-chapterItemStatus__title{
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 1.125rem;
	font-weight: bold;
}

.p-chapterItemStatus__link{
	font-size: 1.5rem;
	font-weight: bold;
	text-decoration: underline;
}

.p-chapterItem__thumb img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.p-educationWrapper{
	display: flex;
	gap: 24px;
	margin-bottom: 64px;
}

.p-education__summary{
	margin-top: 16px;
	color: #6B6B6B;
	font-size: 1.125rem;
	line-height: 2;
}

.p-educationWrapper .p-chapterList{
	width: 300px;
	margin-top: 0;
}

.p-educationWrapper .p-chapterItem__thumb{
	width: 120px;
}

.p-educationWrapper .p-chapterItem__txt{
	padding: 8px;
}

.p-educationWrapper .p-chapterItem__title{
	font-size: 1rem;
	font-weight: inherit;
	overflow: hidden;
	display: -webkit-box;
	text-overflow: ellipsis;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

.p-educationWrapper .p-chapterItemStatus__link{
	font-size: 1.125rem;
}

.p-educationVideo{
	flex: 2;
}

.p-educationVideo video{
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;	
}

.p-complete{
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.p-complete__title{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	color: #007BB2;
	font-weight: bold;
	font-size: 1.125rem;
}

.p-complete__message{
	font-weight: bold;
	font-size: 1.5rem;
	text-align: center;
}

@media screen and (max-width: 1100px) {
	.p-main__inner{
		width: calc(100% - 32px);
	}
	.p-educationWrapper{
		flex-direction: column;
	}
	.p-educationWrapper .p-chapterList{
		width: 100%;
	}
	.p-chapterItem--current::before{
		background: none;
		width: calc(100% + 14px);
		height: calc(100% + 12px);
		top: -8px;
		left: -8px;
		bottom: auto;
		margin: auto;
		border: 2px solid #006A9A;
	}
}

@media screen and (max-width: 768px) {
	.c-wysiwyg h1,
	.p-detail__title,
	.p-detailInfo__title,
	.p-formHeader__title{
		font-size: 1.5rem;
	}
	.c-wysiwyg h2,
	.c-wysiwyg h3,
	.p-detail__caution,
	.p-detailPoint dt,
	.p-detailSection__title,
	.p-detailInfoContact__title,
	.p-detailSidePoint dd,
	.p-complete__message,
	.p-chapterItem__title,
	.p-chapterItemStatus__link{
		font-size: 1.25rem;
	}
	.p-detailSidePoint dt{
		font-size: 0.75rem;
	}
	.c-attachment__transition--ico,
	.c-btn__icon{
		display: none;
	}
	.c-attachment__transition{
		padding: 16px;
	}
	.c-btn{
		padding: 16px;
	}
	.p-login__transition{
		padding-left: 0;
	}
	.p-login__txt{
		position: absolute;
		width: 1px;
		height: 1px;
		margin: -1px;
		padding: 0;
		overflow: hidden;
		clip: rect(0, 0, 0, 0);
		border: 0;
	}
	.p-topInfo{
		font-size: 0.875rem;
	}
	.p-topKv{
		font-size: 1.125rem;
		padding: 80px 16px 100px;
	}
	.p-topEntryList{
		flex-direction: column;
		align-items: center;
	}
	.p-detailSide{
		position: fixed;
		top: inherit;
		right: 0;
		left: 0;
		bottom: 0;
		border-radius: 0;
		margin-bottom: 0;
	}
	.p-detailSidePoint{
		display: none;
	}
	.p-detailWrapper{
		flex-direction: column;
	}
	.p-detailWrapper__img{
		margin: auto;
		order: 2;
	}
	.p-formHeader{
		padding: 16px;
	}
	.p-formHeaderStepCircle{
		width: 100px;
		height: 100px;
	}
	.p-formHeaderStepCircle__txt{
		width: 88px;
		height: 88px;
	}
	.p-formHeader__txt{
		display: flex;
		flex-direction: column;
		gap: 8px;
	}
	.p-chapterItem__thumb{
		width: 150px;
	}
	.p-chapterItem__txt{
		flex-direction: column;
		align-items: flex-start;
		gap: 0;
	}
	.p-educationWrapper .p-chapterItem__txt{
		justify-content: center;
	}
	.p-chapterItemStatus__note{
		display: none;
	}
	.c-modal__window{
		padding: 24px;
	}
}

@media screen and (max-width: 480px) {
	.c-btnArea{
		flex-direction: column;
	}
	.c-btn{
		width: calc(100% - 64px);
	}
	.c-wysiwyg th,
	.c-wysiwyg td{
		display: block;
	}
	.p-detail__thumb{
		margin-bottom: -50px;
	}
	.p-detailLecturer{
		flex-direction: column;
		align-items: center;
		gap: 16px;
	}
	.p-detailLecturer__title{
		text-align: center;
	}
	.p-formWrapper__scroll{
		padding: 12px;
	}
	.p-formHeader{
		flex-direction: column;
	}
	.p-formHeaderStepCircle{
		width: 80px;
		height: 80px;
	}
	.p-formHeaderStepCircle__txt{
		width: 72px;
		height: 72px;
		gap: 2px;
	}
	.p-formHeaderStepCircle__step{
		display: none;
	}
	.p-formHeaderNotice{
		font-size: 0.75rem;
		gap: 8px;
	}
	.p-formHeader__title{
		text-align: center;
	}
	.p-formHeader__txt{
		align-items: center;
	}
	.p-from__summary br,
	.p-topKv__copy br{
		display: none;
	}
	.p-from__summary{
		text-align: left;
	}
	.p-formWrapper{
		padding: 16px;
	}
	.p-from__list,
	.p-from__item{
		width: 100%;
	}
	.p-from__item{
		min-width:auto;
	}
	.p-form__input--wrapper .c-btn{
		padding: 4px;
		font-size: 0.875rem;
	}
	.p-formWrapper__scroll .c-wysiwyg p{
		font-size: 1rem;
	}
	.c-wysiwyg h1,
	.p-detail,
	.p-educationWrapper{
		margin-bottom: 32px;
	}
	.p-main__inner,
	.p-pageTop,
	.p-detailPoint,
	.p-detailLecturer,
	.p-detailSection__title,
	.p-detailWrapper,
	.p-chapterList{
		margin-top: 32px;
	}
	.p-detailInfo{
		padding: 32px 16px;
	}
	.p-detailInfo__code{
		top: 16px;
		font-size: 0.75rem;
	}
	.p-form,
	.p-form__inner{
		gap: 32px;
	}
	.p-from__item + .p-form__title{
		padding-top: 32px;
	}
	.p-formWrapper__scroll{
		margin-top: 0;
	}
	.c-modal__window{
		padding: 16px;
	}
	.c-modal__window--mymenu{
		top: 80px;
		left: 50%;
		width: calc(100% - 32px);
		max-width: inherit;
		transform: translateX(-50%);
	}
	.p-chapterItem__thumb{
		width: 120px;
	}
	.p-chapterItem__txt{
		padding: 8px;
	}
	.p-chapterItemStatus{
		gap: 0;
	}
	.p-detail__caution{
		font-size: 1.125rem;
	}
}