@charset "utf-8";
#hd .hd-sound { display: none !important;}
.page-kv { background: url('/img/page-kv.jpg') no-repeat 50% 50% / cover;}
.page-kv .inner-kv { padding: 90px 0;}
.page-kv h2 { color: #4072c3; font-size: clamp(30px,4.2vw,42px); font-weight: 700; letter-spacing: 0.2rem; text-align: center;}
@media (max-width: 481px) {
	.page-kv .inner-kv { padding: 50px 0;}
	.page-kv h2 { font-size: 24px;}
}

.pager .inner-no { position: relative; width: 80%; max-width: 300px; margin: 0 auto; padding: 0 50px;}
.pager ul { font-size: 0; text-align: center;}
.pager ul li { display: inline-block; width: 50px; font-size: 24px; vertical-align: middle;}
.pager ul li span,
.pager ul li a { display: block; width: 36px; height: 36px; margin: 0 auto; line-height: 36px;}
.pager ul li span{ background: #4172c4; color: #fff;}
.pager ul li a { background: #e9edf7; color: #4172c4; text-decoration: none;}
.pager ul li a:hover { background: #4172c4; color: #fff;}

.pager .prev-skip,
.pager .next-skip { width: 36px; height: 18px; position: absolute; top: 50%; transform: translateY(-50%); line-height: 1;}
.pager .prev-skip { left: 0px;}
.pager .next-skip { right: 0px;}
.pager .prev-skip a,
.pager .next-skip a { display: block; width: 100%; }
.pager .prev-skip a svg,
.pager .next-skip a svg { vertical-align: bottom; fill: #4172c4;}
.pager .prev-skip a:hover svg,
.pager .next-skip a:hover svg { opacity: 0.6;}
@media (max-width: 481px) {
	.pager .inner-no { max-width: 240px; padding: 0 35px;}
	.pager ul li { width: 40px; font-size: 20px;}
	.pager ul li span,
	.pager ul li a { width: 32px; height: 32px; line-height: 32px;}
	.pager .prev-skip,
	.pager .next-skip { width: 32px;}
}


.pager .inner { position: relative; width: 100%;}
.pager .prev { }
.pager .next { position: absolute; right: 0; top: 0;}
.pager .prev a,
.pager .next a { position: relative; color: #000; text-decoration: none;}
.pager .next a span,
.pager .prev a span { display: inline-block; vertical-align: middle;}
.pager .next a svg,
.pager .prev a svg { display: inline-block; vertical-align: middle; width: 36px; fill: #4172c4;}
.pager .next a svg { margin-left: 10px;}
.pager .prev a svg { margin-right: 10px;}
.pager .prev a:hover,
.pager .next a:hover { color: #4172c4;}
.pager .prev a:hover svg,
.pager .next a:hover svg { opacity: 0.6;}
@media (max-width: 481px) {
	.pager .inner { padding: 0px;}
	.pager .prev a,
	.pager .next a{ font-size: 15px;}
	.pager .prev a svg,
	.pager .next a svg { width: 30px;}
	.pager .next a svg { margin-left: 6px;}
	.pager .prev a svg { margin-right: 6px;}
}


#news .inner-sct { position: relative; padding: 40px 0px 100px; z-index: 2;}
@media (max-width: 481px) {
	#news .inner-sct { padding: 20px 0px 50px;}
}
#news .article-ctn { width: 90%; max-width: 1120px; margin: 0 auto; padding: 40px 0;}
#news .article-hd { padding-bottom: 20px; border-bottom: solid 2px #4072c3; font-weight: 700; line-height: 1.4;}
#news .article-hd p { color: #787878; font-size: 18px;}
#news .article-hd h2 { font-size: 26px;}
#news article { margin-bottom: 40px;}
#news article figure {padding-top: 30px;}
#news article figure img { max-width: 100%;}
#news article .txt { padding: 30px 0 40px;}
#news article .txt p { font-size: 18px; letter-spacing: 0.1rem;}
@media (max-width: 1001px) {
	#news article .txt p { font-size: 16px;}
}
@media (max-width: 801px) {
	#news article .txt p { font-size: 14px;}
}
@media (max-width: 481px) {
	#news .article-hd { padding-bottom: 12px;}
	#news .article-hd h2 { font-size: 21px;}
	#news .article-hd p { font-size: 13px;}
	#news .article-hd p time { font-size: 13px; letter-spacing: 0.05rem;}
	#news article figure {padding-top: 20px;}
	#news article .txt { padding: 20px 0px 30px;}
	#news article .txt p { font-size: 13px; letter-spacing: 0.05rem; text-align: justify;}
}



#thanks .inner-sct { padding: 100px 0 120px;}
#thanks .ctn { position: relative; width: 88%; max-width: 1000px; margin: 0 auto; z-index: 2;}
#thanks .ctn h3{ margin-bottom: 30px; font-size: 24px; font-weight: 700; letter-spacing: 0.1rem; text-align:center;}
#thanks .ctn p { margin-bottom: 50px; font-size: 20px; letter-spacing: 0.1rem; line-height: 1.8; text-align:center;}
#thanks .ctn .btn-back { width: 100%; max-width: 230px; margin: 0 auto;}
#thanks .ctn .btn-back a { position: relative; display: block; font-size: 18px; text-decoration: none; transition: 0.3s ease;}
#thanks .ctn .btn-back a::before,
#thanks .ctn .btn-back a::after { content: ''; display: block; width: 100%; height: 100%; position: absolute;
 clip-path: polygon(6% 0, 94% 0%, 100% 24%, 100% 76%, 94% 100%, 6% 100%, 0% 76%, 0% 24%); transition: 0.3s ease;
}
#thanks .ctn .btn-back a::before{ background: #4172c4; left: 0; top: 0; z-index: 2;}
#thanks .ctn .btn-back a::after { left: 4px; top: 4px; background: #cbd8eb; z-index: 1;}
#thanks .ctn .btn-back a span { position: relative; display: block; width: 100%; padding: 14px; color: #fff; font-weight: 700; text-align: center; z-index: 3;}
#thanks .ctn .btn-back a span:after { content: ''; position: relative; display: inline-block; width: 0; height: 0; margin-left: 15px; vertical-align: middle;
 border: solid 5px transparent; border-left: solid 10px #fff; border-right: 0; transform: translateY(-2px);
}
#thanks .ctn .btn-back a:hover { opacity: 0.8;}
#thanks .ctn .btn-back a:hover:after { left: 2px; top: 2px;}
@media (max-width: 801px) {
	#thanks .ctn h3{ font-size: 21px;}
	#thanks .ctn p { font-size: 16px;}
}
@media (max-width: 481px) {
	#thanks .inner-sct { padding: 40px 0 60px;}
	#thanks .ctn h3{ margin-bottom: 20px; font-size: 16px;}
	#thanks .ctn h3 span { display: block;}
	#thanks .ctn p { margin-bottom: 30px; font-size: 13px;}
	#thanks .ctn p span { display: block;}
	#thanks .ctn .btn-more { width: 50%;}
	#thanks .ctn .btn-back a { font-size: 14px;}
	#thanks .ctn .btn-back a::before,
	#thanks .ctn .btn-back a::after { clip-path: polygon(4% 0, 96% 0%, 100% 14%, 100% 86%, 96% 100%, 4% 100%, 0% 86%, 0% 14%);}
	#thanks .ctn .btn-back a span { padding: 10px 0;}
}