/*
Theme Name: type-TN22
**POST**
Author: TN
Version: 2.1, 2022.01
*/

@charset "UTF-8";

/*------------------------------------------------------------
	POSTS
------------------------------------------------------------ */
.postlist { display: flex; align-items: flex-start; justify-content: space-between;}
.blog article,
.archive article,
.news article,
.posthead article { width: calc(100% - 280px);}
.blog .sidebar-container,
.archive .sidebar-container,
.news .sidebar-container,
.posthead .sidebar-container,
.single .sidebar-container  { width: 230px; padding: 0; background: #fff;}


/* PAGING */
.paging { width: 100%; margin-top: 10%; display: flex; align-items: center; justify-content: center;}
.paging a, .paging span, .paging i { display: block; font-size: 16px; line-height: 1; margin: 0 .5em; border: 1px solid var(--main); color: var(--main); border-radius: 5px; font-weight: 500;}
.paging a, .paging span { padding: 10px 14px 13px; background: #fff;}
.paging a:hover { background: rgba(79, 23, 127, .15);}
.paging span { background: var(--main); color: #fff;}
.paging span.page-numbers.dots { background: none; color: var(--main); padding: 0; border: 0;}
.paging i { border: 0;}

/*side bar*/
.sidebar-container h3 { font-size:15px; padding:.4em .8em; margin:0; background: var(--main); font-weight: 500; color: #fff;}
.sidebar-container ul { margin-bottom:2em; }
.sidebar-container li { position: relative; padding:1em .2em; margin:0; border:0; width:100% !important; border-bottom:1px solid var(--main); }
.sidebar-container li a { font-size: 14px; position: relative; padding:0 1.2em 0 0; display:block; }
.sidebar-container li a:hover { opacity:.6; background:none; }
.sidebar-container li a::after {
content:"\f105";
font-family: FontAwesome;
position: absolute;
top: 50%;
right: 0;
transform: translate(0%,-50%);
transition: all .2s ease-in-out;
color: var(--main);
display: block;
font-size: 18px;
}

@media(max-width:767px) {
    .postlist { flex-wrap: wrap;}
    .blog article,
    .news article,
    .archive article { width: 100%;}
    .blog .sidebar-container,
    .news .sidebar-container,
    .archive .sidebar-container { width: 100%; margin-top: 10%;}
    .newslist li { margin-bottom: 5%;}
    .newslist li > a { padding: 1.2em; border-radius: 10px;}
    .newslist li img { width: 26%;}
    .newslist h6 { font-size: 1.2rem;}
    .newslist h4 { font-size: 1.6rem; line-height: 1.3;}
    .newslist p { font-size: 1.2rem; line-height: 1.5;}
    .paging { flex-wrap: wrap;}
    .paging a, .paging span { padding: 10px 14px; margin: 0 .4em; font-size: 1.4rem;}
    .paging span.dots { margin: 0;}
    .paging a.prev, .paging a.next { width: 50%; margin: 6% 25%; text-align: center;}

}
@media(max-width:320px) {
    .paging a, .paging span { padding: 10px 13px; font-size: 1.2rem; margin: 0 .3em;}
}


/*------------------------------------------------------------
	SINGLE
------------------------------------------------------------ */
.single .uds .stdBx, .list .stdBx { display:flex; justify-content: space-between; align-items: flex-start; }
.single .uds .stdBx .detail, .list .stdBx .detail { width:75%; }
.single .uds .stdBx .detail .date { color: var(--main);line-height: 1; display: block;}
.single .uds .stdBx .detail p { font-size:18px; line-height:2;}
.single .uds .stdBx .sidebar-container, .list .stdBx .sidebar-container, #eo_event_list_widget-2 { width:20%;}

.single .detail div.prenex { background: none; padding:0 0 0; margin:10% 0 0; background:none !important }
.single .detail div.prenex dl { display:flex; align-items: stretch; justify-content: space-between; margin: 0; padding: 0;}
.single .detail div.prenex dt,
.single .detail div.prenex dd { position: relative; display: block; width: 50%;}
.single .detail div.prenex dd { text-align:right; left: -1px; }
.single .detail div.prenex dt a,
.single .detail div.prenex dd a { position:relative; text-decoration:none !important; padding:1.5em 1.8em 1.7em; border:1px solid var(--main); width:100%; height: 100%; font-weight:500; display: flex; align-items: center; color: var(--main);}
.single .detail div.prenex dt a { padding-left: 2.5em; justify-content: flex-start; border-left: 30px solid var(--main);}
.single .detail div.prenex dd a { padding-right:2.5em; justify-content: flex-end; border-right: 30px solid var(--main);}
.single .detail div.prenex dt a::after,
.single .detail div.prenex dd a::after {
content:"\f104";
font-family: FontAwesome;
position: absolute;
top: 50%;
left: -15px;
transform: translate(-50%,-50%);
transition: all .2s ease-in-out;
color: #fff;
display: block;
font-size: 20px;
}
.single .detail div.prenex dt a { padding: 0 1.2em 0 0;}
.single .detail div.prenex dd a { padding: 0 0 0 1.2em;}
.single .detail div.prenex dt a img { margin: 0 1.2em 0 0;}
.single .detail div.prenex dd a img { margin: 0 0 0 1.2em;}
.single .detail div.prenex a:hover { background: rgba(79, 23, 127, .15);}
.single .detail div.prenex a:hover img { opacity: 1;}
.single .detail div.prenex dd a::after { content:"\f105"; left: inherit; right: -23px; }
.single .detail div.prenex dt a:hover::after { left: -20px; }
.single .detail div.prenex dd a:hover::after { right: -28px; }

.categoryid-5 .detail div.prenex dt a,
.categoryid-5 .detail div.prenex dd a { padding: 1.6em;}

.single .detail h2,
.single .detail h3,
.single .detail h4,
.single .detail h5,
.single .detail h6 { margin-top: 8%;}
.single .detail h2 { font-size:26px; padding:.4em 1em .5em; margin-bottom:1em; background:var(--main); color: #fff;}
.single .detail h3 { font-size:24px; padding:.6em .3em .7em; margin-bottom:1em; border-top:1px solid var(--main); border-bottom:1px solid var(--main); color: var(--main);}
.single .detail h4 { font-size:22px; padding:1em 0 .5em .2em; margin-bottom:1em; border-bottom:1px solid var(--main); }
.single .detail h5 { font-size:20px; padding:0 0 0 .6em; border-left:5px solid var(--main); margin-bottom:.4em; }
.single .detail h6 { font-size:18px; margin-bottom:.4em; }
.single .detail p { margin-bottom:1.5em; }
.single .detail img { height:auto; }
.single .detail figure { margin:0 auto 1.5em; }
.single .detail .wp-post-image { margin:0 auto 1.5em; }
.single .detail hr { margin:5% 0; }
.single .detail pre { border:1px solid #eee; background:#f9f9f9; border-radius:5px; margin:5% 0; padding:4% 5%; font-weight: 260; white-space: normal; line-height:1.8;}
.single .detail strong { position: relative; font-size:1em; color: #292f35; margin:0 .2em; padding:0 .3em .1em; z-index: 0; background: rgba(255,238,17,.6); }
.single .detail strong.blue { background: rgba(60,162,224,.6); }
.single .detail strong.green { background: rgba(50,210,124,.6); }
.single .detail strong.gray { background: rgba(204,204,204,.6); }
.single .detail ul, .detail ol { margin:4% 0; }
.single .detail li {
list-style-position: inside;
padding-left: 1.2em;
text-indent: -1.1em;
margin:0 0 .5em;
line-height:1.6;
}
.single .detail ul li { list-style-type: disc; }
.single .detail blockquote { border-left:5px solid #ccc; margin:5% 0 5% 5%; padding:1% 0 1% 2%; }
.single .detail blockquote p { color:#777; font-size:calc(1em - 2px) !important; line-height:1.5 !important; margin:0 !important; }
.single .detail p a { position:relative; text-align:center; margin:2em 0; padding: .7em 4em 1em; line-height: 1; display:inline-block; border-radius: 12px; background: none; color: var(--txtlink); border: 1px solid var(--txtlink); font-size: calc(1em + 2px); text-decoration: none;}
.single .detail p a:hover { background: rgba(34,145,208,.15);}


@media(max-width:767px) {
    .single .uds .stdBx, .list .stdBx { flex-wrap:wrap; }
    .single .uds .stdBx .detail .date { margin-bottom: 2em;}
    .single .uds .stdBx .detail, .list .stdBx .detail { width:100%; }
    .single .uds .stdBx .detail h1 { font-size:5.2vw; }
    .single .uds .stdBx .detail p { font-size:1.5rem; }
    .single .uds .stdBx .sidebar-container, .list .stdBx .sidebar-container, #eo_event_list_widget-2 { width:100%; margin:10% auto 0; padding:10% 10% 0; border-top:2px solid #f6f6f6; }
    .single .detail h2 { font-size:1.8rem; }
    .single .detail h3 { font-size:1.7rem; }
    .single .detail h4 { font-size:1.7rem; }
    .single .detail h5 { font-size:1.6rem; }
    .single .detail h6 { font-size:1.6rem; }
    .single .detail hr { margin:7% 0; }
    .single .detail pre {margin:5% 0; padding:4% 6%; font-weight: 260; }
    .single .detail strong::after { height: 10px; }
    .single .detail ul, .detail ol { margin:5% 0; }

    .single .detail div.prenex { margin:15% 0 0;}
    .single .prenex dl { flex-wrap: wrap;}
    .single .prenex dt { width:100%; }
    .single .prenex dd { width:100%;}
    .single .detail div.prenex dd { top: -1px; left: inherit;}
    .single .detail div.prenex dl { flex-wrap: wrap; margin:0; padding: 0;}
    .single .detail div.prenex dt,
    .single .detail div.prenex dd { width: 100%;}
    .single .detail div.prenex a, a.pageback { position:relative; text-decoration:none !important; padding:1em 1.8em 1.2em; display:inline-block; width:100%; font-weight:300; }
    a.pageback { text-align:center; }
    .single .prenex a:hover, a.pageback:hover { background:#f0f0f0; }
}

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