@charset "utf-8";

/* 
#========================================# 
 * CSS CONTENTS:
 *
 * 01. Web Font
 * 02. Reset
 * 03. Accessibility Navigation
 * 04. Layout Selector
 *     - Common
 *     - Header
 *     - GNB
 *     - Search
 *     - Footer
 * 05. Home Cover
 *     - Slider
 *     - Video
 *     - Contents
 * 06. List Type
 *     - Gallery
 *     - News
 *     - Search
 * 07. Page
 *     - Not found
 *     - Post
 *     - Tag
 *     - Related articles
 * 08. Components
 *     - Button
 *     - Pagination
 *     - Comments
 * 09. Entry Content
 * 10. ETC
 * 11. Media Query
 *     - Laptop
 *     - Tablet
 *     - Mobile
#========================================# 
*/


/* ---------------------------------------
    Web Font
--------------------------------------- */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700&display=swap');


/* ---------------------------------------
    Reset
--------------------------------------- */

body {
	font-weight: 400;
	font-family: 'Noto Sans KR', sans-serif;
	font-size: 1em;
	line-height: 1.25;
	-webkit-text-size-adjust: 100%;
	-webkit-font-smoothing: antialiased;
	overflow-x: hidden;
}

html, body {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	font-size: 100%;
}

div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td, figure {
	margin: 0;
	padding: 0;
}

header, footer, section, article, aside, nav, hgroup, details, menu, figure, figcaption {
	display: block;
}

button, input[type=submit], input[type=reset], input[type=button] {
	overflow: visible;
	cursor: pointer;
}

input[type=text], input[type=email], input[type=password], input[type=submit], textarea {
	-webkit-appearance: none;
}

input, select, textarea, button {
	font-family: 'Noto Sans KR', sans-serif;
	font-size: 100%;
	border-radius: 0;
}

button {
	overflow: visible;
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
}

ul li {
	list-style: none;
}

img, fieldset {
	border: none;
	vertical-align: top;
}

hr {
	display: none;
}

.clearfix:before {
	content: '';
	display: block;
	clear: both;
}

.clearfix:after {
	content: '';
	display: block;
	clear: both;
}


/* ---------------------------------------
    Accessibility Navigation
--------------------------------------- */

#acc-nav {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1000;
	width: 100%;
	height: 0;
}

#acc-nav a {
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	overflow: hidden;
	width: 1px;
	height: 1px;
	margin-left: -1px;
	margin-bottom: -1px;
	text-align: center;
	font-weight: bold;
	font-size: 0.875em;
	color: #000;
	white-space: nowrap;
}

#acc-nav a:focus, #acc-nav a:hover, #acc-nav a:active {
	width: 100%;
	height: auto;
	padding: 10px 0;
	background: #000;
	color: #fff;
	z-index: 1000;
}


/* ---------------------------------------
    Layout Selector
--------------------------------------- */

/* ----------- Common ----------- */

#wrap {
	width: 100%;
}

.container {
	padding: 80px 0 100px;
}

#tt-body-index .container {
	padding-bottom:0%;
}

#content .inner {
	max-width: 1194px;
	margin: 0 auto;
}

#content > .inner {
	width: 1194px;
	margin: 0 auto;
}

#content .inner:after {
	content: "";
	clear: both;
	display: block;
	height: 0;
	visibility: hidden;
}

#content .contents-inner {
	width: 100%;
	overflow: hidden;
	background-color: #fff;
}

#tt-body-page .container {}

#tt-body-page #content > .inner {
	width: 860px;
	background-color: #fff;
}

#tt-body-page .list-cont-wrap {
	margin-left: 0;
}


/* ----------- Header ----------- */

#header {
	width: 100%;
	height: 80px;
	margin: 0 auto;
	border-bottom: 1px solid #ddd;
	box-sizing: border-box;
	background-color: #fff;
	position: fixed;
	z-index: 5;
	left: 50%;
	transform: translateX(-50%);
	-ms-transform: translateX(-50%); /* IE 9 */
	-webkit-transform: translateX(-50%); /* Safari */
}

#header .header-wrap {
	width: 100%;
	margin: 0 auto;
	position: relative;
}

#header .header-wrap:after {
	content: '';
	display: block;
	clear: both;
}

#header h1 {
	width: 267px;
	height: 40px;
	margin: 15px 0 0 48px;
	float: left;
	background-image: url('./images/logo.svg');
	background-position: 0px 0px;
	background-size: auto 40px;
}

#header .header-title {
	display: block;
	font-size: 0;
	float: left;
}

#header h1 a {
	width: 100%;
	height: 100%;
	display: block;
	font-size: 0;
	text-indent: -9999px;
}

#header .menu {
	margin-right: 140px;
	float: right;
	position: relative;
}

#header .mobile-menu {
	display: none;
}

#header .mobile-search {
	position: absolute;
	top: 24px;
	right: 74px;
	cursor: pointer;
}

#header .mobile-search a {
	display: block;
	width: 32px;
	height: 32px;
	background: url(./images/sprite_web.png);
	background-position: -320px -32px;
	background-repeat: no-repeat;
}

#tt-body-index .mobile-search {
	display: none;
}

#tt-body-search .mobile-search {
	display: none;
}


/* ------------- GNB ------------ */

#gnb {
	width: 100%;
	text-align: right;
}

#gnb:after {
	content: '';
	display: block;
	clear: both;
}

#gnb > ul:after {
	content: '';
	display: block;
	clear: both;
}

#gnb > ul > li > a {
	display: none;
}

#gnb .category_list {
	display: inline-block;
	text-align: right;
	font-size: 0;
}

#gnb .category_list li {
	display: inline-block;
	position: relative;
}

#gnb .category_list li a {
	display: inline-block;
	padding: 30px 40px 30px 40px;
	font-size: 20px;
	line-height: 1em;
	color: #000;
	text-decoration: none;
	font-weight: bold;
	cursor: pointer;
	letter-spacing: -0.04em;
}

#gnb .category_list > li:hover:after {
	content: '';
	display: block;
	width: 5px;
	height: 5px;
	background: #000;
	position: absolute;
	bottom: -2px;
	left: 50%;
	margin-left: -2.5px;
	border-radius: 50%;
	z-index: 5;
}

#gnb .category_list li ul {
	width: 160px;
	position: absolute;
	left: 50%;
	top: 80px;
	margin-left: -80px;
	z-index: 3;
	display: none;
	background: rgba(255, 255, 255, 0.9);
	padding: 30px 0;
}

#gnb .category_list li ul li {
	display: block;
	margin: 18px 0 0;
	text-align: center;
}

#gnb .category_list li ul li:first-child {
	margin-top: 0;
}

#gnb .category_list li ul li a {
	display: inline-block;
	padding: 0;
	font-size: 18px;
	line-height: 1em;
	font-weight: 400;
	color: #666;
}

#gnb .category_list li ul li a:hover {
	text-decoration: underline;
	color: #000;
}


/* ----------- Search ----------- */

.search {
	width: 100%;
	z-index: 1;
	padding: 40px 0;
	background-color: #f9f9f9;
	display: none;
}

.search-wrap {
	width: 600px;
	height: 60px;
	margin: 0 auto;
	padding: 4px 0;
	position: relative;
	overflow: hidden;
	box-sizing: border-box;
	background-color: #fff;
	border: 1px solid #ddd;
	border-radius: 10px;
}

.search-wrap input {
	width: calc(100% - 66px);
	height: 50px;
	padding: 0 30px;
	box-sizing: border-box;
	background-color: transparent;
	font-size: 15px;
	font-weight: 400;
	line-height: 50px;
	color: #000;
	text-align: left;
	border: 0;
}

.search-wrap input::placeholder {
	font-size: 15px;
	color: #666;
	font-weight: 400;
}

.search-wrap button {
	position: absolute;
	top: 4px;
	right: 16px;
	width: 50px;
	height: 50px;
	text-indent: -999em;
	font-size: 0;
	outline: none;
}

.search-wrap button:after {
	content: '';
	display: block;
	margin-left: 9px;
	width: 32px;
	height: 32px;
	background: url('./images/sprite_web.png');
	background-position: -320px -32px;
	background-repeat: no-repeat;
}

/* tag */
.cover-tag {
	width: 100%;
	margin: 20px auto 0;
	text-align: center;
	font-size: 0;
}

.cover-tag span {
	display: inline-block;
	margin-right: 40px;
	font-size: 13px;
	line-height: 1em;
	color: #000;
	font-weight: 700;
}

.cover-tag ul {
	display: inline-block;
}

.cover-tag ul li {
	display: inline-block;
	margin: 0 15px;
	font-size: 0;
}

.cover-tag ul li:first-child {
	margin-left: 0;
}

.cover-tag ul li a {
	font-size: 13px;
	color: #666;
	cursor: pointer;
	text-decoration: none;
	letter-spacing: -0.04em;
}

.cover-tag ul li a:hover {
	text-decoration: underline;
}

.search.active {
	position: absolute;
	display: block;
	top: 80px;
}

#tt-body-index .search {
	display: block;
}

#tt-body-search .search {
	display: block;
	padding: 110px 0 30px;
}

#tt-body-search .container {
	padding-top: 0;
}


/* ----------- Footer ----------- */

#footer {
	width: 100%;
	background-color: #333;
}

.cover-footer {
	position: relative;
	width: 1194px;
	margin: 0 auto;
	padding: 40px 0 40px;
}

.cover-footer .foot-logo {
	position: absolute;
	top: 34px;
	left: -12px;
	display: block;
	width: 267px;
	height: 40px;
	background-image: url('./images/logo_w.svg');
	background-size: auto 40px;
}

.cover-footer .footer-menu {
	margin: 54px 0 0;
}

.cover-footer .footer-menu .copyright {
	color: #aaa;
	font-size: 14px;
	line-height: 1em;
}

.cover-footer .copyright-m {
		display:none;
}

.cover-footer .footer-menu ul {
	display: inline-block;
	font-size: 0;
	margin: 10px 0 0;
}

.cover-footer .footer-menu ul li {
	display: inline-block;
}

.cover-footer .footer-menu ul li:before {
	content: '';
	display: inline-block;
	width: 1px;
	height: 12px;
	background-color: #444;
	margin: 0px 15px;
	vertical-align: 0px;
}

.cover-footer .footer-menu ul li:first-child:before {
	display: none;
}

.cover-footer .footer-menu ul li a {
	font-size: 15px;
	letter-spacing: -0.04em;
	color: #aaa;
	text-decoration: none;
}

.cover-footer .footer-menu ul li a:hover {
	text-decoration: underline;
}


/* footer sns */
.cover-footer .footer-sns {
	position: absolute;
	top: 40px;
	right: 230px;
}

.cover-footer .footer-sns ul {}

.cover-footer .footer-sns li {
	float: left;
	border: 1px solid #aaa;
	border-radius: 50%;
	overflow: hidden;
	margin-left: 10px;
}

.cover-footer .footer-sns li:hover {
	border-color: #fff;
}

.cover-footer .footer-sns li a {
	width: 32px;
	height: 32px;
	display: block;
	background-image: url('./images/sprite_web.png');
	background-position: 0 0;
	text-indent: -9999px;
	font-size: 0;
}

.cover-footer .footer-sns .youtube a {
	background-position: 0px 0;
}

.cover-footer .footer-sns .youtube a:hover {
	background-position: 0px -32px;
}

.cover-footer .footer-sns .instagram a {
	background-position: -32px 0;
}

.cover-footer .footer-sns .instagram a:hover {
	background-position: -32px -32px;
}

.cover-footer .footer-sns .facebook a {
	background-position: -64px 0;
}

.cover-footer .footer-sns .facebook a:hover {
	background-position: -64px -32px;
}

.cover-footer .footer-sns .naverblog a {
 background-image: url("https://tistory1.daumcdn.net/tistory/234232/skin/images/footer_naverblog_icon.png");
 background-position: -96px 0;
}
.cover-footer .footer-sns .naverblog a:hover {
	background-position: -96px -32px;
}

/* footer familysite */
.cover-footer .footer-familysite {
	position: absolute;
	top: 40px;
	right: 0px;
}

.cover-footer .footer-familysite .select-box {
	position: relative;
	width: 200px;
	height: 34px;
	line-height: 34px;
	border-bottom: 1px solid #aaa;
	box-sizing: border-box;
	font-size: 14px;
	color: #aaa;
	cursor: pointer;
}

.cover-footer .footer-familysite .select-box:before {
	content: '';
	width: 32px;
	height: 32px;
	display: block;
	position: absolute;
	right: 0;
	top: 1px;
	background-image: url('./images/sprite_web.png');
	background-position: -64px -128px;
}

.cover-footer .footer-familysite .select-box.active:before {
	background-position: -64px -96px;
}

.cover-footer .footer-familysite .select-list {
	display: none;
	border: 1px solid #aaa;
	width: 100%;
	box-sizing: border-box;
}

.cover-footer .footer-familysite .select-list li {}

.cover-footer .footer-familysite .select-list li:hover {
	background: #555555;
}

.cover-footer .footer-familysite .select-list li a {
	display: block;
	width: 100%;
	height: 30px;
	line-height: 30px;
	font-size: 12px;
	color: #aaa;
	box-sizing: border-box;
	padding: 0 10px;
	text-decoration: none;
}


/* ---------------------------------------
    Home Cover
--------------------------------------- */

/* ----------- Slider ----------- */

.cover-slider {
	position: relative;
	width: 100%;
	height: 720px;
	overflow: hidden;
	background-color: #000;
}

.cover-slider-mo {
	display: none;
}

.cover-slider li {
	display: none;
}

.cover-slider .slick-slide li {
	width: 100%;
	height: 720px;
	text-align: center;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}

.cover-slider .slick-slide li a {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	background-color: rgba(0, 0, 0, 0);
	text-decoration: none;
	color: #fff;
	vertical-align: bottom;
}

.cover-slider .slick-slide li a p {
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
	font-size: 24px;
	font-weight: 700;
	line-height: 1.5em;
	letter-spacing: -0.04em;
}

.cover-slider .slick-slide li a p + p {
	font-size: 42px;
	margin: 10px 0 0;
	font-weight: 300;
}

.slick-dotted.slick-slider {
	margin: 0;
}


/* slider arrow */
.cover-slider .slick-arrow {
	position: absolute;
	top: 50%;
	z-index: 1;
	width: 52px;
	height: 52px;
}

.cover-slider .slick-arrow.slick-prev {
	left: 30px;
}

.cover-slider .slick-arrow.slick-next {
	right: 30px;
}

.cover-slider .slick-arrow:before {
	content: '';
	width: 32px;
	height: 32px;
	display: block;
	margin: 10px;
	background-image: url(./images/sprite_web.png);
}

.cover-slider .slick-prev:before {
	background-position: -160px 0px;
}

.cover-slider .slick-next:before {
	background-position: -192px 0px;
}

.cover-slider .slick-arrow:hover {
	transition: all 0.3s ease-in-out;
}

.cover-slider .slick-prev:hover:before {
	background-position: -160px -32px;
}

.cover-slider .slick-next:hover:before {
	background-position: -192px -32px;
}


/* slider dot */
.slider-dots-box {
	position: absolute;
	bottom: 50px;
	display: block;
	width: 100%;
	list-style: none;
	text-align: center;
}

.slider-dots {}

.slider-dots li {
	list-style: none;
	position: relative;
	display: inline-block;
	width: 40px;
	height: 40px;
	margin: 0 5px;
	padding: 0;
	cursor: pointer;
}

.slider-dots button {
	position: relative;
	display: block;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	transition: .3s all;
}

.slider-dots button:after {
	content: "";
	display: block;
	width: 8px;
	height: 8px;
	background-color: rgba(255, 255, 255, 0.5);
	-moz-transform: rotate(45deg); /* FF3.5/3.6 */
	-o-transform: rotate(45deg); /* Opera 10.5 */
	-webkit-transform: rotate(45deg); /* Saf3.1+ */
	transform: rotate(45deg); /* Newer browsers (incl IE9) */
}

.slider-dots-box .slick-active button svg {
	position: absolute;
}

.slider-dots-box .slick-active button:after {
	background-color: rgba(255, 255, 255, 1);
}

.circle-bg {
	fill: rgba(255, 255, 255, 0);
	stroke: rgba(0, 0, 0, 0.05);
	stroke-width: 1;
	stroke-linecap: butt;
}

.circle-go {
	fill: rgba(255, 255, 255, 0);
	stroke: rgba(255, 255, 255, 1);
	stroke-width: 1;
	stroke-linecap: round;
	animation: progress 22s;
	stroke-dasharray: 360px;
	stroke-dashoffset: 360;
}

@keyframes progress {
	from {
		stroke-dashoffset: 360;
	}

	to {
		stroke-dashoffset: 0;
	}
}


/* ----------- Video ------------ */

.cover-video {
	padding: 100px 0px;
	background-color: #fff;
}

.cover-video .inner {
	position: relative;
}

.cover-video h2 {
	position: relative;
	display: inline-block;
	margin-bottom: 30px;
	font-size: 28px;
	font-weight: 700;
	line-height: 1em;
	color: #000;
	font-family: 'Montserrat', sans-serif;
}

.cover-video ul {
	margin-left: -30px;
	vertical-align: top;
}

.cover-video ul:after {
	content: '';
	display: block;
	clear: both;
}

.cover-video ul li {
	float: left;
	width: calc(50% - 30px);
	margin-left: 30px;
	box-sizing: border-box;
	overflow: hidden;
}

.cover-video ul li .video-wrap {
	display: block;
	position: relative;
	width: 100%;
	height: 0;
	padding-bottom: 56.25%;
}

.cover-video ul li iframe {
	position: absolute;
	top: 0;
	left: -1px;
	width: 100%;
	height: 100%;
}


/* ---------- Contents ---------- */

.cover-list-thumb {
	padding: 100px 0;
	background: #fff;
}

.cover-list-thumb .inner {
	position: relative;
}

.cover-list-thumb h2 {
	position: relative;
	margin-bottom: 30px;
	font-size: 28px;
	font-weight: 700;
	line-height: 1em;
	color: #000;
	font-family: 'Montserrat', sans-serif;
	z-index: 1;
}

.cover-list-thumb ul {
	margin-left: -30px;
	vertical-align: top;
}

.cover-list-thumb ul:after {
	content: '';
	display: block;
	clear: both;
}

.cover-list-thumb ul li {
	float: left;
	width: calc(33.3333% - 30px);
	margin-left: 30px;
	box-sizing: border-box;
	overflow: hidden;
}

.cover-list-thumb ul li a {
	display: block;
	text-decoration: none;
	color: #222;
	overflow: hidden;
	background-color: transparent;
}

.cover-list-thumb ul li .thum {
	height: 420px;
	box-sizing: border-box;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
}

.cover-list-thumb:after {
	content: '';
	min-height: inherit;
}

.cover-list-thumb ul li .thum img {
	height: 100%;
	transform: scale(1);
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	-o-transform: scale(1);
	transition: all 0.2s ease-in-out;
}

.cover-list-thumb ul li a:hover .thum img {
	transform: scale(1.1);
	-webkit-transform: scale(1.1);
	-moz-transform: scale(1.1);
	-ms-transform: scale(1.1);
	-o-transform: scale(1.1);
}

.cover-list-thumb ul li .title {}

.cover-list-thumb ul li .title span {
    display:block;
	box-sizing: border-box;
	word-break: break-all;
	font-size: 20px;
	line-height: 1.5em;
	letter-spacing: -0.04em;
	font-weight: 500;
	color: #000;
}

.cover-list-thumb .btn-wrap {
	width: 100%;
	position: absolute;
	bottom: 0;
	text-align: center;
}

.cover-list-thumb .btn-wrap a {
	position: relative;
	text-decoration: none;
	padding: 10px 98px 10px 50px;
	display: inline-block;
	cursor: pointer;
	border: 1px solid #ddd;
	border-radius: 30px;
	background: #fff;
}

.cover-list-thumb .btn-wrap a span {
	display: inline-block;
	font-size: 20px;
	font-weight: 700;
	line-height: 30px;
	color: #666;
}

.cover-list-thumb .btn-wrap a:after {
	content: '';
	display: block;
	position: absolute;
	top: 10px;
	right: 40px;
	width: 30px;
	height: 30px;
	background-image: url(./images/sprite_web.png);
	background-position: 0 -97px;
}

.cover-list-thumb .btn-wrap a:hover {
	background: #000;
}

.cover-list-thumb .btn-wrap a:hover span {
	color: #fff;
}

.cover-list-thumb .btn-wrap a:hover:after {
	background-position: 0 -129px;
}


/* cover-list-thumb 01 */
.cover-list-thumb01 {
	background: #f1f5f9;
}

.cover-list-thumb01 h2 {
	color: #002f67;
}

.cover-list-thumb01 h2:before {
	content: '';
	display: block;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: #d8e1ea;
	position: absolute;
	left: -20px;
	top: -20px;
	z-index: -1;
}

.cover-list-thumb01 ul li .title {
	position: relative;
	width: calc(100% - 38px);
	padding: 20px;
	margin-top: -50px;
	margin-left: 38px;
	box-sizing: border-box;
	border-radius: 20px 0 20px 0;
	background: #fff;
}

.cover-list-thumb01 ul li .title span {
	overflow: hidden;
	height: 60px;
	font-weight: 700;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

.cover-list-thumb01 ul li a:hover .title {
	background-color: #002f67;
}

.cover-list-thumb01 ul li a:hover .title span {
	color: #fff;
}

.cover-list-thumb01 .detail_info {
	display: none;
}


/* cover-list-thumb 02 */
.cover-list-thumb02 {}

.cover-list-thumb02 ul {
	padding-bottom: 52px;
}

.cover-list-thumb02 ul li {
	margin-bottom: 70px;
	display: none;
}

.cover-list-thumb02 ul li .title {
	margin: 20px 0;
}

.cover-list-thumb02 ul li .title span {
	overflow: hidden;
	height: 3em;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

.cover-list-thumb02 .detail_info {}

.cover-list-thumb02 .detail_info .category {
	font-size: 16px;
	color: #002f67;
}

.cover-list-thumb02 .detail_info .date {
	display: none;
}



/* ---------------------------------------
    List Type
--------------------------------------- */

/* ----- List Type : Gallery ---- */

.cate-style-gallery .container {
	background-color: #fff;
}

.cate-style-gallery #content:after {
	content: '';
	display: block;
	clear: both;
}

.cate-style-gallery .list-cont-wrap {
	margin-left: -30px;
}

.cate-style-gallery .list_content {
	width: calc(50% - 30px);
	margin: 0 0 60px 30px;
	float: left;
}

.cate-style-gallery .list_content:nth-child(2n+3) {
	clear: left;
}

.cate-style-gallery .link_post {
	text-decoration: none;
	display: block;
}

.cate-style-gallery .list-thumbnail {
	width: 100%;
	height: 380px;
	display: block;
	overflow: hidden;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
}

.cate-style-gallery .thumbnail_img {
	width: 100%;
	max-width: 100%;
	height: auto;
	transform: scale(1);
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	-o-transform: scale(1);
	transition: all 0.3s ease-in-out;
}

.cate-style-gallery .list_content:hover .thumbnail_img {
	transform: scale(1.1);
	-webkit-transform: scale(1.1);
	-moz-transform: scale(1.1);
	-ms-transform: scale(1.1);
	-o-transform: scale(1.1);
}

.cate-style-gallery .list_info {
	width: 100%;
	padding: 30px 0px 0px;
	box-sizing: border-box;
	overflow: hidden;
}

.cate-style-gallery .list_info .list_title {
	width: 100%;
	display: inline-block;
	margin-bottom: 10px;
	overflow: hidden;
	font-size: 20px;
	font-weight: 700;
	color: #000;
	line-height: 1.5em;
	height: 3em;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	word-break: keep-all;
}

.cate-style-gallery .list_content:hover .list_title {}

.cate-style-gallery .list_info .list_summary {
	display: none;
}

.cate-style-gallery .list_info .list_category {
	display: none;
}

.cate-style-gallery .list_info .list_date {
	margin: 20px 0 0;
	font-size: 14px;
	line-height: 1em;
	color: #999;
}


/* ----- List Type : News ------- */

.cate-style-news .container {
	background-color: #fff;
}

.cate-style-news #content:after {
	content: '';
	display: block;
	clear: both;
}

.cate-style-news .list-cont-wrap {}

.cate-style-news .list_content {
	width: 100%;
	margin: 0 0 60px;
}

.cate-style-news .link_post {
	text-decoration: none;
	display: block;
}

.cate-style-news .link_post:after {
	content: '';
	display: block;
	clear: both;
}

.cate-style-news .list-thumbnail {
	width: 380px;
	height: 270px;
	float: left;
	display: block;
	overflow: hidden;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
}

.cate-style-news .thumbnail_img {
	width: 100%;
	max-width: 100%;
	height: auto;
	transform: scale(1);
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	-o-transform: scale(1);
	transition: all 0.3s ease-in-out;
}

.cate-style-news .list_content:hover .thumbnail_img {
	transform: scale(1.1);
	-webkit-transform: scale(1.1);
	-moz-transform: scale(1.1);
	-ms-transform: scale(1.1);
	-o-transform: scale(1.1);
}

.cate-style-news .list_info {
	width: calc(100% - 380px);
	height: 270px;
	float: left;
	padding: 0px 30px;
	box-sizing: border-box;
	overflow: hidden;
	display: flex;
	justify-content: center;
	flex-direction: column;
}

.cate-style-news .list_info .list_title {
	width: 100%;
	display: inline-block;
	margin-bottom: 20px;
	overflow: hidden;
	font-size: 20px;
	font-weight: 700;
	color: #000;
	line-height: 1.5em;
	max-height: 3em;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	word-break: keep-all;
}

.cate-style-news .list_info .list_summary {
	font-size: 16px;
	font-weight: 400;
	word-break: break-all;
	display: block;
	display: -webkit-box;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical;
	overflow: hidden;
	max-height: 6em;
	line-height: 1.5em;
	letter-spacing: -0.04em;
	color: #333;
}

.cate-style-news .list_info .list_category {
	display: none;
}

.cate-style-news .list_info .list_date {
	display: inline-block;
	text-align: left;
	margin: 20px 0 0;
	font-size: 14px;
	line-height: 1em;
	color: #999;
}


/* ----- List Type : Search ----- */

.cate-style-search .container {
	background-color: #fff;
}

.cate-style-search #content:after {
	content: '';
	display: block;
	clear: both;
}

.cate-style-search .list-cont-wrap {}

.cate-style-search .list_content {
	width: 100%;
	margin: 0 0 60px;
}

.cate-style-search .link_post {
	text-decoration: none;
	display: block;
}

.cate-style-search .link_post:after {
	content: '';
	display: block;
	clear: both;
}

.cate-style-search .list-thumbnail {
	width: 380px;
	height: 270px;
	float: left;
	display: block;
	overflow: hidden;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
}

.cate-style-search .thumbnail_img {
	width: 100%;
	max-width: 100%;
	height: auto;
	transform: scale(1);
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	-o-transform: scale(1);
	transition: all 0.3s ease-in-out;
}

.cate-style-search .list_content:hover .thumbnail_img {
	transform: scale(1.1);
	-webkit-transform: scale(1.1);
	-moz-transform: scale(1.1);
	-ms-transform: scale(1.1);
	-o-transform: scale(1.1);
}

.cate-style-search .list_info {
	width: calc(100% - 380px);
	height: 270px;
	float: left;
	padding: 0px 30px;
	box-sizing: border-box;
	overflow: hidden;
	display: flex;
	justify-content: center;
	flex-direction: column;
}

.cate-style-search .list_info .list_title {
	width: 100%;
	display: inline-block;
	margin-bottom: 20px;
	overflow: hidden;
	font-size: 20px;
	font-weight: 700;
	color: #000;
	line-height: 1.5em;
	max-height: 3em;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	word-break: keep-all;
}

.cate-style-search .list_info .list_summary {
	font-size: 16px;
	font-weight: 400;
	word-break: break-all;
	display: block;
	display: -webkit-box;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical;
	overflow: hidden;
	max-height: 6em;
	line-height: 1.5em;
	letter-spacing: -0.04em;
	color: #333;
}

.cate-style-search .list_info .list_category01 {
	display: block;
	font-size: 16px;
	font-weight: 700;
	color: #002f67;
	margin: 0 0 10px;
}

.cate-style-search .list_info .list_category02 {
	display: none;
}

.cate-style-search .list_info .list_date {
	display: inline-block;
	text-align: left;
	margin: 20px 0 0;
	font-size: 14px;
	line-height: 1em;
	color: #999;
}


/* ---------------------------------------
    Page
--------------------------------------- */

/* ---------- Not found --------- */

.not-found {
	padding: 25% 0;
}

.not-found ul {
	display: none;
	margin: 0 auto;
	text-align: center;
}

.search-empty .pagination {
	display: none;
}

.search-empty .not-found ul li {
	text-align: center;
	font-size: 18px;
	color: #777;
	line-height: 1.5em;
}

#tt-body-search .search-empty .not-found ul.keyword {
	display: block;
}

#tt-body-category .search-empty .not-found ul.category {
	display: block;
}

#tt-body-tag .search-empty .not-found ul.tag {
	display: block;
}

#tt-body-archive .search-empty .not-found ul.archive {
	display: block;
}


/* ------------ Post ------------ */

/* post header */
.post-header {
	position: relative;
	overflow: hidden;
	margin: 0px auto 80px;
	padding-top: 80px;
	text-align: center;
}

.post-header h1 {
	position: relative;
	display: inline-block;
	font-size: 28px;
	font-weight: 700;
	color: #000;
	z-index: 1;
}

.post-header h1 span {
	display:none;
}

.post-header h1 em {
	font-weight: 400;
	font-style: normal;
}

.post-header h1:before {
	content: '';
	display: block;
	width: 40px;
	height: 40px;
	background: #f1f1f1;
	position: absolute;
	left: -20px;
	top: -15px;
	border-radius: 50%;
	z-index: -1;
}

.post-header .article-count {
	display: none;
}

.post-header .list-type {
	float: right;
}

.post-header .list-type button {
	float: left;
	width: 24px;
	height: 24px;
	margin-left: 4px;
	background-image: url(./images/ico_package.png);
	background-repeat: no-repeat;
	text-indent: -999em;
	outline: none;
}

.post-header .list-type button:hover {
	background-color: #ebebeb;
}

.post-header .list-type .list {
	background-position: 0 -200px;
}

.post-header .list-type .thum {
	background-position: -100px -200px;
}

.post-header .list-type .list.current {
	background-position: -50px -200px;
}

.post-header .list-type .thum.current {
	background-position: -150px -200px;
}

.search-empty .post-header {
	display: none;
}

#tt-body-search .post-header {
	padding-top: 60px;
	margin-bottom: 100px;
}

#tt-body-search .post-header h1 {
	color: #002f67;
}

#tt-body-search .post-header h1 em {
	display: none;
}

#tt-body-search .post-header h1:before {
	display: none;
}

#tt-body-search .post-header .article-count {
	display: inline-block;
	font-size: 28px;
	color: #000;
	letter-spacing: -0.04em;
}


/* post item */
.post-item {
	overflow: hidden;
	width: 100%;
	border-bottom: 1px solid #ebebeb;
}

.post-item a {
	display: block;
	min-height: 148px;
	padding: 30px 0 30px;
	text-decoration: none;
	color: #080808;
}

.post-item:first-child a {
	padding-top: 0;
}

.post-item a:hover .title {
	text-decoration: underline;
	color: #4e2e28;
}

.post-item .thum {
	float: right;
	overflow: hidden;
	max-width: 148px;
	margin-left: 80px;
}

.post-item .thum img {
	width: 195px;
	height: 148px;
	margin: 0 0 0 -23.5px;
}

.post-item .category {
	display: inline-block;
	margin-bottom: 16px;
	border-bottom: 1px solid #a3a3a3;
	font-size: 0.875em;
	color: #808080;
}

.post-item .title {
	display: block;
	margin-bottom: 8px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	max-height: 2.8em;
	font-weight: 700;
	font-size: 1.125em;
	line-height: 1.4;
}

.post-item .excerpt {
	display: block;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-size: 0.9375em;
	line-height: 1.6;
	color: #666;
}

.post-item .excerpt.protected:before {
	content: "";
	display: inline-block;
	width: 9px;
	height: 13px;
	margin-right: 10px;
	background: url(./images/ico_package.png) no-repeat -0 -100px;
	vertical-align: baseline;
}

.post-item .date {
	display: block;
	font-size: 0.8125em;
	color: #999;
}


/* hgroup */
.hgroup {
	margin: 0px auto 50px;
	padding: 100px 0 50px;
	border-bottom: 1px solid #ddd;
	text-align: left;
}

.hgroup .category {
	display: none;
}

.hgroup .category a {
	font-size: 20px;
	font-weight: 500;
	text-decoration:none;
}

.hgroup .category span {
	vertical-align:middle;
}

.hgroup .category .depth01 a {
	color:#999;
}

.hgroup .category .depth02 a {
	color: #002f67;
}

.hgroup .category .bar {
	color:#999;
}

.hgroup h1 {
	display: block;
	font-weight: 700;
	font-size: 28px;
	line-height: 1.5em;
	margin: 20px 0;
}

.hgroup .post-meta {
	display: block;
	font-size: 16px;
	color: #999;
}

.hgroup .post-meta a {
	text-decoration: none;
	color: #999;
}

.hgroup .post-meta a:hover {
	text-decoration: underline;
}

.hgroup .post-meta span:before {
	content: "";
	display: inline-block;
	width: 1px;
	height: 10px;
	margin: 0 10px 0 10px;
	background-color: #ebebeb;
	vertical-align: baseline;
}

.hgroup .post-meta span.date {
	font-size: 16px;
	color: #999;
	font-family: 'Montserrat', sans-serif;
	font-weight: 400;
}

.hgroup .post-meta span:first-child:before {
	content: none;
}


/* ------------ Tag ------------- */

.tags {
	color: #555;
	font-size: 0;
	border-bottom: 1px solid #ddd;
	padding-bottom: 50px;
	margin-bottom: 50px;
}

.tags h2 {
	font-size: 20px;
	margin-bottom: 10px;
	font-weight: 500;
	line-height: 1em;
	color: #000;
}

.tags .items {}

.tags .items a {
	display: inline-block;
	text-decoration: none;
	font-size: 16px;
	line-height: 40px;
	color: #555;
	margin: 0 30px 0 0;
	font-weight: 400;
}

.tags .items a:hover {
	text-decoration: underline;
}

.tags .items a:before {
	content: "#";
}


/* ------ Related articles ------ */

.related-articles {
	overflow: hidden;
	width: 100%;
	margin: 100px 0px 60px;
}

.related-articles h2 {
	margin-bottom: 20px;
	font-weight: 400;
	font-size: 20px;
	color: #222;
	display: none;
}

.related-articles h2 em {
	border-bottom: 1px solid #000;
	font-style: normal;
}

.related-articles ul {
	margin-left: -20px;
}

.related-articles ul li {
	float: left;
	width: calc(33.3333% - 20px);
	margin-left: 20px;
}

.related-articles ul li:nth-of-type(4) {
	display: none;
}

.related-articles ul li a {
	display: block;
	text-decoration: none;
}

.related-articles ul li .thum {
	display: block;
	position: relative;
	overflow: hidden;
	height: 0;
	margin-bottom: 10px;
	padding-bottom: 75.757575757575758%;
	background-color: #ebebeb;
}

.related-articles ul li .thum:before {
	content: "NO IMAGE";
	position: absolute;
	top: 50%;
	left: 0;
	z-index: 0;
	width: 100%;
	height: 18px;
	margin: -9px 0 0 0;
	text-align: center;
	font-family: 'Arial';
	font-weight: bold;
	font-size: 0.875em;
	color: #cbcbcb;
}

.related-articles ul li .thum img {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	width: 100%;
	height: 100%;
}

.related-articles ul li .category {
	display: inline-block;
	margin-bottom: 16px;
	border-bottom: 1px solid #a3a3a3;
	font-size: 0.875em;
	color: #808080;
}

.related-articles ul li .title {
	display: block;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	max-height: 3em;
	line-height: 1.5em;
	font-size: 16px;
	color: #000;
	font-weight: 700;
}

.related-articles ul li a:hover .title {
	text-decoration: underline;
}

.related-articles ul li .date {
	display: block;
	font-size: 0.8125em;
	color: #999;
}


/* ---------------------------------------
    Components
--------------------------------------- */

/* ----------- Button ----------- */

#move-top {
	position: fixed;
	right: 50px;
	bottom: 50px;
	display: none;
	z-index: 999;
	width: 50px;
	height: 50px;
	background-image: url('./images/sprite_web.png');
	background-position: -135px -103px;
}

.btn-list {
	margin: 0 0 100px;
}

.btn-list a {
	display: block;
	margin: 0 auto;
	width: 200px;
	height: 60px;
	line-height: 60px;
	font-size: 16px;
	color: #000;
	font-weight: 500;
	border: 1px solid #ddd;
	box-sizing: border-box;
	text-align: center;
	text-decoration: none;
}


/* --------- Pagination --------- */

.pagination {
	max-width: 860px;
	margin: 90px auto 0;
	text-align: center;
	font-size: 0;
}

.pagination a {
	display: inline-block;
	margin: 0 5px;
	text-decoration: none;
	vertical-align: middle;
}

.pagination a span {
	display: block;
	width: 38px;
	height: 38px;
	text-align: center;
	font-size: 14px;
	line-height: 38px;
	color: #222;
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
}

.pagination .selected {
	border-radius: 5px;
	overflow: hidden;
	background: #222;
	color: #fff;
}

.pagination .prev, .pagination .next {
	width: 32px;
	height: 32px;
	background-image: url(./images/sprite_web.png);
	background-repeat: no-repeat;
	text-indent: -999em;
	vertical-align: middle;
	box-sizing: border-box;
}

.pagination .prev {
	background-position: -128px 0;
}

.pagination .next {
	background-position: -128px -32px;
}

.pagination .no-more-prev, .pagination .no-more-next {
	display: none;
}


/* ---------- Comments ---------- */

.comments {
	max-width: 860px;
	margin: 0 auto 30px;
}

.comments h2 {
	font-weight: 400;
	font-size: 1em;
	color: #000;
}

.comments .comment-list {
	font-size: 16px;
	margin-bottom: 6px;
	overflow: hidden;
}

.comments .comment-list ul li {
	padding: 30px 0 25px;
	border-top: 1px solid #e6e6e6;
	position: relative;
	min-height: 48px;
}

.comments .comment-list ul li:first-child {
	border: none;
}

.comments .comment-list ul li ul li {
	padding: 26px 0 0 60px;
	border-top: 0;
	border-bottom: 0;
}

.comments .comment-list ul li .author-meta {
	position: absolute;
	overflow: hidden;
	top: 30px;
	height: 48px;
	left: 0;
	right: 0;
	padding: 4px 0 0 60px;
}

.comments .comment-list ul li ul li .author-meta {
	top: 26px;
	left: 60px;
}

.comments .comment-list ul li .author-meta .avatar {
	position: absolute;
	left: 0;
	top: 0;
	width: 48px;
	height: 48px;
	border-radius: 50%;
}

.comments .comment-list ul li .author-meta span {
	display: inline-block;
}

.comments .comment-list ul li .author-meta a {
	text-decoration: none;
	color: #000;
}

.comments .comment-list ul li .author-meta .nickname {
	float: left;
	font-size: 0.875em;
	line-height: 20px;
}

.comments .comment-list ul li .author-meta .nickname .tistoryProfileLayerTrigger {
	margin-bottom: 3px;
	margin-right: 0;
	vertical-align: bottom;
}

.comments .comment-list ul li .author-meta .date {
	float: left;
	margin-left: 10px;
	font-size: 0.75em;
	color: #999;
	line-height: 20px;
}

.comments .comment-list ul li .author-meta .date:before,
.comments .comment-list ul li .author-meta .date a:before {
	content: "";
	display: inline-block;
	width: 1px;
	height: 9px;
	margin-right: 10px;
	background-color: #b2b2b2;
}

.comments .comment-list ul li .author-meta .date a {
	margin-left: 10px;
}

.comments .comment-list ul li .control {
	position: absolute;
	top: 33px;
	right: 0;
}

.comments .comment-list ul li ul li .control {
	top: 29px;
}

.comments .comment-list ul li .control a {
	margin: 0 2px;
	text-decoration: none;
	font-size: 12px;
	color: #999;
}

.comments .comment-list ul li p {
	position: relative;
	margin: 29px 0 0 60px;
	font-size: 0.875em;
	line-height: 1.5714;
	color: #666;
}

.comments .comment-form .field {
	position: relative;
	overflow: hidden;
	width: 100%;
	margin-bottom: 8px;
}

.comments .comment-form input[type=text],
.comments .comment-form input[type=password],
.comments .comment-form textarea {
	border: 1px solid #e6e6e6;
	font-size: 0.9375em;
	line-height: 1.25;
	color: #666;
	background-color: transparent;
}

.comments .comment-form input[type=text],
.comments .comment-form input[type=password] {
	width: 140px;
	height: 52px;
	margin-right: 6px;
	padding: 10px;
	box-sizing: border-box;
}

.comments .comment-form input::-webkit-input-placeholder,
.comments .comment-form textarea::-webkit-input-placeholder {
	color: #d6d6d6;
}

.comments .comment-form textarea {
	display: block;
	width: 100%;
	margin-bottom: 10px;
	padding: 10px;
	resize: none;
	box-sizing: border-box;
}

.comments .comment-form .field .secret {
	display: inline-block;
	margin-left: 15px;
	vertical-align: middle;
}

.comments .comment-form .field .secret input {
	display: none;
}

.comments .comment-form .field .secret label {
	font-size: 0.8125em;
	line-height: 52px;
	color: #b5b5b5;
	outline: none;
	cursor: pointer;
}

.comments .comment-form .field .secret label:before {
	content: "";
	display: inline-block;
	width: 19px;
	height: 18px;
	margin-right: 9px;
	border: 1px solid #e1e1e1;
	vertical-align: middle;
	background-color: #fff;
}

.comments .comment-form .field .secret input[type=checkbox]:checked + label:before {
	background-image: url(./images/ico_package.png);
	background-repeat: no-repeat;
	background-position: -151px -101px;
}

.comments .comment-form .submit {}

.comments .comment-form .submit button {
	width: 160px;
	height: 60px;
	line-height: 60px;
	color: #000;
	font-weight: normal;
	font-size: 16px;
	text-align: center;
	border: 1px solid #e6e6e6;
	box-sizing: border-box;
}


/* ---------------------------------------
    Entry Content
--------------------------------------- */

.entry-content {
	font-family: AppleSDGothicNeo-Regular, 'Malgun Gothic', '맑은 고딕', dotum, '돋움', sans-serif;
	-webkit-font-smoothing: antialiased;
	font-size: 16px;
	word-wrap: break-word;
	color: #333;
}

.entry-content h1 {
	clear: both;
	margin: 29px 0 22px;
	font-size: 1.6875em;
	line-height: 1.5;
	color: #000;
}
.entry-content h2 {
	clear: both;
	margin: 29px 0 22px;
	font-size: 1.5em;
	line-height: 1.5;
	color: #000;
}
.entry-content h3 {
	clear: both;
	margin: 29px 0 22px;
	font-size: 1.3125em;
	line-height: 1.5;
	color: #000;
}
.entry-content h4 {
	clear: both;
	margin: 29px 0 22px;
	font-weight: 400;
	font-size: 1.125em;
	line-height: 1.5;
	color: #000;
}
.entry-content a {
	color: #04beb8;
}
.entry-content p {
	margin-bottom: 32px;
	word-break: break-all;
	font-size: 0.9375em;
	line-height: 2;
	color: #555;
}
.entry-content p img {
	max-width: 100%;
	height: auto;
}
.entry-content figure {
	margin-top: 8px !important;
}
.entry-content hr {
	display: block;
	height: 0;
	border: 0;
	border-bottom: 1px solid #000;
}
.entry-content pre {
	word-break:break-all;
	white-space:pre-wrap;
	word-wrap:break-word;
}
.entry-content ul {
	list-style: disc;
	margin-bottom: 22px;
	padding: revert;
}
.entry-content ul li {
	position: relative;
	margin-bottom: 10px;
	padding-left: 22px;
	font-size: 0.9375em;
	line-height: 1.5714;
	color: #666;
	text-indent: -22px;
	list-style: inherit;
}
.entry-content ol {
	list-style: decimal inside;
	margin-bottom: 22px;
}
.entry-content ol li {
	position: relative;
	margin-bottom: 10px;
	padding-left: 16px;
	font-size: 0.9375em;
	line-height: 1.5714;
	color: #666;
	text-indent: -15px;
	list-style: inherit;
}
.entry-content img.alignleft {
	float: left;
	margin: 0 22px 22px 0;
}
.entry-content img.aligncenter {
	display: block;
	margin: 0 auto 22px;
}
.entry-content img.alignright {
	float: right;
	margin: 0 0 22px 22px;
}
.entry-content blockquote {
	margin-bottom: 40px;
	padding: 16px 20px;
	border-left: 4px solid #e6e6e6;
}
.entry-content blockquote p {
	margin: 22px 0 0;
}
.entry-content blockquote p:first-child {
	margin-top: 0;
}
.entry-content table {
	width:100%;
	margin-bottom: 22px;
	border: 1px solid #e6e6e6;
	border-collapse: collapse;
	text-align: center;
	font-size: 0.9375em;
	line-height: 1.5714;
	color: #666;
}
.entry-content table thead th {
	padding:7px 0 11px;
	border-left: 1px solid #e6e6e6;
}
.entry-content table tbody td {
	padding:7px 0 11px;
	border-left: 1px solid #e6e6e6;
	border-top: 1px solid #e6e6e6;
}
.entry-content input {
	height: 36px;
	padding: 0 10px;
	border: 1px solid #e6e6e6;
	font-size: 0.875em;
	line-height: 1.25;
	color: #666;
	box-sizing: border-box;
	vertical-align: middle;
}
.entry-content .entry-content .protected_form {
	margin-bottom: 40px;
	padding: 120px 0 200px;
	border-bottom: 1px solid #7a583a;
	text-align: center;
}
.entry-content .entry-content .protected_form input {
	width: 200px;
	margin-bottom: 10px;
	vertical-align: top;
}
.entry-content .cap1 {
	text-align: center;
	font-size: 0.875em;
	font-style: italic;
}
.entry-content .iframe-wrap {
	position: relative;
	height: 0;
	padding-bottom: 0%;
}
.entry-content .iframe-wrap iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.entry-content .protected_form {
	display: block;
	width: 100%;
	padding: 98px 0 120px;
	text-align: center;
}
.entry-content .protected_form h2 {
	margin: 0 0 8px;
	font-weight: 600;
	font-size: 1.625em;
	line-height: 2.125rem;
	color: #555;
}
.entry-content .protected_form p {
	margin-bottom: 34px;
	font-weight: 300;
	font-size: 1em;
	line-height: 1.75;
	color: #999;
}
.entry-content .protected_form input {
	width: 183px;
	padding: 0 23px;
	border: 1px solid #eee;
	font-size: 0.9125em;
	line-height: 2.125rem;
}
.entry-content .protected_form input:focus {
	border-color: #484848;
}
.entry-content .protected_form .btn {
	margin-left: 5px;
}


/* ---------------------------------------
    ETC
--------------------------------------- */

#dimmed {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 300;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.43);
}


/* ---------------------------------------
    MEDIA QUERY
--------------------------------------- */

/* ----------- Button ----------- */




/* 
************************************************************************************
   Media Query
************************************************************************************
*/

/* ----------- Laptop ----------- */

@media (min-width: 1025px) and (max-width: 1280px) {
    


	/* ---------------------------------------
		Home Cover
	--------------------------------------- */

	/* ----------- Slider ----------- */

	.cover-slider {
		height: 500px;
	}
	
	.cover-slider .slick-slide li {
		height: 500px;
	}
	
	.slider-dots-box {
		bottom:20px;
	}

}


/* ----------- Tablet ----------- */

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

/* ----------- Common ----------- */ 
    
.container {
	padding: 58px 0 100px;
}

#content .inner {
	max-width: 100%;
}

#content > .inner {
	width: 100%;
}
    
#tt-body-page #content > .inner {
	width: 100%;
}
    

/* ----------- Header ----------- */

#header {
    width: 100%;
    height: 58px;
    border-color:#f1f1f1;
}

#header h1 {
	width: 167px;
    height: 25px;
    margin: 14px 0 0 20px;
    background-size: auto 25px;
    background-repeat: no-repeat; 
}   
    
#header .menu {
    display: none;
	position: absolute;
    width: 100%;
    height: calc(100vh - 58px);
    top: 58px;
    left: 0;
	margin: 0px;
	float: none;
    overflow-y: auto;
    background: #fff;
    z-index: 10;
}

#header .mobile-menu {
    display: block;
    position: absolute;
    top: 19px;
    right: 20px;
    cursor: pointer;
} 
     
#header .mobile-menu a {
    display: block;
    width: 20px;
    height: 20px;
    background-image: url(./images/sprite_2x.png);
    background-size: 200px auto;
    background-position: 0px 0px;
    cursor: pointer;
} 
    
.navon #header .mobile-menu a {
    background-position: -30px 0px;
}
    
#header .mobile-search {
    display: block;
    position: absolute;
    top: 19px;
    right: 65px;
}

#header .mobile-search a {
    display: block;
    width: 20px;
    height: 20px;
    background-image: url(./images/sprite_2x.png);
    background-size: 200px auto;
    background-position: -60px 0px;
    cursor: pointer;
}
    
#tt-body-index .mobile-search {
	display: block;
}

#tt-body-search .mobile-search {
	display: block;
}
    

/* ------------- GNB ------------ */

#gnb {
	text-align: left;
}
    
#gnb .category_list {
	display: block;
	text-align: left;
    padding-left: 20px;
}

#gnb .category_list li {
	display: block;
}
    
#gnb .category_list > li {
	border-bottom:1px solid #e7e7e7;
}
    
#gnb .category_list li a {
	display: block;
	padding: 22px 0px;
	font-size: 18px;
}

#gnb .category_list > li > a:after {
    content:'';
    display: block;
    width: 20px;
    height: 20px;
    position: absolute;
    top: 20px;
    right: 20px;
    background-image: url("./images/sprite_2x.png");
    background-size: 200px auto;
    background-position: -120px -0px;
}

#gnb .category_list > li > a.active:after {
    background-position: -150px -0px;
}
    
#gnb .category_list > li:hover:after {
	display:none;
}

#gnb .category_list li ul {
	position: static;
	width: 100%;
	margin: 0;
	padding: 0 0 20px;
	z-index: auto;
	display: none;
	background: rgba(255, 255, 255, 0);
}

#gnb .category_list li ul li {
	margin: 0;
	text-align: left;
}

#gnb .category_list li ul li a {
	display: block;
	padding: 16px 20px;
	font-size: 14px;
	color: #666;
}

#gnb .category_list li ul li a:hover {
	text-decoration: none;
}
    

/* ----------- Search ----------- */

.search {
    position: absolute;
    top: 58px;
    left: 0;
    box-sizing:border-box;
	padding: 20px 20px;
	background-color: #fff;
    z-index: 5;
}

.search-wrap {
    position: relative;
	width: 100%;
	padding: 0;
	background-color: #fff;
    border: 0;
	border-bottom: 1px solid #e5e5e5;
	border-radius: 0;
}

.search-wrap:before {
    content:'';
    display: block;
    width: 20px;
    height: 20px;
    position: absolute;
    top: 20px;
    left: 0px;
    background-image: url("./images/sprite_2x.png");
    background-size: 200px auto;
    background-position: -90px -0px;
}

.search-wrap input {
	width: calc(100% - 20px);
	height: 50px;
	padding: 0 0 0 20px;
    margin: 5px 0 5px 20px;
	font-size: 16px;
}

.search-wrap input::placeholder {
	font-size: 16px;
	color: #b5b5b5;
	font-weight: 300;
}

.search-wrap button {
	display:none;
}

.search-wrap button:after {
	display:none;
}


#tt-body-index .search {
	display: none;
}

.search.active {
	position: absolute;
	display: block;
	top: 58px;
    z-index: 15;
}
    
#tt-body-search .search {
	display: none;
	padding: 20px 20px;
}

#tt-body-search .container {
	padding-top: 0;
}
    
/* tag */
.cover-tag {
	margin: 40px auto 0;
	text-align: left;
}

.cover-tag span {
	display: block;
	margin: 0 0 20px;
	font-size: 18px;
	color: #000;
	font-weight: 500;
}

.cover-tag ul {
	display: inline-block;
}

.cover-tag ul li {
	margin: 5px 15px 5px 0;
}

.cover-tag ul li a {
	font-size: 14px;
}


/* ----------- Footer ----------- */

.cover-footer {
	width: 100%;
	padding-bottom:60px;
}

.cover-footer .foot-logo {
	position: static;
	width: 167px;
	height: 25px;
    margin:0 auto;
	background-image: url('./images/logo_w.svg');
    background-size: auto 25px;
    background-repeat: no-repeat;
}

.cover-footer .footer-menu {
	margin: 30px 0 0;
    text-align: center;
}

.cover-footer .footer-menu .copyright {
	position:absolute;
	width:100%;
	bottom:30px;
	font-size:12px;
	text-align:center;
	color:#666;
}

.cover-footer .copyright-m {
		display:none;
}
	
.cover-footer .footer-menu ul {
	margin: 0;
}

.cover-footer .footer-menu ul li {
	display: inline-block;
}

.cover-footer .footer-menu ul li:before {
	content: '';
	display: inline-block;
	width: 1px;
	height: 12px;
	background-color: #444;
	margin: 0px 15px;
	vertical-align: 0px;
}

.cover-footer .footer-menu ul li:first-child:before {
	display: none;
}

.cover-footer .footer-menu ul li a {
	font-size: 12px;
}

    
/* footer sns */
.cover-footer .footer-sns {
	position: static;
    text-align: center;
    margin:30px 0 10px;
}

.cover-footer .footer-sns ul { 
    display:inline-block;
}

.cover-footer .footer-sns li {
	float: left;
	overflow: hidden;
	margin: 0 10px;
    border:0;
}

.cover-footer .footer-sns li a {
	width: 20px;
	height: 20px;
    padding: 4px;
	background-image: url('./images/sprite_2x.png');
    background-size: 200px auto;
	background-position: 0 0;
}

.cover-footer .footer-sns .youtube a {
	background-position: 4px -26px;
}

.cover-footer .footer-sns .youtube a:hover {
	background-position: 4px -26px;
}

.cover-footer .footer-sns .instagram a {
	background-position: -26px -26px;
}

.cover-footer .footer-sns .instagram a:hover {
	background-position: -26px -26px;
}

.cover-footer .footer-sns .facebook a {
	background-position: -56px -26px;
}

.cover-footer .footer-sns .facebook a:hover {
	background-position: -56px -26px;
}

.cover-footer .footer-sns .naverpost a {
	background-position: -86px -26px;
}

.cover-footer .footer-sns .naverpost a:hover {
	background-position: -86px -26px;
}


/* footer familysite */
.cover-footer .footer-familysite {
	position: static;
	width: 130px;
    margin:0 auto;
}

.cover-footer .footer-familysite .select-box {
	position: relative;
    width: 100%;
	font-size: 12px;
}


/* ---------------------------------------
    Home Cover
--------------------------------------- */

/* ----------- Slider ----------- */

.cover-slider {
    display:none;
}

.cover-slider-mo {
    position:relative;
	display: block;
	overflow: hidden;
    width:100%;
}

.cover-slider-mo li {
	display: none;
}

.cover-slider-mo .slick-slide li {
	width: 100%;
    position:relative;
    padding-top: 66.66%;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}
    
.cover-slider-mo .slick-slide li a {
	width: 100%;
	height: 100%;
    position:  absolute;
    top: 0;
    left: 0;
    text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	text-decoration: none;
	color: #fff;
	vertical-align: bottom;
}
    
.cover-slider-mo .slick-slide li a p {
	width: calc(100% - 60px);
	margin: 0 auto;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.5em;
	letter-spacing: -0.04em;
}

.cover-slider-mo .slick-slide li a p + p {
	font-size: 24px;
	margin: 10px 0 0;
	font-weight: 300;
}

    
/* slider arrow */
.cover-slider-mo .slick-arrow {
	position: absolute;
	top: 50%;
	z-index: 1;
	width: 30px;
	height: 30px;
}

.cover-slider-mo .slick-arrow.slick-prev {
	left: 0px;
}

.cover-slider-mo .slick-arrow.slick-next {
	right: 0px;
}

.cover-slider-mo .slick-arrow:before {
	content: '';
	width: 30px;
	height: 30px;
	display: block;
	background-image: url(./images/sprite_web.png);
}

.cover-slider-mo .slick-prev:before {
	background-position: -160px 0px;
}

.cover-slider-mo .slick-next:before {
	background-position: -192px 0px;
}


/* slider dot */
.slider-dots-box-mo {
	position: absolute;
	bottom: 20px;
	display: block;
	width: 100%;
	list-style: none;
	text-align: center;
}

.slider-dots-mo li {
	list-style: none;
	position: relative;
	display: inline-block;
	width: 20px;
	height: 20px;
	margin: 0 3px;
	padding: 0;
	cursor: pointer;
}

.slider-dots-mo button {
	position: relative;
	display: block;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	transition: .3s all;
}

.slider-dots-mo button:after {
	content: "";
	display: block;
	width: 4px;
	height: 4px;
	background-color: rgba(255, 255, 255, 0.5);
	-moz-transform: rotate(45deg); /* FF3.5/3.6 */
	-o-transform: rotate(45deg); /* Opera 10.5 */
	-webkit-transform: rotate(45deg); /* Saf3.1+ */
	transform: rotate(45deg); /* Newer browsers (incl IE9) */
}

.slider-dots-box-mo .slick-active button svg {
	position: absolute;
}

.slider-dots-box-mo .slick-active button:after {
	background-color: rgba(255, 255, 255, 1);
}
    

/* ----------- Video ------------ */

.cover-video {
	padding: 40px 20px;
	background-color: #fff;
}  
    
.cover-video h2 {
    margin-bottom: 20px;
    font-size: 20px;
}

}
   
/* ---------- Contents ---------- */

.cover-list-thumb {
	padding: 40px 20px;
	background: #fff;
}

.cover-list-thumb h2 {
	margin-bottom: 20px;
	font-size: 20px;
}

.cover-list-thumb ul {
    margin-left: -20px;
}

.cover-list-thumb ul li {
	float: left;
	width: calc(50% - 20px);
	margin-left: 20px;
    margin-bottom: 20px; 
	box-sizing: border-box;
	overflow: hidden;
}

.cover-list-thumb ul li .thum {
    position: relative;
    width:100%;
	height: auto;
    padding-bottom: 95%; 
}

.cover-list-thumb ul li .thum img {
    position: absolute; 
    width: 100%; 
    height: auto;
    top: 50%; 
    left: 0; 
	  transform: translateY(-50%);
	  -webkit-transform: translateY(-50%);
	  -moz-transform: translateY(-50%);
	  -ms-transform: translateY(-50%);
	  -o-transform: translateY(-50%);
}

.cover-list-thumb ul li a:hover .thum img {
	  transform: translateY(-50%);
	  -webkit-transform: translateY(-50%);
	  -moz-transform: translateY(-50%);
	  -ms-transform: translateY(-50%);
	  -o-transform: translateY(-50%);
}


.cover-list-thumb ul li .title span {
	font-size: 16px;
}

.cover-list-thumb .btn-wrap {
	width: 100%;
	position: absolute;
	bottom: 0;
	text-align: center;
}

.cover-list-thumb .btn-wrap a {
	position: relative;
	text-decoration: none;
	padding: 10px 98px 10px 50px;
	display: inline-block;
	cursor: pointer;
	border: 1px solid #ddd;
	border-radius: 30px;
	background: #fff;
}

.cover-list-thumb .btn-wrap a span {
	display: inline-block;
	font-size: 18px;
	font-weight: 400;
	line-height: 30px;
	color: #000;
}

.cover-list-thumb .btn-wrap a:after {
	content: '';
	display: block;
	position: absolute;
	top: 10px;
	right: 40px;
	width: 30px;
	height: 30px;
	background-image: url(./images/sprite_web.png);
	background-position: 0 -97px;
}

.cover-list-thumb .btn-wrap a:hover {
	background: #000;
}

.cover-list-thumb .btn-wrap a:hover span {
	color: #fff;
}

.cover-list-thumb .btn-wrap a:hover:after {
	background-position: 0 -129px;
}


/* cover-list-thumb 01 */
.cover-list-thumb01 {
	background: #f1f5f9;
}
    
.cover-list-thumb01 h2:before {
	width: 20px;
	height: 20px;
	left: -10px;
	top: -10px;
}

.cover-list-thumb01 ul { margin-left: -20px; }

.cover-list-thumb01 ul li {
	width: calc(33.3333% - 20px);
    margin-bottom: 0;
    margin-left:20px;
}
    
.cover-list-thumb01 ul li .title {
	width: calc(100%);
	margin: 0px;
	border-radius: 0;
}

.cover-list-thumb01 ul li .title span {
	height: 3em;
	font-weight: 500;
}

.cover-list-thumb01 ul li a:hover .title {
	background-color: #fff;
}

.cover-list-thumb01 ul li a:hover .title span {
	color: #000;
}

.cover-list-thumb01 .detail_info {
	display: block;
    padding:0 20px 20px;
    background:#fff;
}

.cover-list-thumb01 .detail_info .category {
	color:#002f67;
    font-size:12px;
    margin-right:10px;
    display:inline-block;
}
    
.cover-list-thumb01 .detail_info .date {
	color:#b5b5b5;
    font-size:12px;
}
    

/* cover-list-thumb 02 */
.cover-list-thumb02 {}

.cover-list-thumb02 ul {
	padding-bottom: 52px;
}

.cover-list-thumb02 ul li {
	margin-bottom: 20px;
	display: none;
    border:1px solid #ddd;
}

.cover-list-thumb02 ul li .thum {
    padding-bottom: 56.25%;  /* 16:9 */
}
    
.cover-list-thumb02 ul li .title {
	margin: 0;
	padding: 20px;
}
    
.cover-list-thumb02 .detail_info {
	padding: 0 20px 20px;
}

.cover-list-thumb02 .detail_info .category {
	font-size: 12px;
	color: #002f67;
}

.cover-list-thumb02 .detail_info .date {
	font-size: 12px;
	color: #b5b5b5;
    display:inline-block;
}
    


/* ---------------------------------------
    List Type
--------------------------------------- */

/* ----- List Type : Gallery ---- */
.cate-style-gallery .list-cont-wrap {
	margin-left: -20px;
    padding:0 20px;
    box-sizing:border-box;
}

.cate-style-gallery .list_content {
	width: calc(50% - 20px);
	margin: 0 0 20px 20px;
}

.cate-style-gallery .list-thumbnail {
    display: block;
    position: relative;
    height: 0;
    padding-bottom: 75.757575757575758%;
}

.cate-style-gallery .list-thumbnail img {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
    z-index: 1;
    width: auto;
    max-width:none;
    height: 100%;
}

.cate-style-gallery .list_content:hover .thumbnail_img {
	transform: none;
	-webkit-transform: none;
	-moz-transform: none;
	-ms-transform: none;
	-o-transform: none;
}

.cate-style-gallery .list_info {
	width: 100%;
	padding: 20px 0px 20px;
}

.cate-style-gallery .list_info .list_title {
	margin-bottom: 10px;
	font-size: 16px;
	font-weight: 500;
    height: auto;
    height:3em;
}

.cate-style-gallery .list_info .list_summary {
	display: block;
    font-size: 14px;
	font-weight: 400;
    color: #333;
	word-break: break-all;
	display: block;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	max-height: 4.5em;
	line-height: 1.5em;
	letter-spacing: -0.04em;
}

.cate-style-gallery .list_info .list_category {
	display: none;
}

.cate-style-gallery .list_info .list_date {
	margin: 10px 0 0;
	font-size: 14px;
	color: #b5b5b5;
    display:inline-block;
}

#tt-body-search .cate-style-gallery .list_info .list_category02 {
	display: inline-block;
	font-size: 12px;
	color: #002f67;
    margin-right:10px;
}

/* ---------------------------------------
    Page
--------------------------------------- */

/* ---------- Not found --------- */

.not-found {
	padding: 50% 20px 30%;
}
    
.search-empty .not-found ul li {
	font-size: 16px;
}
    

/* ------------ Post ------------ */

/* post header */
.post-header {
	margin: 0px auto 40px;
	padding-top: 40px;
}

.post-header h1 {
	font-size: 20px;
}

.post-header h1:before {
	width: 20px;
	height: 20px;
	left: -10px;
	top: -10px;
}

#tt-body-search .post-header {
	padding-top: 100px;
	margin-bottom: 40px;
}

#tt-body-search .post-header .article-count {
	font-size: 20px;
}


/* hgroup */
.hgroup {
	margin: 0px auto 30px;
	padding: 40px 0 30px;
	border-bottom: 1px solid #f4f4f4;
}

.hgroup .category a {
	font-size: 14px;
	font-weight: 500;
	color: #002f67;
}

.hgroup h1 {
	font-weight: 700;
	font-size: 20px;
	line-height: 1.5em;
	margin: 20px 0;
}

.hgroup .post-meta {
	display: block;
	font-size: 14px;
	color: #999;
}

.hgroup .post-meta a {
	text-decoration: none;
	color: #999;
}

.hgroup .post-meta a:hover {
	text-decoration: underline;
}

.hgroup .post-meta span:before {
	content: "";
	display: inline-block;
	width: 1px;
	height: 10px;
	margin: 0 10px 0 10px;
	background-color: #ebebeb;
	vertical-align: baseline;
}

.hgroup .post-meta span.date {
	font-size: 14px;
	color: #b5b5b5;
}

.hgroup .post-meta span:first-child:before {
	content: none;
}



/* ------------ Tag ------------- */

.tags {
	color: #555;
	font-size: 0;
	border-bottom: 1px solid #ddd;
	padding-bottom: 30px;
	margin-bottom: 30px;
}

.tags h2 {
	font-size: 20px;
	margin-bottom: 10px;
	font-weight: 500;
}

.tags .items a {
	font-size: 14px;
	line-height: 25px;
	color: #555;
	margin: 0 15px 0 0;
}


/* ------ Related articles ------ */

/*
.related-articles {
	overflow: hidden;
	width: 100%;
	margin: 40px 0px 40px;
}

.related-articles h2 {
	margin-bottom: 20px;
	font-weight: 700;
	font-size: 16px;
	color: #000;
    font-family: 'Montserrat', sans-serif;
    display: block;
}
    
.related-articles h2 strong { display:none; }

.related-articles h2 em {
	border-bottom: 1px solid #000;
	font-style: normal;
}

.related-articles ul {
	margin-left: 0px;
}

.related-articles ul li {
	float: none;
	width: 100%;
	margin: 0 0 40px;
}

.related-articles ul li:nth-of-type(4) {
	display: none;
}
    
.related-articles ul li .thum {
    margin-bottom: 10px;
}

.related-articles ul li .title {
	font-weight: 500;
}
*/
    
    


/* ---------------------------------------
    Components
--------------------------------------- */

/* ----------- Button ----------- */

#move-top {
	right: 20px;
	bottom: 20px;
}

.btn-list {
	margin: 0 0 40px;
}

.btn-list a {
	width: 100%;
	font-size: 16px;
}


/* --------- Pagination --------- */
    
.pagination {
	max-width: 860px;
	margin: 90px auto 0;
	text-align: center;
	font-size: 0;
}

.pagination a {
	display: inline-block;
	margin: 0 5px;
	text-decoration: none;
	vertical-align: middle;
}

.pagination a span {
	display: block;
	width: 38px;
	height: 38px;
	text-align: center;
	font-size: 14px;
	line-height: 38px;
	color: #222;
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
}

.pagination .selected {
	border-radius: 5px;
	overflow: hidden;
	background: #222;
	color: #fff;
}

.pagination .prev, .pagination .next {
	width: 32px;
	height: 32px;
	background-image: url(./images/sprite_web.png);
	background-repeat: no-repeat;
	text-indent: -999em;
	vertical-align: middle;
	box-sizing: border-box;
}

.pagination .prev {
	background-position: -128px 0;
}

.pagination .next {
	background-position: -128px -32px;
}

.pagination .no-more-prev, .pagination .no-more-next {
	display: none;
}


/* ---------- Comments ---------- */

.comments .comment-list {
	font-size: 14px;
}
    
.comments .comment-list ul li ul li {
	padding: 26px 0 0 30px;
}
    
.comments .comment-list ul li ul li .author-meta {
	left: 30px;
}

.comments .comment-form input[type=text],
.comments .comment-form input[type=password] {
	width: calc(100%);
	height: 52px;
	margin-right: 0px;
    margin-bottom: 6px;
}

.comments .comment-form .field .secret {
	margin-left: 0px;
}

.comments .comment-form .submit button {
	font-size: 14px;
}  
    

}


/* ----------- Mobile ----------- */
@media (min-width: 320px) and (max-width: 767px) {
    
/* ----------- Common ----------- */ 
    
.container {
	padding: 58px 0 100px;
}

#content .inner {
	max-width: 100%;
}

#content > .inner {
	width: 100%;
}
    
#tt-body-page #content > .inner {
	width: 100%;
}
    

/* ----------- Header ----------- */

#header {
    width: 100%;
    height: 58px;
    border-color:#f1f1f1;
}

#header h1 {
	width: 167px;
    height: 25px;
    margin: 14px 0 0 20px;
    background-size: auto 25px;
    background-repeat: no-repeat; 
}   
    
#header .menu {
    display: none;
	position: absolute;
    width: 100%;
    height: calc(100vh - 58px);
    top: 58px;
    left: 0;
	margin: 0px;
	float: none;
    overflow-y: auto;
    background: #fff;
    z-index: 10;
}

#header .mobile-menu {
    display: block;
    position: absolute;
    top: 19px;
    right: 20px;
    cursor: pointer;
} 
     
#header .mobile-menu a {
    display: block;
    width: 20px;
    height: 20px;
    background-image: url(./images/sprite_2x.png);
    background-size: 200px auto;
    background-position: 0px 0px;
    cursor: pointer;
} 
    
.navon #header .mobile-menu a {
    background-position: -30px 0px;
}
    
#header .mobile-search {
    display: block;
    position: absolute;
    top: 19px;
    right: 65px;
}

#header .mobile-search a {
    display: block;
    width: 20px;
    height: 20px;
    background-image: url(./images/sprite_2x.png);
    background-size: 200px auto;
    background-position: -60px 0px;
    cursor: pointer;
}
    
#tt-body-index .mobile-search {
	display: block;
}

#tt-body-search .mobile-search {
	display: block;
}
    

/* ------------- GNB ------------ */

#gnb {
	text-align: left;
}
    
#gnb .category_list {
	display: block;
	text-align: left;
    padding-left: 20px;
}

#gnb .category_list li {
	display: block;
}
    
#gnb .category_list > li {
	border-bottom:1px solid #e7e7e7;
}
    
#gnb .category_list li a {
	display: block;
	padding: 22px 0px;
	font-size: 18px;
}

#gnb .category_list > li > a:after {
    content:'';
    display: block;
    width: 20px;
    height: 20px;
    position: absolute;
    top: 20px;
    right: 20px;
    background-image: url("./images/sprite_2x.png");
    background-size: 200px auto;
    background-position: -120px -0px;
}

#gnb .category_list > li > a.active:after {
    background-position: -150px -0px;
}
    
#gnb .category_list > li:hover:after {
	display:none;
}

#gnb .category_list li ul {
	position: static;
	width: 100%;
	margin: 0;
	padding: 0 0 20px;
	z-index: auto;
	display: none;
	background: rgba(255, 255, 255, 0);
}

#gnb .category_list li ul li {
	margin: 0;
	text-align: left;
}

#gnb .category_list li ul li a {
	display: block;
	padding: 16px 20px;
	font-size: 14px;
	color: #666;
}

#gnb .category_list li ul li a:hover {
	text-decoration: none;
}
    

/* ----------- Search ----------- */

.search {
    position: absolute;
    top: 58px;
    left: 0;
    box-sizing:border-box;
	padding: 20px 20px;
	background-color: #fff;
    z-index: 5;
}

.search-wrap {
    position: relative;
	width: 100%;
	padding: 0;
	background-color: #fff;
    border: 0;
	border-bottom: 1px solid #e5e5e5;
	border-radius: 0;
}

.search-wrap:before {
    content:'';
    display: block;
    width: 20px;
    height: 20px;
    position: absolute;
    top: 20px;
    left: 0px;
    background-image: url("./images/sprite_2x.png");
    background-size: 200px auto;
    background-position: -90px -0px;
}

.search-wrap input {
	width: calc(100% - 20px);
	height: 50px;
	padding: 0 0 0 20px;
    margin: 5px 0 5px 20px;
	font-size: 16px;
}

.search-wrap input::placeholder {
	font-size: 16px;
	color: #b5b5b5;
	font-weight: 300;
}

.search-wrap button {
	display:none;
}

.search-wrap button:after {
	display:none;
}


#tt-body-index .search {
	display: none;
}

.search.active {
	position: absolute;
	display: block;
	top: 58px;
    z-index: 15;
}
    
#tt-body-search .search {
	display: none;
	padding: 20px 20px;
}

#tt-body-search .container {
	padding-top: 0;
}
    
/* tag */
.cover-tag {
	margin: 40px auto 0;
	text-align: left;
}

.cover-tag span {
	display: block;
	margin: 0 0 20px;
	font-size: 18px;
	color: #000;
	font-weight: 500;
}

.cover-tag ul {
	display: inline-block;
}

.cover-tag ul li {
	margin: 5px 15px 5px 0;
}

.cover-tag ul li a {
	font-size: 14px;
}


/* ----------- Footer ----------- */

.cover-footer {
	width: 100%;
}

.cover-footer .foot-logo {
	position: static;
	width: 167px;
	height: 25px;
    margin:0 auto;
	background-image: url('./images/logo_w.svg');
    background-size: auto 25px;
    background-repeat: no-repeat;
}

.cover-footer .footer-menu {
	margin: 30px 0 0;
    text-align: center;
}

.cover-footer .footer-menu .copyright {
	display:none;
}

.cover-footer .copyright-m {
	font-size:10px;
	color:#666;
	text-align:center;
	margin:30px 0 0;
	display:block;
}
	
.cover-footer .footer-menu ul {
	margin: 0;
}

.cover-footer .footer-menu ul li {
	display: inline-block;
}

.cover-footer .footer-menu ul li:before {
	content: '';
	display: inline-block;
	width: 1px;
	height: 12px;
	background-color: #444;
	margin: 0px 15px;
	vertical-align: 0px;
}

.cover-footer .footer-menu ul li:first-child:before {
	display: none;
}

.cover-footer .footer-menu ul li a {
	font-size: 12px;
}

    
/* footer sns */
.cover-footer .footer-sns {
	position: static;
    text-align: center;
    margin:30px 0 10px;
}

.cover-footer .footer-sns ul { 
    display:inline-block;
}

.cover-footer .footer-sns li {
	float: left;
	overflow: hidden;
	margin: 0 10px;
    border:0;
}

.cover-footer .footer-sns li a {
	width: 20px;
	height: 20px;
    padding: 4px;
	background-image: url('./images/sprite_2x.png');
    background-size: 200px auto;
	background-position: 0 0;
}

.cover-footer .footer-sns .youtube a {
	background-position: 4px -26px;
}

.cover-footer .footer-sns .youtube a:hover {
	background-position: 4px -26px;
}

.cover-footer .footer-sns .instagram a {
	background-position: -26px -26px;
}

.cover-footer .footer-sns .instagram a:hover {
	background-position: -26px -26px;
}

.cover-footer .footer-sns .facebook a {
	background-position: -56px -26px;
}

.cover-footer .footer-sns .facebook a:hover {
	background-position: -56px -26px;
}

.cover-footer .footer-sns .naverpost a {
	background-position: -86px -26px;
}

.cover-footer .footer-sns .naverpost a:hover {
	background-position: -86px -26px;
}


/* footer familysite */
.cover-footer .footer-familysite {
	position: static;
	width: 130px;
    margin:0 auto;
}

.cover-footer .footer-familysite .select-box {
	position: relative;
    width: 100%;
	font-size: 12px;
}


/* ---------------------------------------
    Home Cover
--------------------------------------- */

/* ----------- Slider ----------- */

.cover-slider {
    display:none;
}

.cover-slider-mo {
    position:relative;
	display: block;
	overflow: hidden;
    width:100%;
}

.cover-slider-mo li {
	display: none;
}

.cover-slider-mo .slick-slide li {
	width: 100%;
    position:relative;
    padding-top: 66.66%;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}
    
.cover-slider-mo .slick-slide li a {
	width: 100%;
	height: 100%;
    position:  absolute;
    top: 0;
    left: 0;
    text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	text-decoration: none;
	color: #fff;
	vertical-align: bottom;
}
    
.cover-slider-mo .slick-slide li a p {
	width: calc(100% - 60px);
	margin: 0 auto;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.5em;
	letter-spacing: -0.04em;
}

.cover-slider-mo .slick-slide li a p + p {
	font-size: 24px;
	margin: 10px 0 0;
	font-weight: 300;
}

    
/* slider arrow */
.cover-slider-mo .slick-arrow {
	position: absolute;
	top: 50%;
	z-index: 1;
	width: 30px;
	height: 30px;
}

.cover-slider-mo .slick-arrow.slick-prev {
	left: 0px;
}

.cover-slider-mo .slick-arrow.slick-next {
	right: 0px;
}

.cover-slider-mo .slick-arrow:before {
	content: '';
	width: 30px;
	height: 30px;
	display: block;
	background-image: url(./images/sprite_web.png);
}

.cover-slider-mo .slick-prev:before {
	background-position: -160px 0px;
}

.cover-slider-mo .slick-next:before {
	background-position: -192px 0px;
}


/* slider dot */
.slider-dots-box-mo {
	position: absolute;
	bottom: 20px;
	display: block;
	width: 100%;
	list-style: none;
	text-align: center;
}

.slider-dots-mo li {
	list-style: none;
	position: relative;
	display: inline-block;
	width: 20px;
	height: 20px;
	margin: 0 3px;
	padding: 0;
	cursor: pointer;
}

.slider-dots-mo button {
	position: relative;
	display: block;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	transition: .3s all;
}

.slider-dots-mo button:after {
	content: "";
	display: block;
	width: 4px;
	height: 4px;
	background-color: rgba(255, 255, 255, 0.5);
	-moz-transform: rotate(45deg); /* FF3.5/3.6 */
	-o-transform: rotate(45deg); /* Opera 10.5 */
	-webkit-transform: rotate(45deg); /* Saf3.1+ */
	transform: rotate(45deg); /* Newer browsers (incl IE9) */
}

.slider-dots-box-mo .slick-active button svg {
	position: absolute;
}

.slider-dots-box-mo .slick-active button:after {
	background-color: rgba(255, 255, 255, 1);
}
 
    
/* ----------- Video ------------ */

.cover-video {
	padding: 40px 20px;
}

.cover-video h2 {
	margin-bottom: 20px;
	font-size: 20px;
}

.cover-video ul {
	margin-left: 0px;
}

.cover-video ul li {
	float: none;
	width: 100%;
	margin: 0 0 20px;
	box-sizing: border-box;
	overflow: hidden;
}
   

/* ---------- Contents ---------- */

.cover-list-thumb {
	padding: 40px 20px;
	background: #fff;
}

.cover-list-thumb h2 {
	margin-bottom: 20px;
	font-size: 20px;
}

.cover-list-thumb ul {
	margin-left: 0px;
}

.cover-list-thumb ul li {
	float: none;
	width: 100%;
	margin: 0 0 20px;
}

.cover-list-thumb ul li .thum {
    position: relative;
    width:100%;
	height: auto;
    padding-bottom: 95%; 
}

.cover-list-thumb ul li .thum img {
    position: absolute; 
    width: 100%; 
    height: auto;
    top: 50%; 
    left: 0; 
	  transform: translateY(-50%);
	  -webkit-transform: translateY(-50%);
	  -moz-transform: translateY(-50%);
	  -ms-transform: translateY(-50%);
	  -o-transform: translateY(-50%);
}

.cover-list-thumb ul li a:hover .thum img {
	  transform: translateY(-50%);
	  -webkit-transform: translateY(-50%);
	  -moz-transform: translateY(-50%);
	  -ms-transform: translateY(-50%);
	  -o-transform: translateY(-50%);
}

.cover-list-thumb ul li .title span {
	font-size: 16px;
}

.cover-list-thumb .btn-wrap {
	width: 100%;
	position: absolute;
	bottom: 0;
	text-align: center;
}

.cover-list-thumb .btn-wrap a {
	position: relative;
	text-decoration: none;
	padding: 10px 98px 10px 50px;
	display: inline-block;
	cursor: pointer;
	border: 1px solid #ddd;
	border-radius: 30px;
	background: #fff;
}

.cover-list-thumb .btn-wrap a span {
	display: inline-block;
	font-size: 20px;
	font-weight: 700;
	line-height: 30px;
	color: #666;
}

.cover-list-thumb .btn-wrap a:after {
	content: '';
	display: block;
	position: absolute;
	top: 10px;
	right: 40px;
	width: 30px;
	height: 30px;
	background-image: url(./images/sprite_web.png);
	background-position: 0 -97px;
}

.cover-list-thumb .btn-wrap a:hover {
	background: #000;
}

.cover-list-thumb .btn-wrap a:hover span {
	color: #fff;
}

.cover-list-thumb .btn-wrap a:hover:after {
	background-position: 0 -129px;
}


/* cover-list-thumb 01 */
.cover-list-thumb01 {
	background: #f1f5f9;
}
    
.cover-list-thumb01 h2:before {
	width: 20px;
	height: 20px;
	left: -10px;
	top: -10px;
}

.cover-list-thumb01 ul li .title {
	width: calc(100%);
	margin: 0px;
	border-radius: 0;
}

.cover-list-thumb01 ul li .title span {
	height: 3em;
	font-weight: 500;
}

.cover-list-thumb01 ul li a:hover .title {
	background-color: #fff;
}

.cover-list-thumb01 ul li a:hover .title span {
	color: #000;
}

.cover-list-thumb01 .detail_info {
	display: block;
    padding:0 20px 20px;
    background:#fff;
}

.cover-list-thumb01 .detail_info .category {
	color:#002f67;
    font-size:12px;
    margin-right:10px;
    display:inline-block;
}
    
.cover-list-thumb01 .detail_info .date {
	color:#b5b5b5;
    font-size:12px;
}
    

/* cover-list-thumb 02 */
.cover-list-thumb02 {}

.cover-list-thumb02 ul {
	padding-bottom: 52px;
}

.cover-list-thumb02 ul li {
	margin-bottom: 20px;
	display: none;
    border:1px solid #ddd;
}

.cover-list-thumb02 ul li .thum {
    padding-bottom: 56.25%;  /* 16:9 */
}
    
.cover-list-thumb02 ul li .title {
	margin: 0;
	padding: 20px;
}
    
.cover-list-thumb02 .detail_info {
	padding: 0 20px 20px;
}

.cover-list-thumb02 .detail_info .category {
	font-size: 12px;
	color: #002f67;
}

.cover-list-thumb02 .detail_info .date {
	font-size: 12px;
	color: #b5b5b5;
    display:inline-block;
}
    


/* ---------------------------------------
    List Type
--------------------------------------- */

/* ----- List Type : Gallery ---- */
.cate-style-gallery .list-cont-wrap {
	margin-left: 0px;
    padding:0 20px;
    box-sizing:border-box;
}

.cate-style-gallery .list_content {
	width: calc(100%);
	margin: 0 0 20px 0px;
	float: none;
}

.cate-style-gallery .list-thumbnail {
	width: 100%;
	height: auto;
}

.cate-style-gallery .list_content:hover .thumbnail_img {
	transform: none;
	-webkit-transform: none;
	-moz-transform: none;
	-ms-transform: none;
	-o-transform: none;;
}

.cate-style-gallery .list_info {
	width: 100%;
	padding: 20px 0px 20px;
}

.cate-style-gallery .list_info .list_title {
	margin-bottom: 10px;
	font-size: 16px;
	font-weight: 500;
    height: auto;
    max-height:3em;
}

.cate-style-gallery .list_info .list_summary {
	display: block;
    font-size: 12px;
	font-weight: 400;
    color: #333;
	word-break: break-all;
	display: block;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	max-height: 4.5em;
	line-height: 1.5em;
	letter-spacing: -0.04em;
}

.cate-style-gallery .list_info .list_category {
	display: none;
}

.cate-style-gallery .list_info .list_date {
	margin: 10px 0 0;
	font-size: 12px;
	color: #b5b5b5;
    display:inline-block;
}

#tt-body-search .cate-style-gallery .list_info .list_category02 {
	display: inline-block;
	font-size: 12px;
	color: #002f67;
    margin-right:10px;
}
    

/* ---------------------------------------
    Page
--------------------------------------- */

/* ---------- Not found --------- */

.not-found {
	padding: 50% 20px 30%;
}
    
.search-empty .not-found ul li {
	font-size: 14px;
}
    

/* ------------ Post ------------ */

/* post header */
.post-header {
	margin: 0px auto 40px;
	padding-top: 40px;
}

.post-header h1 {
	font-size: 20px;
}

.post-header h1:before {
	width: 20px;
	height: 20px;
	left: -10px;
	top: -10px;
}

#tt-body-search .post-header {
	padding-top: 100px;
	margin-bottom: 40px;
}

#tt-body-search .post-header .article-count {
	font-size: 20px;
}


/* hgroup */
.hgroup {
	margin: 0px auto 30px;
	padding: 40px 0 30px;
	border-bottom: 1px solid #f4f4f4;
}

.hgroup .category a {
	font-size: 14px;
	font-weight: 500;
	color: #002f67;
}

.hgroup h1 {
	font-weight: 700;
	font-size: 20px;
	line-height: 1.5em;
	margin: 20px 0;
}

.hgroup .post-meta {
	display: block;
	font-size: 14px;
	color: #999;
}

.hgroup .post-meta a {
	text-decoration: none;
	color: #999;
}

.hgroup .post-meta a:hover {
	text-decoration: underline;
}

.hgroup .post-meta span:before {
	content: "";
	display: inline-block;
	width: 1px;
	height: 10px;
	margin: 0 10px 0 10px;
	background-color: #ebebeb;
	vertical-align: baseline;
}

.hgroup .post-meta span.date {
	font-size: 14px;
	color: #b5b5b5;
}

.hgroup .post-meta span:first-child:before {
	content: none;
}



/* ------------ Tag ------------- */

.tags {
	color: #555;
	font-size: 0;
	border-bottom: 1px solid #ddd;
	padding-bottom: 30px;
	margin-bottom: 30px;
}

.tags h2 {
	font-size: 20px;
	margin-bottom: 10px;
	font-weight: 500;
}

.tags .items a {
	font-size: 14px;
	line-height: 25px;
	color: #555;
	margin: 0 15px 0 0;
}


/* ------ Related articles ------ */

.related-articles {
	overflow: hidden;
	width: 100%;
	margin: 40px 0px 40px;
}

.related-articles h2 {
	margin-bottom: 20px;
	font-weight: 700;
	font-size: 16px;
	color: #000;
    font-family: 'Montserrat', sans-serif;
    display: block;
}
    
.related-articles h2 strong { display:none; }

.related-articles h2 em {
	border-bottom: 1px solid #000;
	font-style: normal;
}

.related-articles ul {
	margin-left: 0px;
}

.related-articles ul li {
	float: none;
	width: 100%;
	margin: 0 0 40px;
}

.related-articles ul li:nth-of-type(4) {
	display: none;
}
    
.related-articles ul li .thum {
    margin-bottom: 10px;
}

.related-articles ul li .title {
	font-weight: 500;
}
    
    


/* ---------------------------------------
    Components
--------------------------------------- */

/* ----------- Button ----------- */

#move-top {
	right: 10px;
	bottom: 15px;
}

.btn-list {
	margin: 0 0 40px;
}

.btn-list a {
	width: 100%;
	font-size: 16px;
}


/* --------- Pagination --------- */
    
.pagination {
	max-width: 860px;
	margin: 90px auto 0;
	text-align: center;
	font-size: 0;
}

.pagination a {
	display: inline-block;
	margin: 0 5px;
	text-decoration: none;
	vertical-align: middle;
}

.pagination a span {
	display: block;
	width: 38px;
	height: 38px;
	text-align: center;
	font-size: 14px;
	line-height: 38px;
	color: #222;
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
}

.pagination .selected {
	border-radius: 5px;
	overflow: hidden;
	background: #222;
	color: #fff;
}

.pagination .prev, .pagination .next {
	width: 32px;
	height: 32px;
	background-image: url(./images/sprite_web.png);
	background-repeat: no-repeat;
	text-indent: -999em;
	vertical-align: middle;
	box-sizing: border-box;
}

.pagination .prev {
	background-position: -128px 0;
}

.pagination .next {
	background-position: -128px -32px;
}

.pagination .no-more-prev, .pagination .no-more-next {
	display: none;
}


/* ---------- Comments ---------- */

.comments .comment-list {
	font-size: 14px;
}
    
.comments .comment-list ul li ul li {
	padding: 26px 0 0 30px;
}
    
.comments .comment-list ul li ul li .author-meta {
	left: 30px;
}

.comments .comment-form input[type=text],
.comments .comment-form input[type=password] {
	width: calc(100%);
	height: 52px;
	margin-right: 0px;
    margin-bottom: 6px;
}

.comments .comment-form .field .secret {
	margin-left: 0px;
}

.comments .comment-form .submit button {
	font-size: 14px;
}  
    
}

html, body {
  overflow-x: hidden !important;
}

img {
  max-width: 100% !important;
  height: auto !important;
  box-sizing: border-box;
}

.imagegrid img {
  width: calc(50% - 5px) !important;
  margin-right: 10px !important;
  box-sizing: border-box;
}

.imagegrid img:nth-of-type(2n) {
  margin-right: 0 !important;
}