@charset "utf-8";
/* ----------------------------------------------------------
	留学プログラム、留学体験談で新たに追加したCSSを記載
---------------------------------------------------------- */

/* !section
---------------------------------------------------------- */
.secForm01 {
	margin-bottom: 60px;
	box-sizing: border-box;
}

.secProgram01 {
	margin-bottom: 80px;
	box-sizing: border-box;
}

.secExperience01 {
	margin-bottom: 110px;
	box-sizing: border-box;
}

.secProgram01 h2,
.secExperience01 h2 {
	margin-bottom: 23px;
}

.secProgram01 .h3_basic,
.secExperience01 .h3_basic {
	margin-bottom: 20px;
}

@media screen and (max-width: 640px) {
	.secForm01 {
		padding: 0 15px;
	}

	.secMain {
		padding: 0 15px;
	}

	.secProgram01 {
		margin-bottom: 70px;
		padding: 0 15px;
	}
	.secExperience01 {
		margin-bottom: 65px;
		padding: 0 15px;
	}

	.secProgram01 h2,
	.secExperience01 h2 {
		margin-bottom: 13px;
	}
}

/* !seachForm01Wrap
---------------------------------------------------------- */
.seachForm01Wrap {
	margin-bottom: 36px;
}

@media screen and (max-width: 640px) {
	.seachForm01Wrap {
		margin-bottom: 18px;
	}
}

/* !seachForm01
---------------------------------------------------------- */
.seachForm01 {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	padding: 6px 0;
	background: url(/students/abroad/img/img-line-01.png) repeat-x left top;
	box-sizing: border-box;
}
	.seachForm01 .title {
		display: flex;
		align-items: center;
		justify-content: center;
		flex: 0 0 auto;
		width: 140px;
		padding: 10px;
		background-color: #eff3f4;
		text-align: center;
		font-weight: bold;
		line-height: 1.43;
		box-sizing: border-box;
	}
	.seachForm01 .title.bg01 {
		background-color: #eae5d4;
	}
	.seachForm01 .detail {
		display: flex;
		align-items: center;
		flex: 1;
		padding: 0 19px 0 34px;
		box-sizing: border-box;
	}

@media screen and (max-width: 640px) {
	.seachForm01 {
		display: block;
		padding: 0;
		background: none;
	}
		.seachForm01 .title {
			display: block;
			width: 100%;
			padding: 13px 10px;
			text-align: left;
			line-height: 1.4;
		}
		.seachForm01 .detail {
			display: block;
			padding: 20px 0 25px;
		}
		.seachForm01 .detail.space01 {
			padding: 20px 10px 25px;
		}
}

/* !selectForm01
---------------------------------------------------------- */
.selectForm01 {
	width: 160px;
	height: 30px;
	padding: 0 25px 0 10px;
	background: #fff url(/students/abroad/img/icon-arrow-down-01-pc.svg) no-repeat right 5px center;
	border: 1px solid #7f7f7f;
	border-radius: 0;
	color: #707070;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", Arial, Helvetica, Verdana, sans-serif;
	outline: none;
	-webkit-appearance: none;
	appearance: none;
	box-sizing: border-box;
	cursor: pointer;
}
select.selectForm01 {
	width: 100%;
}
.selectForm01::-ms-expand {
	display: none;
}
@media screen and (max-width: 640px) {
	.selectForm01 {
		width: 100%;
		height: 42px;
		padding: 0 40px 0 20px;
		background: #fff url(/students/abroad/img/icon-arrow-down-01-sp.svg) no-repeat right 18px center;
	}
}

/* !inputText01
---------------------------------------------------------- */
.inputText01 {
	width: 100%;
	height: 40px;
	padding: 0 10px;
	background: #fff;
	border: 1px solid #7f7f7f;
	border-radius: 0;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", Arial, Helvetica, Verdana, sans-serif;
	-webkit-appearance: none;
	appearance: none;
	box-sizing: border-box;
}

/* !listForm01
---------------------------------------------------------- */
.listForm01 {
	display: flex;
	flex-wrap: wrap;
	margin: 0 -10px -14px;
	padding: 10px 0;
	box-sizing: border-box;
}

.listForm01 li {
	margin: 0 8px 14px;
	line-height: 0;
	box-sizing: border-box;
}

@media screen and (max-width: 640px) {
	.listForm01 {
		padding: 0;
	}
}

/* !checkboxForm01
---------------------------------------------------------- */
.checkboxForm01 {
	display: block;
	position: relative;
	cursor: pointer;
}
	.checkboxForm01 .checkbox {
		position: absolute;
		top: 0;
		left: 0;
		opacity: 0;
	}
	.checkboxForm01 .text {
		display: block;
		position: relative;
		padding-left: 28px;
		line-height: 1.43;
	}
		.checkboxForm01 .text::before {
			content: '';
			position: absolute;
			top: 2px;
			left: 0;
			width: 16px;
			height: 16px;
			background: url(/students/abroad/img/icon-checkbox-01-no.png) no-repeat left top;
			background-size: contain;
		}
	.checkboxForm01 .checkbox:checked + .text::before {
		background: url(/students/abroad/img/icon-checkbox-01-on.png) no-repeat left top;
		background-size: contain;
	}


@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
	.checkboxForm01 .text::before {
		top: 0;
	}
}

/* !radioForm
---------------------------------------------------------- */
.radioForm01 {
	display: block;
	position: relative;
	cursor: pointer;
}
	.radioForm01 .radio {
		position: absolute;
		top: 0;
		left: 0;
		opacity: 0;
	}
	.radioForm01 .text {
		display: block;
		position: relative;
		padding-left: 28px;
		line-height: 1.43;
	}
		.radioForm01 .text::before {
			content: '';
			position: absolute;
			top: 2px;
			left: 0;
			width: 16px;
			height: 16px;
			background: url(/students/abroad/img/icon-radio-01-no.svg) no-repeat left top;
		}
	.radioForm01 .radio:checked + .text::before {
		background: url(/students/abroad/img/icon-radio-01-on.svg) no-repeat left top;
	}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
	.radioForm01 .text::before {
		top: 0;
	}
}

/* !listDeatilProgram01
---------------------------------------------------------- */
.listDeatilProgram01 .item:not(:last-child) {
	margin-bottom: 30px;
}
	.listDeatilProgram01 .item .link {
		display: flex;
		flex-wrap: wrap;
		background-color: #eff3f4;
		transition: background-color 0.2s ease;
		box-sizing: border-box;
	}
		.listDeatilProgram01 .item .link:hover {
			background-color: #e3e7e8;
			text-decoration: none;
		}
	.listDeatilProgram01 .item .link .listTag01 {
		width: 100px;
		flex: 0 0 auto;
		box-sizing: border-box;
	}
	.listDeatilProgram01 .item .link .detail {
		overflow: hidden;
		flex: 1;
		padding: 14px 25px 14px 10px;
		box-sizing: border-box;
	}
		.listDeatilProgram01 .item .link .detail .text {
			overflow: hidden;
			position: relative;
			max-height: 32px;
			margin-bottom: 6px;
			color: #005396;
			font-weight: bold;
			line-height: 1.15;
			box-sizing: border-box;
		}

@media screen and (max-width: 640px) {
	.listDeatilProgram01 .item .link {
		display: block;
		padding: 14px 10px 17px;
		text-decoration: none;
	}
		.listDeatilProgram01 .item .link:hover {
			background-color: #eff3f4;
		}
	.listDeatilProgram01 .item .link .listTag01 {
		width: 100%;
	}
	.listDeatilProgram01 .item .link .detail {
		padding: 0;
	}
		.listDeatilProgram01 .item .link .detail .text {
			margin-bottom: 11px;
		}
}

/* !listTag01
---------------------------------------------------------- */
.listTag01 {
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
}
	.listTag01 .tag {
		padding: 1px 8px 1px;
		background-color: #b90000;
		border-radius: 8px;
		text-align: center;
		color: #fff;
		line-height: 1.4;
		box-sizing: border-box;
	}
	.listTag01 .tag:not(:last-child) {
		margin-bottom: 7px;
	}
	.listTag01 .tag.white {
		padding: 0 7px;
		background-color: #fff;
		border: 1px solid #7f7f7f;
		color: #7f7f7f;
		line-height: 1.4;
	}
	.listTag01 .tag.grey {
		background-color: #6f6e6e;
	}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
	.listTag01 .tag {
		padding: 2px 8px 0;
	}
	.listTag01 .tag.white {
		padding: 0 7px;
	}
}

@media not all and (min-resolution:.001dpcm) { @media {
		.listTag01 .tag {
		padding: 2px 8px 0;
	}
	.listTag01 .tag.white {
		padding: 0 7px;
	}
}}

@media screen and (max-width: 640px) {
	.listTag01 {
		flex-direction: row;
		align-items: flex-start;
		justify-content: flex-start;
		margin-bottom: 3px;
	}
		.listTag01 .tag,
		.listTag01 .tag:not(:last-child) {
			margin: 0 6px 6px 0;
		}
}

/* !listProgram01
---------------------------------------------------------- */
.listProgram01 {
	display: flex;
	flex-wrap: wrap;
	margin: 0 -10px -3px;
	box-sizing: border-box;
}
	.listProgram01 li {
		overflow: hidden;
		position: relative;
		margin: 0 10px 3px;
		padding-left: 18px;
		color: #333;
		line-height: 1.5;
		box-sizing: border-box;
	}
		.listProgram01 li::before {
			content: '';
			position: absolute;
			top: 50%;
			left: 0;
			width: 11px;
			height: 11px;
			margin-top: -6px;
		}
		.listProgram01 li span {
			overflow: hidden;
			display: block;
			white-space: nowrap;
			text-overflow: ellipsis;
			box-sizing: border-box;
		}
	.listProgram01 li.country {
		padding-left: 16px;
	}
		.listProgram01 li.country::before {
			width: 10px;
			height: 10px;
			margin-top: -5px;
			background: url(/students/abroad/img/icon-world-01.svg) no-repeat center;
			background-size: contain;
		}
		.listProgram01 li.period::before {
			background-image: url(/students/abroad/img/icon-calendar-01.svg);
		}
		.listProgram01 li.time::before {
			background-image: url(/students/abroad/img/icon-time-01.svg);
		}
		.listProgram01 li.purpose::before {
			margin-top: -5px;
			background-image: url(/students/abroad/img/icon-folder-01.svg);
		}
		.listProgram01 li.cost::before {
			width: 12px;
			height: 12px;
			background-image: url(/students/abroad/img/icon-price-01.svg);
		}
		.listProgram01 li.university::before {
			width: 14px;
			height: 15px;
			margin-top: -8px;
			background-image: url(/students/abroad/img/icon-university-01.svg);
		}

/* !listDeatilExperience01
---------------------------------------------------------- */
.listDeatilExperience01 .item:not(:last-child) {
	margin-bottom: 30px;
}
	.listDeatilExperience01 .item .link {
		overflow: hidden;
		display: flex;
		flex-wrap: wrap;
		height: 122px;
		background-color: #eae5d4;
		transition: background-color 0.2s ease;
		box-sizing: border-box;
	}
		.listDeatilExperience01 .item .link:hover {
			background-color: #e3e7e8;
			text-decoration: none;
		}
		.listDeatilExperience01 .item .link .image {
			overflow: hidden;
			flex: 0 0 auto;
			width: 220px;
			height: 122px;
			margin: 0;
			border: 1px solid #ccc;
			box-sizing: border-box;
			background-color: #333;
			text-align: center;
		}

		.listDeatilExperience01 .item .link .image img {
			width: 100%;
			object-fit: contain;
			font-family: 'object-fit: contain';
			height: 122px;
		}
		.listDeatilExperience01 .item .link .detail {
			overflow: hidden;
			display: flex;
			flex-direction: column;
			justify-content: center;
			flex: 1;
			padding: 0 25px;
			box-sizing: border-box;
		}
			.listDeatilExperience01 .item .link .detail .text {
				overflow: hidden;
				position: relative;
				max-height: 32px;
				margin-bottom: 12px;
				color: #005396;
				font-weight: bold;
				line-height: 1.15;
				box-sizing: border-box;
			}

@media screen and (max-width: 640px) {
	.listDeatilExperience01 .item .link {
		display: block;
		height: auto;
		text-decoration: none;
	}
		.listDeatilExperience01 .item .link:hover {
			background-color: #eae5d4;
		}
		.listDeatilExperience01 .item .link .image {
			width: 100%;
			height: auto;
		}
			.listDeatilExperience01 .item .link .image img {
				height: 200px;
			}
		.listDeatilExperience01 .item .link .detail {
			padding: 15px 13px 23px;
		}
			.listDeatilExperience01 .item .link .detail .text {
				margin-bottom: 16px;
			}
}

/* !listButton01
---------------------------------------------------------- */
.listButton01 {
	display: flex;
	flex-wrap: wrap;
	margin: 0 -11px;
	box-sizing: border-box;
}
	.listButton01 li {
		width: 63.7%;
		padding: 0 11px;
		box-sizing: border-box;
	}
		.listButton01 li a {
			display: block;
			padding: 15px 10px;
			background: url(/students/abroad/img/bg-button-01-no.gif) repeat left top;
			text-align: center;
			color: #fff;
			line-height: 1.3;
			transition: background 0.2s ease;
			box-sizing: border-box;
		}
			.listButton01 li a:hover {
				background: url(/students/abroad/img/bg-button-01-on.gif) repeat left top;
				text-decoration: none;
			}
			.listButton01 li a span {
				display: inline-block;
				position: relative;
				padding-left: 25px;
				box-sizing: border-box;
			}
			.listButton01 li a span::before {
				content: '';
				position: absolute;
				top: 2px;
				left: 0;
				width: 16px;
				height: 16px;
				background: url(/students/abroad/img/icon-search-01.svg) no-repeat left top;
				background-size: 100%;
			}
	.listButton01 li.reset {
		width: 36.3%;
	}
		.listButton01 li.reset a {
			padding: 14px 10px;
			background: #fff;
			border: 1px solid #1b1b1b;
			color: #333;
			transition: opacity 0.2s ease;
		}
			.listButton01 li.reset a:hover {
				background: #fff;
				opacity: 0.7;
			}
			.listButton01 li.reset a span {
				padding-left: 21px;
			}
			.listButton01 li.reset a span::before {
				top: 0;
				width: 19px;
				height: 19px;
				background: url(/students/abroad/img/icon-reset-01.svg) no-repeat left top;
				background-size: 100%;
			}

@media screen and (max-width: 640px) {
	.listButton01 {
		display: block;
		margin: 0;
	}
		.listButton01 li {
			width: 100%;
			padding: 0;
		}
			.listButton01 li:not(:last-child) {
				margin-bottom: 28px;
			}
			.listButton01 li a {
				text-decoration: none;
			}
		.listButton01 li.reset {
			width: 67.4%;
			margin: 0 auto;
			padding: 0;
		}
}

[v-cloak] {visibility:hidden;}