/*
 * base css 
 * pc width 1000px fixed
 */

@media (max-width: 599px) {
}

@media (min-width: 600px) and (max-width:959px) {
}

@media (min-width: 960px) {
}

@media (max-width: 480px) {
}

@media (min-width: 481px) and (max-width:767px) {
}

@media (min-width: 768px) and (max-width:959px) {
}

@media (min-width: 960px) {
}

@media (max-width: 767px) {
}

@media (min-width: 768px) {
}

/* ---------------------------------------- common */

@media (max-width: 767px) {

	.column {
		display: grid;
		grid-template-columns: 100%;
		grid-template-rows: repeat(3, auto);
		grid-column-gap: 0;
		grid-row-gap: 0;
	}
	#contents { 
		order: 1; 
		margin: 0 0 3.75em;
	}
	#sidebar { order: 3; }
	#pageing,
	#prevNext { 
		order: 2; 
		margin: 0 0 3.75em;
	}

}

@media (min-width: 768px) {

	.column {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		flex-direction:row-reverse;
	}
	#contents { width: 77.7%; }
	#sidebar { 
		width: 16%; 
		min-width: 124px;
	}

}

#contents .icon.blog {
	background: #FFE6F0;
}
#contents .icon.openinfo {
	background: #FFE7BA;
}
#contents .icon.opentime {
	background: #D5F5FF;
}
#contents .icon.recuritinfo {
	background: #D1FCB6;
}
#contents .icon.news {
	background: #E8E8E8;
}

/* ---------------------------------------- section h2 */

main h2.inner {
	position: relative;
	text-align: center;
	margin: 0 auto 3em;
}
main h2.inner em {
	color: #F3f3f3;
	font-family: "Lilita One", sans-serif;
}
main h2.inner span {
	color: #FC9913;
	font-weight: 600;
	position: absolute;
	bottom: 0;
	left: 50%;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
}

@media (max-width: 767px) {
	main h2.inner em {
		font-size: clamp(4.4rem, 1.139rem + 8.05vw, 8rem);
	}
	main h2.inner span {
		font-size: clamp(1.8rem, 0.678rem + 2.24vw, 2.8rem);
	}
}

@media (min-width: 768px) {
	main h2.inner em {
		font-size: clamp(7rem, -1.832rem + 12.93vw, 10rem);
	}
	main h2.inner span {
		font-size: clamp(2.4rem, -0.155rem + 3.45vw, 3.2rem);
	}
}

/* ---------------------------------------- section contents category */

section#contents ul li {
	border-bottom: 1px #FC9913 solid;
	font-weight: 500;
	padding: 1em 0 0;
}
section#contents ul li a {
	-webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}
section#contents ul li a:hover {
	color: #FC9913;
}

section#contents ul li p {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
section#contents ul li .icon {
	display: inline-block;
	padding: .75em .5em;
	margin: 0 1em 0 0;
	border-radius: .5em;
}

@media (max-width: 767px) {

	section#contents ul {
		font-size: clamp(1.1rem, -0.403rem + 5.45vw, 1.4rem);
	}
	section#contents ul li { padding: 1em 0 0; }
	section#contents ul li a {
		display: block;
		padding: 1em .5em;
	}
	section#contents ul li p { padding: 1em 0 0; }
	section#contents ul li .icon {
		font-size: clamp(1rem, -0.102rem + 3.64vw, 1.2rem);
	}
}

@media (min-width: 768px) {

	section#contents { margin: 0; }
	section#contents ul {
		font-size: clamp(1.3rem, 0.192rem + 1.29vw, 1.6rem);
	}
	section#contents ul li:not(:first-child) { padding: 2em 0 0; }
	section#contents ul li a {
		display: table;
		table-layout: fixed;
		width: 100%;
		padding: 1em 0;
	}
	section#contents ul li a > * {
		display: table-cell;
		vertical-align: middle;
	}
	section#contents ul li .date {
		width: 15em;
		text-align: center;
	}
	section#contents ul li p {
		width: calc( 100% - 15em );
	}
	section#contents ul li .icon {
		font-size: clamp(1.1rem, 0.067rem + 1.29vw, 1.4rem);
	}

}

/* ---------------------------------------- article contents single */
/* #editors => style-editors.css */

article#contents { font-weight: 500; }

article#contents h3 { line-height: 1.6; }
article#contents .icon {
	display: inline-block;
	padding: .75em .5em;
	margin: 0 1em 0 0;
	border-radius: .5em;
}
article#contents hr { 
	color: #FC9913;
	border-top: 1px #FC9913 solid;
}

@media (max-width: 767px) {

	article#contents .inside,
	article#contents #editors {
		padding: 0 1em;
	}
	article#contents .inside {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
	}
	article#contents .date {
		display: block;
		width: 100%;
		font-size: clamp(1rem, -0.102rem + 3.64vw, 1.2rem);
		margin: 0 0 1em;
	}
	article#contents .icon { 
		font-size: clamp(1rem, -0.102rem + 3.64vw, 1.2rem);
	}
	article#contents h3 {
		font-size: clamp(1.2rem, 0.023rem + 3.64vw, 1.4rem);
		margin: .75em 0;
	}
	article#contents hr { margin: .75em 0 1.5em; }
}

@media (min-width: 768px) {

	article#contents .inside,
	article#contents #editors {
		max-width: 850px;
		margin: 0 auto;
	}
	article#contents .date {
		font-size: clamp(1.3rem, 0.192rem + 1.29vw, 1.6rem);
		margin: 0 1em 0 0; 
	}
	article#contents .icon {
		font-size: clamp(1.1rem, 0.067rem + 1.29vw, 1.4rem);
	}
	article#contents h3 {
		font-size: clamp(1.8rem, -0.116rem + 2.59vw, 2.4rem);
		margin: .75em 0;
	}
	article#contents hr { margin: 1em 0 2em; }
}


/* ---------------------------------------- sidebar */

#sidebar .inside {
	background: #fce878;
	border-radius: 1.25em;
}
#sidebar .inside h3 {
	border-bottom: 1px #333 solid;
	font-family: "Lilita One", sans-serif;
	padding: 0 0 .5em;
	margin: 0 0 .5em;
}
#sidebar .inside ul li a {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: .5em 0;
	-webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}
#sidebar .inside ul li a:hover {
	color: #FC9913;
}

@media (max-width: 767px) {

	#sidebar .inside { padding: 2em 1.5em; }
	#sidebar .inside h3 { font-size: clamp(1.6rem, -0.455rem + 7.27vw, 2rem); }
	#sidebar .inside ul { font-size: clamp(1.2rem, 0.023rem + 3.64vw, 1.4rem); }

}

@media (min-width: 768px) {

	#sidebar .inside { padding: 2em 1em; }
	#sidebar .inside h3 { font-size: clamp(1.6rem, 0.172rem + 1.72vw, 2rem); }
	#sidebar .inside ul { font-size: clamp(1.2rem, 0.129rem + 1.29vw, 1.5rem); }
}

/* ---------------------------------------- category pageing */

@media (max-width: 767px) {
}

@media (min-width: 768px) {

	#pageing {
		width: 100%;
	}

}

#pageing .wp-pagenavi {
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	margin: 0 auto;
}
#pageing .wp-pagenavi span.current,
#pageing .wp-pagenavi a.page {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 2em;
	aspect-ratio: 1;
	text-align: center;
	line-height: 1;
	font-weight: 500;
	border-radius: 100%;
	-webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}
#pageing .wp-pagenavi span.current {
    background: #FC9913;
    color: #fff;
}
#pageing .wp-pagenavi a.page {
	background: none;
}
#pageing .wp-pagenavi a.page:hover {
    background: #FC9913;
    color: #fff;
}
#pageing .wp-pagenavi .first,
#pageing .wp-pagenavi .extend {
    margin-right: 10px;
}
#pageing .wp-pagenavi .last {
    display: none;
}
#pageing .wp-pagenavi .nextpostslink, 
#pageing .wp-pagenavi .previouspostslink {
	color: #FC9913;
}

@media (max-width: 767px) {

	#pageing .wp-pagenavi span.current,
	#pageing .wp-pagenavi a.page { margin: 0 .5em; }

}

@media (min-width: 768px) {

	#pageing { margin: 5em 0 0; }
	#pageing .wp-pagenavi span.current,
	#pageing .wp-pagenavi a.page { margin: 0 1em; }

}

/* ---------------------------------------- article prevNext single */

#prevNext {
	color: #FC9913;
	font-weight: 500;
}
#prevNext ul {
	display: flex;
	justify-content: center;
	align-items: center;
}
#prevNext a { 
	display: inline-block; 
	-webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}
#prevNext a:not(.hide):hover { opacity: .5; }
#prevNext a.hide {
	color: #ccc;
	pointer-events: none; 
}
#prevNext .prev i { margin: 0 1em 0 0; }
#prevNext .next i { margin: 0 0 0 1em; }
#prevNext .archive a {
	color: #fff;
	background: #FC9913;
	padding: .75em 1.25em;
	border-radius: 100px;
}

@media (max-width: 767px) {

	#prevNext {
		font-size: clamp(1.2rem, 0.023rem + 3.64vw, 1.4rem);
	}
	#prevNext ul { justify-content: space-between; }
	section#contents ul li .icon {
		font-size: clamp(1rem, -0.102rem + 3.64vw, 1.2rem);
	}

}

@media (min-width: 768px) {

	#prevNext {
		width: 100%;
		font-size: clamp(1.3rem, 0.192rem + 1.29vw, 1.6rem);
		margin: 6em 0 0;
	}
	#prevNext .prev { margin: 0 5em 0 0; }
	#prevNext .next { margin: 0 0 0 5em; }

}

/* -------------------------------editor */
#contents #editors a{
 text-decoration: underline;
}