@charset "utf-8";

.focus-big-wrapper, .focus-md-wrapper, .focus-sm-wrapper {
	/*font-family:"KoPub Dotum";*/
	font-size:15px;
	line-height:1.5;
	font-weight:400;
}

.smfocus {
	position:relative;
}

.smfocus a {
	color:#333;
}

.focus-big-wrapper .category, .focus-md-wrapper .category, .focus-sm-wrapper .category {
	font-size:17px;
	color:#023144;
	font-weight:700;
	margin-bottom:0.5em;
}

.smfocus .img-box-wrap, .smfocus .img-box-wrap .img-box {
	top:0;
	right:0;
	bottom:0;
	position:absolute;
	width:150px;
}

.smfocus .img-box-wrap {
	border:1px solid #eee;
	box-sizing:border-box;
}

.smfocus .img-box-wrap .img-box {
	background:url() center no-repeat;
	background-size:cover;
}

.focus-big-wrapper, .focus-md-wrapper, .focus-sm-wrapper {
	padding:10px 0;
	margin:5px 0;
	/*border-top:0.5px #333 solid;*/
}

.focus-md-wrapper, .focus-sm-wrapper {
	border-top:0.5px #ccc solid;
}

.focus-big {
	padding-right:315px;
	min-height:300px;
}

.focus-big.no-img {
	padding-right:0;
}

.focus-md {
	padding-right:215px;
	min-height:200px;
}

.focus-md.no-img {
	padding-right:0;
}

.focus-big .desc {
	height:9em;
	overflow:hidden;
	margin-bottom:0.5em;
	text-align:justify;
}

.focus-big .img-box-wrap, .focus-big .img-box-wrap .img-box {
	width:300px;
}

.focus-md .img-box-wrap, .focus-md .img-box-wrap .img-box {
	width:200px;
}

.focus-big h3 {
	font-size:20px;
	font-weight:700;
}

.focus-big h4 {
	font-size:16px;
	margin-bottom:0.5em;
}

.focus-sm {
	padding-right:165px;
	min-height:150px;
}

.focus-sm.no-img {
	padding-right:0;
}

.focus-sm .desc {
	height:6em;
	overflow:hidden;
	margin-bottom:0.5em;
	text-align:justify;
}

.focus-sm h3 {
	font-size:18px;
	font-weight:700;
	margin-bottom:0.5em;
	/*height:1.5em;*/
	overflow:hidden;
}

.button-board {
	display: inline-block;
	border-radius: 3px;
	font-size: 11px;
	font-size: 1.1rem;
	padding: 6px;
	padding: 0.6rem;
	color: #fff;
	background: #4d4d4d;
	cursor:pointer;
}


#support-sp a {
    display:block;
    width:260px;
    margin:5px auto;
    height:0;
	padding-top:24.24%;
	overflow:hidden;
	text-indent:-9999px;
    background:url(support_sm.jpg) center no-repeat;
	background-size:contain;
}

#subscribe-sp a {
    display:inline-block;
    width:260px;
    margin:5px auto;
    height:112px;
	overflow:hidden;
	text-indent:-9999px;
	border:1px solid #999;
    background:url(subscribe.jpg) center no-repeat;
	background-size:cover;
}

#support-sp, #subscribe-sp {
	margin-bottom:10px;
}

#focus-logo a{
	display:inline-block;
	text-indent:-9999px;
	overflow:hidden;
	background:url(img/focus-logo.png) center center no-repeat;
	background-size:cover;
	width:100%;
	padding-top:7%;
	height:0;
}


#pagination-board {
	width:100%;
	text-align: center;
	padding: 20px 0 40px 0;
	padding: 2rem 0 4rem 0;
	font-size: 12px;
	font-size: 1.2rem;
}
#pagination-board a {
	color: #a7a7a7;
	font-weight: bold;
	padding: 5px 7px;
	padding: 0.5rem 0.7rem;
	margin: 0 5px;
	margin: 0 0.5rem;
}
#pagination-board span {
}
#pagination-board a:hover, #pagination-board span.current-page {
	color: #fff;
	background: #a7a7a7;
	border-radius: 3px;
	padding: 5px 7px;
	padding: 0.5rem 0.7rem;
}


@media (max-width:768px) {
	.smfocus .img-box-wrap{
		width:30%;
	}
	.smfocus .img-box-wrap .img-box {
		width: 100%;
	}

	.focus-big .desc {
		height:6em;
	}
	
	.focus-big, .focus-md, .focus-sm {
		padding-right:15px;
		height:initial;
		min-height:initial;
	}
	
	.focus-big h3 {
		font-size:18px;
	}
	
	.focus-sm h3 {
		height:initial;
	}
	
	#focus-logo a{
		margin-top:15px;
	}
	
	.smfocus .img-box-wrap {
		display:none;
	}
	
	.focus-big .img-box-wrap {
		width:50%;
		height:initial;
		position:static;
		float:right;
		display:block;
		margin-left:15px;
	}
	
	.focus-md .img-box-wrap {
		width:33%;
		height:initial;
		position:static;
		float:right;
		display:block;
		margin-left:15px;
	}
	
	.focus-big .img-box-wrap .img-box, .focus-md .img-box-wrap .img-box {
		width:100%;
		padding-top:100%;
		height:0;
		display:block;
		position:static;
	}
	
	.smfocus h3, .smfocus h4 {
		clear:initial;
	}
}

@media (max-width:480px) {
	aside#journal-list {
		display:block;
	}
	
	aside#journal-list .right-aside {
		float:none;
		width:initial;
	}
	
	#focus-logo a{
		min-height:10px;
	}
}


#main-nav {
	background:#000;
	transition:0.3s;
}

#main-nav ul#menu-main>li{
	margin-top:6px;
}

#main-nav ul#menu-main>li:hover {
	margin-top:6px;
	border:none;
}

#main-nav ul#menu-main li a{
	color:#fff;
	background:#000;
	border:none;
}

#main-nav .notice {
	background:#000;
}

#main-nav .notice ul li a {
	color:#fff;
}

#main-btn, #search-btn, #organ-title {
	display:none;
	cursor:pointer;
	margin:0 5px;
	color:#eee;
}

#menu-search {
	display:none;
}

.bar1, .bar2, .bar3 {
  width: 30px;
  height: 4px;
  background-color: #eee;
  margin: 5px 0;
  transition: 0.4s;
}

.active>.bar1 {
  transform: rotate(-45deg) translate(-9px, 6px);
}

.active>.bar2 {opacity: 0;}

.active>.bar3 {
  transform: rotate(45deg) translate(-7px, -4px);
}

#search-btn .fa-close {
	display:none;
}

#search-btn.active .fa-search {
	display:none;
}

#search-btn.active .fa-close {
	display:inline;
}

.show-mob {
	display:none !important;
}

.search-btn {
	overflow:hidden;
	text-indent:-9999px;
	background:url(img/icon-finder.png) center no-repeat;
	width:2em;
	height:2em;
	background-size:contain;
	vertical-align:middle;
}

@media(max-width:768px) {
	.hide-mob {
		display:none !important;
	}
	
	.show-mob {
		display:inline-block !important;
	}
	
	#main-nav.fixed-nav {
		z-index:999;
		height:4.8rem;
		top:0;
		position:fixed;
		padding:5px;
		box-sizing:border-box;
	}
	
	#main-nav.fixed-nav #main-btn {
		display:inline-block;
	}
	
	#main-nav.fixed-nav #search-btn {
		display:inline-block;
		font-size:26px;
		vertical-align:top;
		margin-top:-2px;
	}
	
	#main-nav.fixed-nav #organ-title {
		display:inline-block;
		float:right;
		font-size:16px;
		font-weight:bold;
		margin:0 10px;
	}
	
	#main-nav.fixed-nav #menu-main {
		position:static;
		transition:0.4s;
		display:none;
	}
	
	#main-nav.fixed-nav #menu-main.active {
		display:block;
	}
	
	#main-nav.fixed-nav #menu-main>li {
		float:none;
		transition:0.4s;
	}
	
	#main-nav.fixed-nav #menu-main li a {
		background:transparent;
	}
	
	#main-nav.fixed-nav #menu-main li ul {
		position:static;
		background:transparent;
		border:none;
	}
	
	#main-nav.fixed-nav #menu-main #membership {
		background:transparent;
	}
	
	#main-nav.fixed-nav #menu-search.active {
		display:block;
	}
	
	#main-nav nav.active {
		position: fixed;
		background: rgba(0, 0, 0, 0.6);
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		padding:5px;
	}
	
	#main-nav.fixed-nav #menu-search {
		margin:5px;
	}
	
	#main-nav.fixed-nav .search {
		float:none;
		border:2px solid #eee;
		border-radius:5px;
		padding:5px;
		margin:20px 0 40px;
		height:initial;
	}
	
	#main-nav.fixed-nav .search form {
		border:none;
		border-radius:0;
		padding:0;
		position:relative;
		height:2em;
	}
	
	#main-nav.fixed-nav .search form input[type='submit'] {
		font: normal normal normal 20px/1 FontAwesome;
		width:25px;
		height:initial;
		background:transparent;
		text-indent:0;
		color:#eee;
		vertical-align:super;
	}
	
	#main-nav.fixed-nav .search form input[type='text'] {
		left:0;
		right:0;
		top:0;
		bottom:0;
		position:absolute;
		color:#eee;
		background:transparent;
		width:100%;
		padding-left:30px;
		box-sizing:border-box;
	}
	
	#main-nav.fixed-nav .search form input[type='text']::placeholder {
		color:#ddd;
	}
	
	#main-nav.fixed-nav #menu-search h3 {
		color:#eee;
		font-size:18px;
		font-weight:bold;
		border-bottom:1px solid #eee;
		margin-bottom:5px;
	}
	
	#main-nav.fixed-nav #menu-search li {
		font-size:16px;
		line-height:2em;
	}
	
	#main-nav.fixed-nav #menu-search li  a {
		color:#eee;
	}
}


/* **** */

header .search {top:30px; vertical-align:middle;}
header .search #top-menu-show {display:inline-block; vertical-align:middle; position:relative;}
header .search #top-menu-show>a {overflow:hidden; display:block; width:24px;height:24px; text-indent:-9999px; background:url(img/icon-menu.jpg) center no-repeat; background-size:cover;}
header .search #top-menu-show ul {position:absolute; top:24px; left:-5em; right:-5em; z-index:9999; font-size:13px; font-weight:bold; text-align:center; background:white; border-left:1px solid #b3b3b3; border-right:1px solid #b3b3b3;}
header .search #top-menu-show ul li {margin-top:1px; border-bottom: 1px solid #b3b3b3;}
header .search #top-menu-show ul li:first-child {margin-top:0; border-top: 1px solid #b3b3b3;}
header .search #top-menu-show ul li a {display:block; padding:5px 0; color:#000;}
header .search form {display:inline-block;  vertical-align:middle}
#top-login {border-radius:3px; background:#7d7d7d; color:white; padding:4px 5px; margin:0 3px;  vertical-align:middle}

#topic-box {
	margin:15px 0;
}

#topic-box ul {
	/*text-align:justify;*/
}

#topic-box li {
	display:inline-block;
	font-size:15px;
	margin:3px;
}

#topic-box li a {
	display:inline-block;
	border-radius:3px;
	padding:5px 10px;
	color:#fff;
}

#topic-box .term-0 {
	background:#e3780c;
}
#topic-box .term-1 {
	background:#5b2677;
}
#topic-box .term-2 {
	background:#364a4c;
}
#topic-box .term-3 {
	background:#6e0f3c;
}
#topic-box .term-4 {
	background:#133a5e;
}
#topic-box .term-5 {
	background:#0fa573;
}
#topic-box .term-6 {
	background:#0084ff;
}
#topic-box .term-7 {
	background:#f23434;
}

.focus-aside {
	font-size:14px;
	position:relative;
	margin-top:1.6em;
}

.aside-wrap {
	margin-bottom: 1.6rem;
}

aside .focus-aside.aside-wrap .right-aside h2 {
	text-align:center;
	background:transparent;
	padding:0;
	margin:0;
	font-size:120%;
	position:absolute;
	top:-0.6em;
	left:0;
	right:0;
}

aside .focus-aside.aside-wrap .right-aside h2 a {
	display:inline-block;
	background:#fff;
	padding:0 0.5em;
	color:#393f39;
}

.focus-aside ul li:before {
	content:"[최신글]";
	color:#45b3e5;
}

.focus-aside .telegram {
	display:block;
	padding-left:1.7em;
	background:url(img/telegram-logo.png) left center no-repeat;
	background-size:1.5em;
	font-weight:bold;
}

.focus-aside .newsletter {
	background:transparent;
	padding:0;
	margin:0.5em 0;
}

.focus-aside #focus-aside {
	background:transparent;
	padding:10px;
}

aside .focus-aside.aside-wrap .right-aside ul li {
	border:none;
	padding:0;
	margin:0.5em 0;
}

.j2019-cover-box {
	border: 1px solid #b3b3b3;
	border-radius: 3px;
	padding: 8px 3.0769%;
	text-align:center;
	font-size:14px;
	margin:8px 0;
}

.j2019-cover-box img {
	width:75%;
	margin:0.5em 0;
}

.j2019-cover-box h2 {
	font-size:145%;
}

.j2019-cover-box h3 {
	font-size:100%;
	font-weight:normal;
	margin:0.5em 0;
}

.j2019-cover-box h2 a, .j2019-cover-box h3 a {
	color:#000;
}

.j2019-cover-box .subscribe {
	border-radius:3px; 
	background:#7d7d7d; 
	color:white; 
	padding:3px 6px;
	margin:0.5em 0;
	display:inline-block;
}

@media(max-width:480px) {
	header div.navigation {
		height:initial;
	}
	
	header div.navigation ul#menu-main {
		position:static;
		margin:0 10%;
		width:80%;
	}
	
	header div.navigation ul#menu-main>li {
		width: 50%;
		box-sizing: border-box;
		text-align: center;
	}
	
	#main-aside {
		display:block !important;
	}
	
	.right-aside {
		width:initial;
	}
}

/* right-side */

#j2022-as input{
	display: none;
}

#j2022-as{
	position: relative;
	width: 100%;
	height: 0;
	user-select: none;
	border: 1px solid #b3b3b3;
	border-radius: 3px;
	margin:8px 0;
	padding:8px 3.0769% 140%;
	box-sizing: border-box
}

#j2022-as .slider-cont{
	position: absolute;
	background:#fff;
	margin:auto auto;
	text-align:center;
	font-size:14px;
	left:1em;
	right:1em;
	top:1em;
	bottom:1em;
	overflow:hidden;
}

#j2022-as .slider-cont .img {
	display:block;
	height:200px;
	margin:0.5em 0;
	background:url() center no-repeat;
	background-size:contain;
}

#j2022-as .slider-cont  h2 {
	font-size:133%;
	margin-bottom:0.5em;
}

#j2022-as .slider-cont  h3 {
	font-size:100%;
	font-weight:normal;
	margin-bottom:0.5em;
}

#j2022-as .slider-cont h2 a, #j2022-as .slider-cont h3 a {
	color:#000;
	word-break:keep-all;
	word-wrap:break-word;
}

#j2022-as .slider-cont .btn {
	color:#fff;
	background:#878b8f;
	padding:0.5em 1em;
	border-radius:5px;
}

#j2022-as .slider-cont .btn:after {
	content:"바로가기";
}

#j2022-as nav{
	left:0;
	right:0;
	bottom:16px;
	height:8px;
	position: absolute;
	text-align: center;
	z-index: 99;
	cursor: default;
}

#j2022-as nav .dots{
	top: -5px;
	width: 10px;
	height: 10px;
	margin: 0 5px;
	position: relative;
	border-radius: 50%;
	display: inline-block;
	background: #fff;
	border:1px solid #393f39;
	transition: .4s;
}

#j2022-as nav .dots:hover {
	cursor: pointer;
	background: #999;
	transition: .25s
}

.slider-cont {
	z-index: -1;
}

#j2022-as-i-journal:checked ~ #j2022-as-journal  ,
#j2022-as-i-pamphlet:checked ~ #j2022-as-pamphlet {
	z-index: 9; 
	animation: scroll 1s ease-in-out;
}

#j2022-as-i-journal:checked ~ nav #j2022-as-dot-journal,
#j2022-as-i-pamphlet:checked ~ nav #j2022-as-dot-pamphlet { 
	background: #393f39;
}

@keyframes scroll{
	0%{opacity:.4;}
	100%{opacity:1;}
}		

@media screen and (max-width: 685px){
	#j2022-as{
		border: none;
		width: 100%;
		height: 0;
		padding-bottom: 55%; 
	}	

	#j2022-as nav .dots{
		width: 12px;
		height: 12px;
	}
}

#j2022-recent-aside-wrap, 
#j2022-recent-term-aside-wrap {
	font-size:13px;
	position: relative;
	width: 100%;
	user-select: none;
	border: 1px solid #b3b3b3;
	border-radius: 3px;
	margin:8px 0 12px;
	padding:8px 3.0769%;
	box-sizing: border-box;
}

#j2022-recent-aside, 
#j2022-recent-term-aside {
	background:none;
}

#j2022-recent-aside-wrap #j2022-recent-aside h2, 
#j2022-recent-term-aside-wrap #j2022-recent-term-aside h2 {
	background:none;
	margin:0 0 0.4em;
	padding:0;
	text-align:center;
	font-size:1.4em;
}

#j2022-recent-aside-wrap #j2022-recent-aside ul li,
#j2022-recent-term-aside-wrap #j2022-recent-term-aside ul li {
	border:none;
	padding:0 0.7em;
	margin-bottom:0.5em;
}

#j2022-recent-aside-wrap #j2022-recent-aside span.date-aside,
#j2022-recent-term-aside-wrap #j2022-recent-term-aside span.date-aside {
	display:block;
}

#j2022-recent-aside-wrap #j2022-recent-aside span.j2022-recent-aside,
#j2022-recent-term-aside-wrap #j2022-recent-term-aside span.j2022-recent-aside {
	display:inline-block;
	font-weight:bold;
}

#j2022-recent-aside-wrap #j2022-recent-aside span.j2022-recent-aside a,
#j2022-recent-term-aside-wrap #j2022-recent-term-aside span.j2022-recent-aside a{
	color:#0071bc;
}

#j2022-recent-aside-wrap #j2022-recent-aside li>a,
#j2022-recent-term-aside-wrap #j2022-recent-term-aside li>a {
	color:#393f39;
}

.j2022-side-box {
	width:100%;
	border:1px solid #b3b3b3;
	border-radius:3px;
	box-sizing:border-box;
	background:#fafafa;
	margin-bottom:12px;
}

#j2022-aside-telegram {
}

#j2022-aside-telegram a {
	display:block;
	height:80px;
	background:url(j2022-img/aside-telegram-lg.png) 46px center no-repeat;
	background-size:60px;
	padding:10px 46px 10px 114px;
	box-sizing:border-box;
}

#j2022-aside-telegram a span {
	display:block;
	height:40px;
	background:url(j2022-img/aside-telegram-text.png) center center no-repeat;
	background-size:100px;
	margin:8px auto;
	text-indent:-9999px;
}


#j2022-aside-newsletter {
	height:80px;
	background:url(j2022-img/aside-newsletter-lg.png) #fafafa 26px center no-repeat;
	background-size:50px;
	padding:14px 26px 14px 84px;
}

#j2022-aside-newsletter span {
	display:block;
	height:20px;
	background:url(j2022-img/aside-newsletter-text.png) center center no-repeat;
	background-size:150px;
	margin:0 auto 7px;
	text-indent:-9999px;
}

#j2022-aside-newsletter input[type="text"] {
	width:130px;
	margin:0 10px;
	border-radius:3px;
	padding:3px 6px;
	background:#d3d5d3;
	box-sizing:border-box;
}

#j2022-aside-newsletter input[type="button"] {
	display:none;
}

#j2022-aside-support a {
	display:block;
	height:80px;
	background:url(j2022-img/aside-support-lg.png) left center no-repeat;
	background-size:86px;
	padding:15px 13px 15px 90px;
	box-sizing:border-box;
}

#j2022-aside-support a span {
	display:block;
	height:50px;
	background:url(j2022-img/aside-support-text.png) center center no-repeat;
	background-size:160px;
	margin:0 auto;
	text-indent:-9999px;
}

#j2022-aside-journal-subscribe a {
	display:block;
	height:80px;
	background:url(j2022-img/aside-journal-subscribe-lg.png) 10px center no-repeat;
	background-size:45px;
	padding:14px 5px 14px 62px;
	box-sizing:border-box;
	color:#000;
	font-size:1.0em;
	white-space: nowrap;
}

#j2022-aside-journal-subscribe a span {
	display:block;
	margin:0 auto;
}

#j2022-topic-box {
	margin:15px 0;
}

#j2022-topic-box h3{
	text-align:right;
	font-weight:bold;
	font-size:16px;
}

#j2022-topic-box ul {
	margin-top:0.5em;
	margin-left:10%;
	margin-right:-0.8em;
	display:flex;
	flex-flow:row wrap;
	justify-content: flex-end;
}

#j2022-topic-box li {
	display:inline-block;
	margin:0.2em 0.8em;
}

#j2022-topic-box li a {
	color:#000;
}

#sub-aside-sm {
	display:none;
}

#sub-aside-sm ul {
	display:flex;
}

#sub-aside-sm ul li {
	flex-basis:33%;
	flex-grow:1;
	display:flex;
	flex-flow:column;
	height:80px;
}

#sub-aside-sm ul li a {
	display:block;
	color:#000;
}

#sub-aside-sm ul li a:first-child {
	flex-grow:1;
	position:relative;
	padding:10px;
}

#sub-aside-sm ul li a:first-child span {
	display:block;
	position:absolute;
	left:10px;
	right:10px;
	top:10px;
	bottom:10px;
	background:url() center no-repeat;
	background-size:contain;
}

#sub-aside-sm ul li a:last-child {
	text-align:center;
	padding:0em 1em 0.5em;
	word-break:keep-all;
	word-wrap:break-word;
}


#sub-aside-sm #j2022-aside-telegram-sm, #sub-aside-sm #j2022-aside-support-sm {
	background:#fafafa;
}


#sub-aside-sm #j2022-aside-newsletter-sm {
	background:#fff;
}

#sub-aside-sm #j2022-aside-telegram-sm a:first-child span {
	background-image:url(j2022-img/aside-telegram-sm.png);
}

#sub-aside-sm #j2022-aside-newsletter-sm a:first-child span {
	background-image:url(j2022-img/aside-newsletter-sm.png);
}

#sub-aside-sm #j2022-aside-support-sm a:first-child span {
	background-image:url(j2022-img/aside-support-sm.png);
}

@media (max-width:480px) {
	#sub-aside-sm {
		display:block;
		margin-top:0;
		border-top:5px solid #d9d9d9;
	}
}

/* main page */

#j2022-main {
	margin:2em 0;
	width: 69.79166666667%;
	float: left;
}

#j2022-main .row {
}

.flex-lg-block-sm {
	display:flex;
	justify-content: space-between;
}

.flex-lg {
	display:flex;
	justify-content: space-between;
}

#j2022-main .publication {
	width:48.8%;
	flex-grow:0;
	border:2px solid #fafafa;
	border-top:8px solid #393f39;
	margin-bottom:2em;
}

#j2022-main .publication header {
	padding-top:2em;
}

#j2022-main .publication header h2 {
	text-align:center;
	padding:0.7em 0;
}

#j2022-main .publication header h2 a {
	color:#000;
}

#j2022-main .isadmin button {
	position:absolute;
}

#j2022-main #j2022-focus.publication header{
	background:url(j2022-img/home-focus.png) #fafafa left center no-repeat;
	background-size:6em;
}

#j2022-main #j2022-journal.publication header{
	background:url(j2022-img/home-journal.png) #fafafa right center no-repeat;
	background-size:6em;
}

#j2022-main #j2022-youtube.publication header{
	background:url(j2022-img/home-youtube.png) #fafafa 1em center no-repeat;
	background-size:4em;
}

#j2022-main #j2022-pamphlet.publication header{
	background:url(j2022-img/home-pamphlet.png) #fafafa right 1em center no-repeat;
	background-size:5em;
}

#j2022-main .publication .cont {
	padding:1em;
}

.j2022-focus-widget {
	font-size:14px;
	word-break:keep-all;
	word-wrap:break-word;
}

.j2022-focus-widget li {
	margin:1.5em 0 2em;
	padding:0 0.5em;
}

.j2022-focus-widget h3 a, .j2022-focus-widget h4 a {
	color:#101820;
	transition:0.3s;
}

.j2022-focus-widget li:hover h3 a, .j2022-focus-widget li:hover h4 a {
	color:#0071bc;
}

.j2022-focus-widget h3 {
	font-size:1.25em;
	margin-bottom:0.5em;
}

.j2022-focus-widget h4 {
	font-size:1.1em;
	margin-bottom:0.5em;
}

.j2022-focus-widget .cate-date {
	font-size:0.8em;
	color:#b3b3b3;
}

.j2022-focus-widget .cate, .j2022-focus-widget .date {
	display:inline-block;
}

.j2022-youtube-widget {
	font-size:14px;
	word-break:keep-all;
	word-wrap:break-word;
}

.j2022-youtube-widget li{
	display:flex;
	margin:1.5em 0 2.5em;
}

.j2022-youtube-widget h3 a, .j2022-youtube-widget h4 a {
	color:#101820;
	transition:0.3s;
}

.j2022-youtube-widget li:hover h3 a, .j2022-youtube-widget li:hover h4 a {
	color:#0071bc;
}

.j2022-youtube-widget h3 {
	font-size:1.1em;
	margin-bottom:0.5em;
}

.j2022-youtube-widget h4 {
	font-size:1.0em;
}

.j2022-youtube-widget .date {
	font-size:0.8em;
	color:#b3b3b3;
}

.j2022-youtube-widget li .htitle {
	min-width:60%;
	flex-grow:0;
}

.j2022-youtube-widget li .thumbnail {
}

.j2022-youtube-widget li .thumbnail img {
	width:100%;
}

.j2022-pamphlet-widget {
	display:flex;
	flex-flow:row;
	justify-content:space-evenly;
	font-size:14px;
	word-break:keep-all;
	word-wrap:break-word;
}

.j2022-pamphlet-widget li {
	width:40%;
}

.j2022-pamphlet-widget li .thumbnail a {
	display:block;
	height:120px;
	background:url() center no-repeat;
	background-size:contain;
	margin:2em 0 1.5em;
}

.j2022-pamphlet-widget h3 a, .j2022-pamphlet-widget h4 a {
	color:#101820;
	transition:0.3s;
}

.j2022-pamphlet-widget li:hover h3 a, .j2022-pamphlet-widget li:hover h4 a {
	color:#0071bc;
}

.j2022-pamphlet-widget h3 {
	font-size:1.1em;
	margin-bottom:0.5em;
	text-align:justify;
}

.j2022-pamphlet-widget .date {
	font-size:0.8em;
	color:#b3b3b3;
}

@media (max-width:768px) {
	.flex-lg-block-sm {
		display:block;
		justify-content: initial;
	}
	
	.flex-lg {
		display:none;
	}
	
	#j2022-main {
		width:initial;
		margin:0;
	}
	
	#j2022-main .publication {
		width:initial;
		margin:0;
		border:none;
		border-top:5px solid #d9d9d9;
	}

	#featured.j2022 header, 
	#j2022-main #j2022-focus.publication header, 
	#j2022-main #j2022-journal.publication header {
		display: block;
		padding: 0.8em 4.34em;
		color:#fff;
		background: #323232 url(j2022-img/logo-dark.png) left center no-repeat;
		background-size: 3.34em;
	}
	
	footer #footer-wrap.j2022-footer div#sitemap #topic-bundles.fourcols h4 {
		border-top:5px solid #d9d9d9;
		display: block;
		padding: 0.6em 3.25em;
		color:#fff;
		background: #323232 url(j2022-img/logo-dark.png) left center no-repeat;
		background-size: 2.5em;
	}
	
	section#featured.j2022 section#feature-contents {
		word-break:keep-all;
		word-wrap:break-word;
	}
	
	section#featured.j2022 section#feature-contents #featured-text-wrapper label{
		color:#b3b3b3;
		display:block;
		font-size:0.9em;
		margin-bottom:0.4em;
	}
	
	.j2022 h2.mobile {
		font-size:initial;
		padding:0;
		margin:0;
		background:none;
	}
	
	#j2022-main .publication .cont {
		padding-top:0.5em;
		padding-bottom:0.5em;
	}
	
	#j2022-main .publication header h2 {
		font-size:1.34em;
		padding:0;
		text-align:left;
	}
	
	#j2022-main .publication header h2 a {
		color: #fff;
	}
	
	.j2022-focus-widget li {
		margin:1em 0;
		padding:0;
	}
	
	.j2022-focus-widget h3 {
		margin-bottom:0.25em;
	}
	
	.j2022-focus-widget h4 {
		margin-bottom:0.25em;
	}
}

section#featured section#feature-contents {
	display:flex;
}

section#featured section#feature-contents #featured-image-wrapper {
	background:url() center no-repeat;
	background-size:cover;
}

@media (max-width:480px) {
	section#featured section#feature-contents {
		display:block;
	}
	
	section#featured section#feature-contents #featured-image-wrapper {
		height:110px;
	}
}

/* header */

header div.login {
    float: right;
    background: #fafafa;
    padding:0 14px 0 42px;
}

header div.navigation.j2022-nav ul#menu-main li ul {
	display:block;
	max-height:0;
	border-bottom:none;
	overflow-y:hidden;
	transition: 0.5s max-height;
}

header div.navigation.j2022-nav ul#menu-main li.active ul {
	max-height:500px;
	border-bottom: 1px solid #b3b3b3;
	z-index:9999;
}

.block-sm {
	display:none;
}

#mobile-menu-fade {
	display:none;
	z-index:998;
	position:fixed;
	top:0;
	bottom:0;
	left:0;
	right:0;
	background:rgba(0, 0, 0, 0.0);
	transition:0.5s;
}

#support-ukraine{
	display:block;
	width:100%;
	padding-bottom:11.11%;
	background:url(j2022-img/support_ukraine_lg.png) no-repeat center;
	background-size:contain;
	margin-bottom:1em;
}

@media(max-width:768px) {
	.block-sm {
		display:block;
	}
	
	hr.j2022.b3b3b3 {
		margin:0;
	}
	
	header .j2022-header {
		display:flex;
		justify-content:space-between;
	}
	
	header .j2022-header .menu-btn {
		display:inline-block;
		font-size: 2em;
		padding: 0.4em 0.1em 0.4em 0.5em;
	}
	
	header .j2022-header .logo {
		float:none;
		display:inline-block;
	}
	
	header div.navigation.j2022-nav {
		margin:0;
		padding:0;
		border:none;
		height:0;
	}
	
	.j2022-nav nav {
		position:fixed;
		z-index:999;
		left:0;
		top:0;
		bottom:0;
		background:#fafafa;
		max-width:0;
		opacity:0;
		overflow-x:hidden;
		transition:0.5s;
	}
	
	.j2022-nav nav.active {
		max-width:480px;
		opacity:1;
		border-right:1px solid #b3b3b3;
		overflow-x:initial;
	}
	
	header div.navigation.j2022-nav ul#menu-main .close-btn-li {
		text-align:left;
	}
	
	header div.navigation.j2022-nav ul#menu-main .close-btn-li .close-btn {
		display:inline-block;
		padding:0.3em 0.75em;
		font-size:2em;
	}
	
	header div.navigation.j2022-nav ul#menu-main {
		position:initial;
		display:flex;
		flex-flow:column;
		margin:0;
		width:initial;
	}
	
	header div.navigation.j2022-nav ul#menu-main>li {
		float:initial;
		width:initial;
		margin:0;
		position:static;
		font-weight:normal;
		padding:0;
		text-align:left;
		border-bottom:1px solid #b3b3b3;
	}
	
	header div.navigation.j2022-nav ul#menu-main>li>a {
		padding:0.6em 1.5em;
	}
	
	header div.navigation.j2022-nav ul#menu-main>li.active>a {
		background:#393f39;
		color:#fff;
	}
	
	header div.navigation.j2022-nav ul#menu-main>li:hover {
		border-top:none;
	}
	
	header div.navigation.j2022-nav ul#menu-main>li ul {
		display:flex;
		flex-flow:column;
		top:0;
		bottom:0;
		left:100%;
		position:absolute;
		background:#fff;
		width:initial;
		overflow-x: hidden;
		transition: 0.5s max-width;
		max-width:0;
		max-height:initial;
		padding-top:1em;
	}
	
	header div.navigation.j2022-nav ul#menu-main>li.active ul {
		max-width:200%;
		max-height:initial;
		z-index:9999;
	}
	
	header div.navigation.j2022-nav ul#menu-main li ul li {
		font-weight:bold;
	}
	
	header div.navigation.j2022-nav ul#menu-main li ul li a {
		width:180px;
		padding:0.5em 2em;
		border:none;
		text-align:left;
	}
	
	.j2022-nav nav.active ~ #mobile-menu-fade {
		display:block;
		background:rgba(0, 0, 0, 0.4);
	}
	
	#support-ukraine{
		margin-top:1em;
		padding-bottom:22.22%;
		background-image:url(j2022-img/support_ukraine_sm.png);
	}
}

/* footer */

#footer-wrap.j2022-footer {
	min-height:initial;
}

#footer-wrap.j2022-footer .contact-info {
	padding:1.5em 0;
}

#footer-wrap.j2022-footer .contacts {
	width:auto;
	margin-top:0;
}

#footer-wrap.j2022-footer .contacts li span {
	margin-right:1em;
}

footer #footer-wrap.j2022-footer div#sitemap div.fourcols ul#topic-left li, footer #footer-wrap.j2022-footer div#sitemap div.fourcols ul#topic-right li {
	border-bottom:1px solid #ccc;
}

footer #footer-wrap.j2022-footer div#sitemap div.fourcols ul#topic-left li {
	border-left:1px solid #ccc;
}

#footer-wrap.j2022-footer div#sitemap #topic-right li a {
	color:#000;
}

@media (max-width:768px) {
	footer div#footer-wrap.j2022-footer ul.contacts li {
		border:none;
	}
	
	#footer-wrap.j2022-footer hr.mobile-footer {
		margin-top: -3px;
	}
	
	#footer-wrap.j2022-footer .contact-info .whoweare h1 {
		font-size:1.5rem;
	}
	
	#footer-wrap.j2022-footer .login {
		text-align:center;
		padding-bottom:30px;
	}
	
	#footer-wrap.j2022-footer .login #top-login {
		padding: 5px 8px;
	}
}

#leftcol.write {
	width:initial;
	float:initial;
}