.inner { width: 1100px; margin: 0 auto; }
.apply { float: none; }

.top-slider { background: #EAF7FF; }
.top-slider .slick-slide { padding: 0 0 40px; }
.top-slider .slick-dots { bottom: -10px; }

.top-slider li a figure { position: relative; display: flex; align-items: center; height: 480px; overflow: hidden; text-align: center; }
.top-slider li a figure img { width: 100%; }
.top-slider li a figcaption { position: absolute; background: #FFFC; bottom: 0; left: 0; width: 100%; padding: 10px 20px; }
.top-slider li a figcaption span { background: #0078C9; color: #FFF; display: inline-block; padding: 0 20px; font-size: 14px; line-height: 25px; border-radius: 4px; }
.top-slider li a figcaption h2 { font-size: 24px; font-weight: bold; color: #000; line-height: 40px; }
.slick-dotted.slick-slider { margin-bottom: 0; }


.top-map { background: #EAF7FF; padding: 40px 0 0; }
.top-map h2 { width: 1100px; margin: 0 auto; background: #FFF; font-size: 24px; line-height: 80px; color: #000; font-weight: bold; text-align: center; }
.top-map h2 img { vertical-align: text-bottom; margin-right: 10px; }
.top-map .inner { position: relative; }
.top-map ul { }
.top-map li { position: absolute; }
.top-map li:nth-child(1) { top: 40px; left: 70px; }
.top-map li:nth-child(1) a { width: 120px; height: 80px; }
.top-map li:nth-child(2) { top: 140px; left: 70px; }
.top-map li:nth-child(2) a { width: 120px; height: 60px; }
.top-map li:nth-child(3) { top: 220px; left: 70px; }
.top-map li:nth-child(3) a { width: 120px; height: 60px; }
.top-map li:nth-child(4) { top: 40px; left: 210px; }
.top-map li:nth-child(4) a { width: 240px; height: 80px; }
.top-map li:nth-child(5) { top: 140px; left: 210px; }
.top-map li:nth-child(5) a { width: 240px; height: 80px; }
.top-map li:nth-child(6) { top: 240px; left: 210px; }
.top-map li:nth-child(6) a { width: 240px; height: 60px; }
.top-map li:nth-child(7) { top: 40px; left: 470px; }
.top-map li:nth-child(7) a { width: 240px; height: 80px; }
.top-map li:nth-child(8) { top: 140px; left: 470px; }
.top-map li:nth-child(8) a { width: 240px; height: 80px; }
.top-map li:nth-child(9) { top: 40px; left: 730px; }
.top-map li:nth-child(9) a { width: 240px; height: 80px; }

.top-map li a { display: flex; align-items: center; border: solid 2px #004FB2; border-bottom: solid 4px #004FB2; border-radius: 10px; position: relative; background: #FFFC; box-sizing: border-box; }
.top-map li a::before { content: ""; bottom: 10px; right: 10px; border-top: 10px solid transparent; border-right: 10px solid #004FB2; position: absolute; z-index: 100; }

.top-map li a h3 { font-size: 16px; font-weight: bold; line-height: 20px; color: #000; padding-left: 18px; }
.top-map li a h3 span { display: block; }
.top-map li a h3 small { display: block; font-size: 12px; }
.top-map li a:hover { opacity: 1; background: #004FB2; }
.top-map li a:hover h3 { color: #FFF; }
.top-map li a:hover::before { border-right: 10px solid #FFF; }

.top-map li:last-child { bottom: 20px; right: 20px; }
.top-map li:last-child a { display: block; background: #004FB2; color: #FFF; border: 0; border-radius: 0; position: relative; width: 160px; line-height: 40px; font-size: 14px; text-align: center; }
.top-map li:last-child a::before { content: ""; bottom: auto; right: auto; border-top: 0; border-right: 0; top: 0; left: 0; border-bottom: 20px solid transparent; border-left: 20px solid #0078C9; position: absolute; z-index: 100; }
.top-map li:last-child a:hover { opacity: 0.6; }

.top-banner { background: #EAF7FF; padding: 20px 0 0; }
.top-banner ul { }
.top-banner li { padding: 20px 0 0; }


.top-tour { background: #EAF7FF; padding: 20px 0 80px; }
.top-tour ul { clear: both; display: flex; flex-wrap: wrap; justify-content: space-between; }
.top-tour li { width: 350px; margin: 20px 0 0; }
.top-tour li a { position: relative; display: flex; padding: 10px; background: #FFF; align-items: center; }
.top-tour li a::before { content: ""; bottom: 0; right: 0; border-top: 20px solid transparent; border-right: 20px solid #004FB2; position: absolute; z-index: 100; }
.top-tour li a figure { width: 100px; }
.top-tour li a h3 { width: 210px; margin-left: 10px; font-size: 16px; font-weight: bold; color: #000; line-height: 25px; }
.top-tour p a { display: block; background: #004FB2; color: #FFF; position: relative; width: 300px; line-height: 60px; font-size: 20px; text-align: center; font-weight: bold; margin: 40px auto 0; }
.top-tour p a::before { content: ""; top: 0; left: 0; border-bottom: 20px solid transparent; border-left: 20px solid #0078C9; position: absolute; z-index: 100; }

.top-content { padding: 40px 0; }
.top-content ul { clear: both; display: flex; flex-wrap: wrap; justify-content: space-between; }
.top-content li { border: solid 1px #D6D6D6; width: 350px; margin: 40px 0 0; box-sizing: border-box; position: relative; }
.top-content li a { }
.top-content li::before { content: ""; bottom: 0; right: 0; border-top: 20px solid transparent; border-right: 20px solid #004FB2; position: absolute; z-index: 100; }
.top-content li a h3 { font-size: 24px; font-weight: bold; line-height: 30px; color: #004EB2; padding: 20px; }
.top-content li a h3 small { display: block; font-size: 14px; font-weight: normal; line-height: 20px; color: #000; }
.top-content .apply a { line-height: 30px; padding: 20px 0; box-sizing: border-box; }
.top-content .apply a small { display: block; font-size: 14px; font-weight: normal; line-height: 20px; }
.top-content .apply a:hover { color: #FFF; }


.top-sns { border-top: solid 3px #004FB2; padding: 80px 0; }
.top-sns .inner { clear: both; display: flex; justify-content: space-between; }
.top-sns .inner div.top-instagram { width: 350px; }
.top-sns h4 { line-height: 60px; font-size: 20px; }
.top-sns h4 img { vertical-align: text-bottom; margin-right: 10px; }


.top-info { padding: 0 0 120px; }
.top-info .inner { position :relative; }
.top-info ul { margin: 20px 0 0; }
.top-info li { border-top: solid 1px #D6D6D6; }
.top-info li a { display: flex; padding: 10px; color: #000; }
.top-info li a time { width: 120px; }
.top-info li a p { width: 960px; font-weight: bold; }
.top-info h4 { line-height: 40px; font-size: 20px; }
.top-info h4 img { vertical-align: text-bottom; margin-right: 10px; }
.top-info p a { display: block; background: #004FB2; color: #FFF; position: absolute; top: 10px; right: 0; width: 150px; line-height: 30px; font-size: 12px; text-align: center;  }
.top-info p a::before { content: ""; top: 0; left: 0; border-bottom: 10px solid transparent; border-left: 10px solid #0078C9; position: absolute; z-index: 100; }


@media only screen and (max-width: 1100px) {
	.inner { width: 100%; margin: 0; }

	.top-slider { margin-top: 60px; }
	.top-slider .slick-slide { padding: 0 0 40px; }
	.top-slider li a figure { height: 400px; }
	.top-slider li a figure img { width: 100%; }
	.top-slider li a figcaption { position: absolute; background: #FFFC; bottom: 0; left: 0; width: 100%; padding: 10px; }
	.top-slider li a figcaption span { ; padding: 0 10px; font-size: 12px; line-height: 20px; }
	.top-slider li a figcaption h2 { font-size: 20px; line-height: 30px; }


	.top-map { padding: 40px 20px 0; }
	.top-map h2 { width: 100%; }
	.top-map figure { display: none; }
	.top-map ul { display: flex; flex-wrap: wrap; justify-content: space-between; background: #FFF; padding: 0 20px; }
	.top-map li { position: static; width: calc((100% /3 ) - 10px); margin: 0 0 20px; }
	.top-map li:nth-child(1) a,
	.top-map li:nth-child(2) a,
	.top-map li:nth-child(3) a,
	.top-map li:nth-child(4) a,
	.top-map li:nth-child(5) a,
	.top-map li:nth-child(6) a,
	.top-map li:nth-child(7) a,
	.top-map li:nth-child(8) a,
	.top-map li:nth-child(9) a { width: 100%; height: 60px; }


	.top-banner li { padding: 20px 20px 0; text-align: center; }


	.top-tour { padding: 20px 0 40px; }
	.top-tour ul { justify-content: center; }
	.top-tour li { margin: 20px 10px 0; }


	.top-content { padding: 20px 0; }
	.top-content ul { justify-content: center; }
	.top-content li { margin: 20px 10px 0; }
	.top-content .apply a { line-height: 60px; padding: 0; }
	.top-content .apply a small { display: none; }


	.top-sns { padding: 40px 0; }
	.top-sns .inner { flex-wrap: wrap; justify-content: center; }
	.top-sns .inner div.top-fb,
	.top-sns .inner div.top-x,
	.top-sns .inner div.top-instagram { margin: 0 10px 10px; }


	.top-info { padding: 0 20px 60px; }
	.top-info li a p { width: calc(100% - 140px); }

}


@media only screen and (max-width: 600px) {

	.top-slider .slick-slide { padding: 0 0 15px; }
	.top-slider li a figure { height: 60vw; text-align: left; }

	.top-slider li a figcaption { padding: 10px; box-sizing: border-box; }
	.top-slider li a figcaption span { padding: 0 10px; font-size: 11px; line-height: 20px; position: absolute; top: -20px; left: 0; }
	.top-slider li a figcaption h2 { font-size: 4.5vw; line-height: 1.25em; }


	.top-map { padding: 15px 0 0; }
	.top-map ul { padding: 0 15px 15px; }
	.top-map li { position: static; width: calc((100% /2 ) - 7.5px); margin: 0 0 15px; }
	.top-map li:nth-child(1) a,
	.top-map li:nth-child(2) a,
	.top-map li:nth-child(3) a,
	.top-map li:nth-child(4) a,
	.top-map li:nth-child(5) a,
	.top-map li:nth-child(6) a,
	.top-map li:nth-child(7) a,
	.top-map li:nth-child(8) a,
	.top-map li:nth-child(9) a { width: 100%; height: 60px; justify-content: center; }
	.top-map li a::before { content: none; }
	.top-map li a h3 { font-size: 3.5vw; line-height: 1.25em; padding-left: 0; text-align: center; }
	.top-map li a h3 span { display: block; }
	.top-map li a h3 small { display: block; font-size: 2.5vw; }
	.top-map li:last-child a { width: 100%; }

	.top-banner { padding: 15px 0 0; }
	.top-banner li { padding: 15px 15px 0; }


	.top-tour { padding: 15px 0 30px; }
	.top-tour ul { display: block; }
	.top-tour li { width: auto; margin: 15px 7.5px 0; }


	.top-content { padding: 15px 0; }
	.top-content ul { justify-content: space-between; padding: 0 15px; }
	.top-content li { width: calc(50% - 7.5px); margin: 15px 0 0; }
	.top-content li a h3 { font-size: 4vw; line-height: 1.5em; padding: 10px; }
	.top-content li a h3 small { font-size: 3vw; line-height: 1.5em; }


	.top-sns { padding: 30px 0; }
	.top-sns .inner div.top-fb,
	.top-sns .inner div.top-x,
	.top-sns .inner div.top-instagram { margin: 0 auto 20px; }

	.top-info { padding: 0 15px 60px; }
	.top-info li a time { width: 100px; }
	.top-info li a p { width: calc(100% - 100px); }

}