@charset "utf-8";
@font-face {font-family: Futura; src: url(../fonts/FuturaPTMedium.otf);}

.type {position: relative; margin-bottom: 6rem;}
.type .cateNav {display: block; text-align: center; font-family: 'Futura', sans-serif; font-weight: 300; font-size: 1.4rem;}
.type .cateNav li {display: inline-block; margin-right: 4rem;}
.type .cateNav li a {position: relative; padding-bottom: 2px;}
.type .cateNav li a:hover {border-bottom: 1px solid #000;}
.type .cateNav li a.active {border-bottom: 1px solid #000;}
.type .cateNav li a.active:hover {opacity: 1;}

.side {width: 320px;}
.side h4 {font-family: 'Futura', sans-serif; font-weight: 300; font-size: 2.5rem; margin-bottom: 1rem;}
.side .list-post {margin-bottom: 4rem;}
.side .list-post li {margin-bottom: 1.5rem;}
.side .list-post li .img {width: 80px;}
.side .list-post li .txt {width: calc(100% - 90px);}
.side .list-post li .txt p:nth-of-type(1) {color: #808080;}
.side .list-post li .txt p:nth-of-type(2) {font-size: 1.2rem;}
.side .year .item {padding: 2rem 0; border-bottom: 1px solid #808080;}
.side .year .item > p {margin-bottom: 1rem; font-size: 1.6rem;}
.side .year .item > p span {display: inline-block; vertical-align: middle;}
.side .year .item .list-post {display: none;}


.contents {width: calc(100% - 350px);}
.contents .post-item {margin-bottom: 4rem; padding-bottom: 2rem; border-bottom: 1px solid #808080;}
.contents .post-item .tit {line-height: 1; margin-bottom: 2rem;}
.contents .post-item .tit p {margin-bottom: 2rem;}
.contents .post-item .tit span {display: inline-block; color: #808080;}
.contents .post-item .tit span:nth-of-type(1) {margin-right: 1rem;}
.contents .post-item .tit span:nth-of-type(2) {border-left: 1px solid #808080; padding-left: 1rem;}
.contents .post-item .tit h4 {font-size: 2.8rem;}
.contents .post-item .cont {line-height: 1.8; font-weight: 400;}
.contents .post-item .cont p {margin-bottom: 2rem;}
.contents .post-item .cont figure {margin-bottom: 2rem;}
.contents .post-item .cont figure figcaption {margin-top: 2rem; font-size: 1.1rem;}
.contents .post-item .cont a {text-decoration: underline;}
.contents .post-item .cont a.pop-single {text-decoration: none;}
.contents .post-item .cont .m-l-10 {padding-left: 1rem;}
.contents .post-item .cont .pdf-download {display: block; width: 240px; text-align: center; font-family: 'Futura', sans-serif; font-weight: 300; border: 1px solid #000; padding: 1.2rem 1rem; text-decoration: none;}

.contents .next {font-family: 'Futura', sans-serif; font-weight: 300;}

.plus-minus-toggle { cursor: pointer; height: 15px; position: relative; width: 15px; background: #000;}
.plus-minus-toggle:before,
.plus-minus-toggle:after{ background: #fff; content: ''; height: 1px; left: 0; right: 0; margin: 0 auto; position: absolute; top: 7px; width: 9px; transition: transform 500ms ease;}
.plus-minus-toggle:after {transform-origin: center;}
.plus-minus-toggle.collapsed:after {transform: rotate(90deg);}
.plus-minus-toggle.collapsed:before {transform: rotate(180deg);}

#cboxContent {margin-bottom: 10rem;}
#cboxTitle {top: auto; bottom: auto; padding-top: 0.5rem;}

@media only screen and (max-width: 767px){
	.type {margin-bottom: 3rem;}
	.type .cateNav {text-align: left;}
	.type .cateNav li {width: 32%; margin-right: 0; text-align: left; margin-bottom: 0.5rem;}


	.side {order: 2; width: 100%;}
	.contents {order: 1; margin-bottom: 4rem; width: 100%;}
	.contents .post-item .tit h4 {font-size: 1.8rem;}

	#cboxContent {margin-bottom: 20rem;}
	#cboxTitle {font-size: 1rem;}
}