@charset "UTF-8";

@media all {
	.site-main {
		position: relative;
	}
	.main-header {
		position: relative;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		background: center / cover no-repeat url(../img/challenge/main-visual.jpg);
		overflow: hidden;
		background-size: 150%;
	}

	.main-header-ttl span {
		display: block;
		text-align: center;
	}
	.main-header-ttl::after {
		content: attr(data-en);
		display: block;
		text-align: center;
		font-weight: normal;
	}

	.article-item {
		position: relative;
	}
	.article-item+.article-item {
		border-top: 1px solid #F2EFE3;
	}

	.article-date {
		font-size: 14px;
		color: #9E9E9E;
	}
	.article-category {
		display: inline-block;
		margin-left: 1.5em;
		font-size: 14px;
		color: #9E9E9E;
	}
	.article-ttl {
		font-weight: bold;
	}
	.floater {
		position: absolute;
		width: 100%;
		overflow: hidden;
	}


	.sidebar {
		order: 1;
		flex-shrink: 0;
		padding-right: 10px;
		padding-bottom: 50px;
		width: 210px;
		height: 100%;
		position: sticky;
		top: 100px;
		max-height: calc(100vh - 120px);
		overflow-y: auto;
	}
	.sidebar h2 {
		font-size: 18px;
		font-weight: bold;
	}
	.wp-block-categories-list {
		margin-top: 18px;
	}
	.widget.widget_block + .widget.widget_block {
		margin-top: 100px;
	}
	.sidebar .cat-item a {
		display: block;
		padding: 4px 15px 5px;
		width: 100%;
		max-width: 190px;
		height: 29px;
		background-color: #F7F1E7;
		border-radius: 15px;
		font-size: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
		overflow: hidden;
	}
	.sidebar .cat-item + .cat-item {
		margin-top: 8px;
	}

	h2.select-month {
		position: relative;
		font-size: 14px;
		font-weight: normal;
		transition: opacity .3s;
	}
	h2.select-month:hover {
		cursor: pointer;
		opacity: .8;
	}
	.select-month::after {
		content: '';
		position: absolute;
		top: -2px;
		right: 18px;
		display: block;
		width: 14px;
		height: 14px;
		border-bottom: 1px solid #505050;
		border-right: 1px solid #505050;
		transform: rotate(45deg);
	}
	.months {display: none;}
	.months li {
		display: flex;
		justify-content: space-between;
		margin-top: 18px;
		padding-right: 17px;
		font-size: 14px;
	}
}

/* sp & tab */
@media screen and (max-width: 979px) {
	.main-header {
		background-size: cover;
	}
}
/* sp */
@media only screen and (max-width: 599px) {

	.main-header {
		height: 326px;
	}
	.main-header-ttl {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}

	.main-header-ttl span {
		padding: 5px 15px 2px;
		font-size: 28px;
		line-height: 1.3;
	}
	.main-header-ttl::after {
		margin-top: 10px;
		padding: 3px 10px 0;
		font-size: 12px;
		line-height: 1.2;
	}

	
	.article-list {
		justify-content: space-between;
	}
	.article-item {
		margin: 80px auto 0;
		padding: 0 20px;
		max-width: 400px;
	}
	.article-item + .article-item {
		margin-top: 40px;
		padding-top: 40px;
	}

	.article-category,
	.article-date {font-size: 12px;}
	.article-ttl {font-size: 18px;}
	.article-txt {font-size: 14px;}
	.article-thumb img {
		display: block;
		margin: 0 auto;
		width: 280px;
		height: auto;
		max-height: 280px;
		object-fit: contain;
	}

	.sidebar {
		margin: 40px auto 0;
		padding: 40px 20px 0;
		border-top: 2px solid #909090;
		width: 100%;
		max-width: 400px;
	}
	.widget.widget_block {
		margin: 0 auto;
		width: 280px;
	}
	.widget.widget_block + .widget.widget_block {
		margin-top: 40px;
	}
	.sidebar .cat-item + .cat-item {
		margin-top: 14px;
	}
	.sidebar .cat-item a {
		max-width: none;
	}
	.select-month::after {right: 0;}
	.months li {padding: 0;}
}

/* pc & tab */
@media print,
(min-width: 600px) {
	.main-header {
		height: 326px;
	}

	.main-header-ttl span {
		font-size: 32px;
		line-height: 1.3;
	}
	.main-header-ttl::after {
		margin-top: 20px;
		font-size: 16px;
		line-height: 1.4;
	}

	.content-box {
		display: flex;
		justify-content: space-between;
		margin: 85px auto 0;
		width: 100%;
		max-width: 850px;
	}
	.article-list {
		order: 2;
		max-width: 580px;
	}
	.article-item+.article-item {
		margin-top: 40px;
		padding-top: 40px;
	}
	.article-item::after {
		content: '';
		display: block;
		clear: both;
	}
	.article-thumb {
		float: left;
		margin: 0 20px 20px 0;
		width: 225px;
	}
	.article-date-cat {
		transform: translateY(-8px);
	}
	.article-ttl {
		font-size: 20px;
		transform: translateY(-4px);
	}
	.article-txt {
		margin-top: 20px;
		font-size: 16px;
		line-height: 30px;
	}

	body.archive {position: relative;}
	.float-1 {
		top: 800px;
	}
	.float-1 div {
		transform: translateX(calc(50% + 450px));
		transform: translateX(max(calc(50% + 450px), 72vw));
	}
	.float-2 {
		bottom: 400px;
	}
	.float-2 div {
		transform: translateX(calc(50% - 700px));
		transform: translateX(min(calc(50% - 700px), 15vw));
	}

}

/* tab */
@media only screen and (min-width: 600px) and (max-width: 979px) {
	.article-list {
		margin-left: 10px;
		padding-right: 25px;
	}
	.article-thumb {
		margin: 0 auto 12px;
		float: none;
	}
	.sidebar {
		padding-left: 25px;
	}
}

/* pc */
@media print, (min-width: 980px) {
	.main-header {
		padding-top: 64px;
	}
	.content-box {
		padding: 0 25px;
		max-width: 1000px;
	}
	.article-list {
		max-width: 705px;
	}
	/* archive */

}