/* @import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard-dynamic-subset.css'); */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Syne:wght@700&display=swap');

@font-face {
	font-family: 'yg720';
	src: url('fonts/YoonGothic720.woff2') format('woff2'),
	url('fonts/YoonGothic720.woff') format('woff');
}
@font-face {
	font-family: 'yg730';
	src: url('fonts/YoonGothic730.woff2') format('woff2'),
	url('fonts/YoonGothic730.woff') format('woff');
}
@font-face {
	font-family: 'yg750';
	src: url('fonts/YoonGothic750.woff2') format('woff2'),
	url('fonts/YoonGothic750.woff') format('woff');
}
@font-face {
	font-family: 'ym740';
	src: url('fonts/YoonMyungjo740.woff2') format('woff2'),
	url('fonts/YoonMyungjo740.woff') format('woff');
}
@font-face {
	font-family: 'yh';
	src: url('fonts/YoonHaetsal2R.woff2') format('woff2'),
	url('fonts/YoonHaetsal2R.woff') format('woff');
}
@font-face {
	font-family: 'yg780';
	src: url('fonts/YoonGothic780.woff2') format('woff2'),
	url('fonts/YoonGothic780.woff') format('woff');
}

@font-face {
	font-family: 'yg745';
	src:  url('fonts/YoonGothicPro745.woff') format('woff');
}
@font-face {
	font-family: 'yg765';
	src:  url('fonts/YoonGothicPro765.woff') format('woff');
}
@font-face {
	font-family: 'yg785';
	src:  url('fonts/YoonGothicPro785.woff') format('woff');
}
/* Reset default browser CSS. Based on work by Eric Meyer: http://meyerweb.com/eric/tools/css/reset/index.html
-------------------------------------------------------------- */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	background: transparent;
	border: 0;
	margin: 0;
	padding: 0;
	vertical-align: baseline;
}
body {
	line-height: 1.5;
}
b, strong {
	font-weight: normal;
}
h1, h2, h3, h4, h5, h6 {
	margin: 0;
	padding: 0;
	font-weight: normal;
	line-height: 1.5;
}
ol, ul, nav, li {
	list-style: none;
}
blockquote {
	quotes: none;
}
blockquote:before, blockquote:after {
	content: '';
	content: none;
}
del {
	text-decoration: line-through;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
img {
	height: auto;
	max-width: 100%;
	width: 100%;
	display: block;
}
a img {
	border: none;
}
a {
	color: #000;
	text-decoration: none;
}
a:hover {
}
textarea, input {
	-webkit-appearance: none;
	-webkit-border-radius: 0;
}
figure {
	margin: 0;
}
button {
	outline: none;
	border: none;
}
html { font-size: 62.5%; }

/*  common
------------------------------------------------------------------------ */
::selection {
	background-color: #000;
	color: #fff;
}
body.dark *::selection {
	background-color: #fff;
	color: #000;
}
body .hidd { display: none !important; }

*:focus {outline:none !important}

.maxw { max-width: 1024px; margin-left: auto; margin-right: auto; }
.lmt { width: calc(100% - 80px); margin-left: auto; margin-right: auto; }
.exw { width: 102.5%; margin-left: -1.25%; font-size: 0;}

.col {
	margin: 1.25%;
	margin-bottom: 2.25%;
	display: inline-block;
	vertical-align: top;
	box-sizing: border-box;
}
.col2 {
	width: 47.5%;
}
.col3 {
	width: 30.833333%;
}
.col4 {
	width: 22.5%;
}
.col6 {
	width: 14.16%;
	border-top: 1px solid;
	padding-top: 20px;
}
.col .cate,
.col .title {
	vertical-align: middle;
	display: inline-block;
	font-size: 0;
}
.col .cate {
}
.col .cate span {
	font-size: calc(.5vw + .5vh + .5vmin);
	border: 1px solid #000;
	border-radius: 100px;
	padding: 3px 12px;
	margin-right: 10px;
	margin-bottom: 3px;
	display: inline-block;
}
.col .title {
	font-size: calc(.5vw + .5vh + 1vmin);
	margin-right: 10px;
	padding: 6px 0;
}
.subtit {
	font-size: calc(1vw + 1vh + 2vmin);
	line-height: 1.2;
}
.post-head .subtit {
	float: left;
}
.post-head .tag {
	clear: both;
}
.meta {
	font-size: calc(.5vw + .5vh + .5vmin);
	border: 1px solid #000;
	border-radius: 100px;
	padding: 3px 12px;
	margin-right: 10px;
	margin-top: 10px;
	display: inline-block;
}

.po { display: inline-block; }
.mo { display: none; }
.ctw { position: absolute; left: 50%; transform: translate(-50%, 0%); }
.cth { position: absolute; top: 50%; transform: translate(0%, -50%); }
.cent { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.zero { font-size: 0; letter-spacing: 0; word-spacing: 0; }
.off {
	opacity: 0;
	transition: opacity .5s cubic-bezier(0.2,  0.8, 0.4, 1);
	transform: scale(.9);
}
.on {
	opacity: 1 !important;
	transition: transform .7s, opacity 1s cubic-bezier(0.2,  0.8, 0.4, 1);
	transform: scale(1);
}
.ellipsis {
	width: 100%;
	text-overflow: ellipsis;
	-o-text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
	word-wrap: normal !important;
	display: block;
}
.ellipsismx {
	display: -webkit-box;
	display: -ms-flexbox;
	display: box;
	margin-top:1px;
	max-height:80px;
	overflow:hidden;
	vertical-align:top;
	text-overflow: ellipsis;
	word-break:break-all;
	-webkit-box-orient:vertical;
	-webkit-line-clamp:3;
}
.btn {
	border-radius: 3px;
	color: #999;
	text-align: center;
	padding: 8px 24px;
	background: #fff;
	border: 1px solid #999;
	box-sizing: border-box;
	font-size: 1.4rem;
	display: inline-block;
}
.btn:hover {
	background: #0D4221;
	border-color: #0D4221;
	color: #fff;
	transition: .5s;
}
.btn::before {
	content: "";
	left: 0%;
	top: 0;
	position: absolute;
	width: 0%;
	height: 100%;
	display: block;
}
.btn:hover::before {
	width: 100%;
	transition: .3s;
}
.under::before {
	content: "";
	width: 0%;
	height: 1px;
	background-color: #000;
	position: absolute;
	bottom: -3px;
	transition: all .25s;
}
.under:hover::before {
	width: 100%;
	background-color: #000;
	transition: all .25s;
}
/* module 
------------------------------------------------------------------------ */
/* accordion */
a.accordion {
	cursor: pointer;
	box-sizing: border-box;
	color: #000;
	padding: 14px 0;
	width: 100%;
	font-size: 1.8rem;
	transition: 0.3s;
	display: block;
	line-height: 1.5;
	position: relative;
	border-bottom: 1px solid #ccc;
}
a.accordion:hover {
	background-color: #e4f5eb;
}
.act a.act {
	background-color: #d2efdd;
}
.accordion::before {
	position: absolute;
	top: 50%;
	right: 19px;
	content: "";
	display: block;
	width: 2px;
	height: 16px;
	background-color: #0D4221;
	transition: all 300ms;
	transform: translate(0, -50%);
}
.accordion::after {
	position: absolute;
	top: 50%;
	right: 12px;
	content: "";
	display: block;
	width: 16px;
	height: 2px;
	background-color: #0D4221;
	transition: all 300ms;
	transform: translate(0, -50%);
}
.accordion.act::before {
	opacity: 0;
}
.accordion.act::after {
}
div.panel {
	padding: 20px 80px 30px 40px;
	box-sizing: border-box;
	display: none;
	font-size: 1.8rem;
	line-height: 1.5;
	color: #555;
	width: 100%;
	background-color: #f9f9f9;
}
/* tab */
.tab-ui {
	width: 100%;
	margin: 20px auto;
}
.tab-title {
	text-align: center;
}
.tab-title li {
	list-style: none;
	display: inline-block;
	width: auto;
	padding: 8px 12px;
	margin: 4px 2px;
	cursor: pointer;
	border-radius: 100px;
	text-align: center;
	border: 1px solid #0D4221;
	color: #0D4221;
	transition: .25s;
}
.tab-title li:hover {
	background-color: #e4f5eb;
	transition: .25s;
}
.tab-title li.on {
	transition: .5s;
	background-color: #0D4221;
	color: #fff;
}
.tab-cont {
	clear: both;
	height: auto;
}
.tab-cont div {
	display: none;
}
.tab-cont div.on {
	display: block;
}
/* end tab */
/* pagination */
.pagination {
	margin-top: 30px;
	padding-top: 20px;
	text-align: center;
}
.pagination .current, 
.pagination a {
	font-size: 1.4rem;
	line-height: 1;
	display: inline-block;
	margin: 0 3px;
	color: #000;
	padding: 4px;
	width: 28px;
	height: 28px;
	text-align: center;
	border-radius: 100px;
	line-height: 28px;
	border: 1px solid #000;
}
.pagination a:hover {
	background-color: #aaa;
	transition: .25s;
}
.pagination .current {
	background-color: #007FFF;
	color: #000;
}
.pagination .arr {
	background-size: auto 14px;
	background-repeat: no-repeat;
	text-indent: -9999em;
}
.pagination .pg-n {
	background-image: url(images/ico-r.svg);
	background-position: right 45% center;
}
.pagination .pg-p {
	background-image: url(images/ico-l.svg);
	background-position: left 45% center;
}
.pagination .fir {
	background-image: url(images/ico-ll.svg);
	background-position: right 47% center;
}
.pagination .lst {
	background-image: url(images/ico-rr.svg);
	background-position: right 47% center;
}
.dark .pagination .current {
	border-color: #000 !important;
}
.dark .menu li a::before {
	border-color: #fff !important;
}
/* end pagination */
/* color */
.g0 { color: #f8f9fa; }
.g1 { color: #f1f3f5; }
.g2 { color: #e9ecef; }
.g3 { color: #dee2e6; }
.g4 { color: #ced4da; }
.g5 { color: #adb5bd; }
.g6 { color: #868e96; }
.g7 { color: #495057; }
.g8 { color: #343a40; }
.g9 { color: #212529; }
.pc { color: #0D4221; }

.bpc1 { background: #fafafb; }
.bpc2 { background: #0d4221; }

/* text */
.tac { text-align: center; }
.tal { text-align: left; }
.tar { text-align: right; }
.tuc { text-transform: uppercase !important; }
.tcp { text-transform: capitalize !important; }

.t1 { font-size: 4.8rem; }
.t2 { font-size: 3.6rem; }
.t3 { font-size: 3rem; }
.t4 { font-size: 2.6rem; }
.t5 { font-size: 2.2rem; }
.t6 { font-size: 2rem; }
.t7 { font-size: 1.8rem; }
.t8 { font-size: 1.6rem; }
.t9 { font-size: 1.4rem; }
.t10 { font-size: 1.2rem; }

.lh2 { line-height: 1.2; }
.lh4 { line-height: 1.4; }
.lh5 { line-height: 1.5; }
.lh6 { line-height: 1.6; }
.lh7 { line-height: 1.8; }

.mbs { margin-bottom: 8px; }
.mbm { margin-bottom: 16px; }
.mbl { margin-bottom: 28px; }
.mbxl { margin-bottom: 40px; }
.mbxl2 { margin-bottom: 80px; }
.nmb { margin-bottom: 0 !important; }

.mts { margin-top: 8px; }
.mtm { margin-top: 16px; }
.mtl { margin-top: 28px; }
.mtxl { margin-top: 40px; }
.mtxl2 { margin-top: 80px; }
.nmt { margin-top: 0 !important; }

.pts { padding-top: 8px; }
.ptm { padding-top: 16px; }
.ptl { padding-top: 28px; }
.ptxl { padding-top: 40px; }
.ptxl2 { padding-top: 80px; }

.nmt { margin-top: 0 !important; }
.npb { padding-bottom: 0 !important; }
.npt { padding-top: 0 !important; }
.nbd { border: none !important; }

.arrr {
	position: relative;
	padding-right: 36px;
}
.arrr::after {
	content: "";
	display: inline-block;
	vertical-align: text-bottom;
	background-image: url("images/ico-arr-r.svg");
	background-size: 18px;
	background-repeat: no-repeat;
	background-position: center;
	position: absolute;
	margin-left: 8px;
	width: 26px;
	height: 26px;
	border-radius: 100px;
	border: 1px solid #000;
	box-sizing: border-box;
	transition: .25s;
	top: 50%;
	transform: translate(0, -50%);
}
.dark .arrr::after {
	border-color: #fff;
	background-image: url("images/ico-arr-rw.svg");
}
.arrr:hover::after {
	background-color: #FFF500;
}
.arrrt::after {
	transform: translate(0, -50%) rotate(-45deg);
}
.arrrb::after {
	transform: translate(0, -50%) rotate(180deg);
}
.arrrnb::after {
	border: none;
	background-size: 100%;
}
.arrrnb:hover::after {
	background-color: transparent;
}
.more:hover::after {
	background-color: transparent;
}
.more {
	width: 88px;
	border-radius: 100px;
	height: 44px;
	line-height: 44px;
	font-size: calc(.5vw + .5vh + 1vmin);
	color: #000;
	position: absolute;
	background: #f00;
	opacity: 0;
	top: 51%;
	left: 50%;
	z-index: 1;
}
.dark .more::after {
	border-color: #000 !important;
	background-image: url("images/ico-arr-r.svg") !important;
}
.more2 {
	opacity: 1;
	font-size: calc(.8vw + .8vh + 1.2vmin);
	line-height: 1;
	position: relative;
	background-color: transparent;
	height: auto;
	width: auto;
	border: 1px solid #000;
	right: 0;
	left: auto;
	top: 0;
}
#typogallery-list .wp-block-gallery a:hover .more, 
a:hover .more {
	top: 50%;
	opacity: 1;
	transition: .5s;
}
ul.exw li a {
	display: block;
	position: relative;
	transition: .5s;
}
#typogallery-list .wp-block-gallery a:hover img, 
ul.exw li a:hover img {
	filter: brightness(0.5);
	transition: .7s;
}
img.rd {
	border-radius: 1000px;
}
.listst li {
	margin-left: 14px;
}
.listst li::before {
	content: "";
	width: 5px;
	height: 5px;
	border-radius: 5px;
	margin-left: -13px;
	margin-right: 9px;
	margin-top: 9px;
	background: #000;
	vertical-align: top;
	display: inline-block;
}
.dark .listst li::before {
	background-color: #fff;
}
ul.txt-list li a {
	display: flex;
	justify-content: space-between;
	border-top: 1px solid #000;
	padding: 1.7vh 0;
	width: 100%;
	overflow: hidden;
	position: relative;
}
ul.txt-list li a:hover {
	background-color: #007FFF;
}
ul.txt-list li a h3 {
	font-size: 2.2rem;
}
ul.txt-list li a h3.ellipsis {
	padding-right: 20px;
	width: 50%;
}
ul.txt-list li a h3:nth-child(1) {
	flex-shrink: 0;
	width: 25.5%;
}
ul.txt-list li a h3:nth-child(2) {
	flex-grow: 1;
}
ul.txt-list img {
	width: 10%;
	position: absolute;
	left: 20%;
}

#empty {
	z-index: -2;
	content: "";
	width: 100%;
	height: 100vh;
	opacity: 0;
	position: fixed;
	background-color: rgba(0,0,0,0.4);
	top: 0;
}
body.call #empty {
	opacity: 1;
	width: 100%;
	z-index: 999;
	transition: opacity .5s ease;
}
/* layout
------------------------------------------------------------------------ */
body {
	position: relative;
	width: 100%;
    box-sizing: border-box;
	word-break: keep-all;
	line-height: 1.6;
	font-size: 2rem;
	text-rendering: optimizeLegibility;
	background-color: #d6d6d6;
	color: #000;
	font-family: 'Inter', 'yg745', Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif;

}
.twb {
	color: #Fff;
	font-family: 'yg785', Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif;
}
/* header 
------------------------------------------------------------------------ */
.actheader #header .inner {
}
#header {
	width: 100%;
	position: fixed;
	top: 0;
	height: 72px;
	z-index: 99;
	background-color: transparent;
}
.hi.page-template-home #header {
	opacity: 0;
}
.hi.page-template-home #header {
	opacity: 1;
	transition: 1s;
}
#header .inner {
	position: relative;
	height: 100%;
	margin-left: auto;
	margin-right: auto;
	padding: 0;
	box-sizing: border-box;
	border-color: transparent;
}
#header.act {
	background-color: rgba(214, 214, 214, 1);
}
#header.act .inner {
/*	border-bottom: 1px solid rgba(0, 0, 0, 0); */
}
#logo {
	position: absolute;
	top: 50%;
	line-height: 1;
	left: 0;
	width: auto;
	display: block;
	z-index: 9;
}
#logo img {
	height: 60px;
}
#nav {
	width: 100%;
}
.menu li a {
	text-transform: capitalize;
	position: relative;
	padding-left: 24px;
}
.menu li.current-menu-item a::before {
	background-color: #f00;
}
.menu li a::before {
	content: "";
	display: inline-block;
	vertical-align: text-bottom;
	position: absolute;
	margin-right: 8px;
	width: 16px;
	height: 16px;
	border-radius: 100px;
	border: 1px solid #000;
	transition: .25s;
	top: 50%;
	left: 0;
	transform: translate(0, -50%);
}
#menu-gnb li a::before {
	display: none;
}
#menu-gnb {
	text-align: center;
	line-height: 1;
}
#menu-gnb li {
	margin: 0 12px;
	position: relative;
	display: inline-block;
	line-height: 1;
}
#menu-gnb li a {
	position: relative;
	display: block;
	padding: 0 8px;
	box-sizing: border-box;
	line-height: 1;
}
#menu-gnb li a:hover {
	color: #565656;
	transition: .3s;
}
.page-template-home #menu-gnb li a, 
.page-template-home #lnb a {
	color: #fff;
}
.page-template-home .act #menu-gnb li a, 
.page-template-home .act #lnb a {
	color: #000;
}
.dark .act #menu-gnb li a, 
.dark .act #lnb a {
	color: #fff;
}
#lnb {
	position: absolute;
	top: 50%;
	right: 0;
	line-height: 1;
}
#lnb a {
	margin-left: 24px;
	position: relative;
	display: inline-block;
	position: relative;
	display: inline-block;
	padding: 0;
	line-height: 1;
	box-sizing: border-box;
}
#fab {
	border-radius: 100px;
	background: #000;
	position: fixed;
	right: 32px;
	bottom: 32px;
	width: 68px;
	height: 68px;
	z-index: 97;
	transition: .25s ease-out;
	box-shadow: rgba(0, 0, 0, 0.1) -4px 9px 25px -6px;
}
#fab.open {
	background-color: #fff;
	transition: .5s ease-out;
}
#card {
	width: 100%;
	height: 100%;
	display: block;
}
#fab img {
	width: 40%;
	position: absolute;
	top: 50%;
	left: 50%;
	filter: invert(1);
}
#fab.open img {
	filter: invert(0);
	transition: .25s ease-out;
}
/* footer 
------------------------------------------------------------------------ */
footer {
	background: #000;
	position: relative;
}
footer .inner {
	position: relative;
	padding: 40px 0;
	box-sizing: border-box;
	overflow: hidden;
	color: #999;
	z-index: 0;
}
footer ul li, 
footer p, 
footer ul li a {
	color: #999;
	font-size: calc(.5vw + .5vh + .5vmin);
}
footer ul li a:hover {
	color: #fff;
}
#ft-menu li {
	float: left;
	width: 50%;
}
footer img.col {
	width: 15%;
	margin-right: 7.5%
}
footer #sns {
	text-align: right;
}
footer #sns a {
	float: right;
	margin-left: 10px;
	border-radius: 100px;
	box-sizing: border-box;
	border: 1px solid #fff;
}
footer #sns a:hover {
	border-color: transparent;
	background: #FFF500;
}
footer #sns a:hover img {
	filter: invert(1);
}
footer #sns a img {
	width: 36px;
	height: 36px;
}
#family {
	transition: .5s;
}
#family a {
	border-radius: 10000px;
	border: 1px solid #fff;
	position: relative;
	transition: .5s;
	cursor: pointer;
	background-size: 60% auto;
	background-repeat: no-repeat;
	background-position: center;
}
#family a.sqr {
	border-radius: 0;
}
#family a.ske {
	border: none;
}
#family a.ske i {
	transform: skew(10deg);
	border: 1px solid #fff;
	background: #000;
	left: 0;
	width: 100%;
	content: "";
	position: absolute;
	display: block;
	height: 100%;
	z-index: -1;
}
#family.on a {
	width: 12.5%;
	transition: .5s;
}
#family a.act {
	width: 50%;
	transition: .5s;
}
#family a:hover, 
#family a:hover i {
	border: none;
}
#family a:nth-child(1):hover {
	background-color: #007FFF;
	background-image: url("images/lt-tsw.svg") !important;
}
#family a:nth-child(2):hover {
	background-color: #007FFF;
	background-image: url("images/lt-yoonmw.svg") !important;
}
#family a:nth-child(3):hover i {
	background-color: #FF0000;
}
#family a:nth-child(3):hover {
	background-image: url("images/lt-ddungw.svg") !important;
}
#family a:nth-child(4) {
	background-color: #fff;
}
#family a:nth-child(4):hover {
	background-color: #FFF500;
}

#copy a, 
#copy span {
	color: #999;
	font-size: calc(.5vw + .5vh + .5vmin);
	margin-right: 16px;
}
#copy a {
	color: #ccc;
	border-bottom: 1px solid;
}

/* content 
------------------------------------------------------------------------ */
.cont {
	min-height: 50vh;
	box-sizing: border-box;
	margin-top: 72px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 100px;
}
.cont-head {
	margin-bottom: 60px;
}
.cont-title {
	text-align: center;
	padding: 60px 0;
}
.cont-head a.arrrmove {
	float: right;
	height: 9vmax;
	width: 9vmax;
	display: block;
	line-height: 1;
	padding: 0;
}
.cont-head a.arrrmove:first-child {
	float: left;
}
.cont-head a.arrrmove:first-child::after {
	background-image: url("images/ico-arr-l.svg");
}
.cont-head a.arrrmove::after {
	width: 100%;
	height: 100%;
	background-size: 6vmax;
	background-image: url("images/ico-arr-r.svg");
	border-radius: 1000px;
	margin-left: 0;
	transform: translate(0);
	position: static;
}
.dark .cont-head a.arrrmove:first-child::after {
	background-image: url("images/ico-arr-lw.svg");
}
.dark .cont-head a.arrrmove::after {
	background-image: url("images/ico-arr-rw.svg");
}
.cont-head h1.title {
	text-align: center;
	vertical-align: middle;
	font-size: 9vmax;
	display: inline-block;
	margin: 0 auto;
	line-height: 1;
}
.cont-body #cont-head-filter div.col,
.cont-head .exw div.col {
	padding-top: 12px;
	border-top: 1px solid #000;
	font-size: 2.2rem;
	position: relative;
}
.cont-body #cont-head-filter div.colcenter,
.cont-head .exw div.colcenter {
	margin-left: 0;
	margin-right: 0;
	padding-left: 1.25%;
	box-sizing: border-box;
	width: 25%;
}
.cont-head #cont-head-info.exw div.colcenter {
	width: 23.75%;
	padding-left: 0;
	margin-left: 1.25%;
}
.cont-body #cont-head-filter div.last,
.cont-head .exw div.last {
	margin-left: 0;
	width: 48.75%;
	padding-left: 1.25%;
}
#cont-head-filter .col:first-child {
	margin-right: 0;
	width: 23.75%;
}
.cont-head .menu li {
	margin-right: 20px;
	display: inline-block;
	margin-bottom: 4px;
}
.cont-body {
	overflow: hidden;
}
/* intro 
------------------------------------------------------------------------ */
.page-template-intro header, 
.page-template-intro #fab, 
.page-template-intro #hamberger, 
.page-template-intro footer {
	display: none;
}	
#intro {
	background-color: #000;
	width: 100%;
	height: 100vh;
	position: fixed;
}
#intro a img {
	width: auto;
	height: 102vh;
	position: absolute;
	z-index: 999;
	max-width: 9999%;
}
#intro a video {
	width: auto;
	height: 100vh;
	position: absolute;
	z-index: 998;
}
/*
#intro a.act video {
	height: 100vh;
	transform: translate(-50%, -50%);
	transition: 10s cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
*/
#intro a.act img {
	transform: translate(-50%, -400%) scale(40);
	transition: 5s cubic-bezier(0.950, 0.050, 0.730, -0.015);
}
#intro a.bye img {
	opacity: 0;
	transition: .8s !important;
}
#intro a.bye video {
	opacity: 0;
	transition: .3s !important;
}
/* home 
------------------------------------------------------------------------ */
.page-template-home {
	background-color: #000;
}
body.hi {
	background-color: #d6d6d6;
	transition: .15s;
}
.page-template-home .cont {
	margin-top: 0;
	margin-bottom: 0;
}
.single #header {
	background-color: #d6d6d6;
}
.white.single #header {
	background-color: #fff;
}
.dark.single #header {
	background-color: #111;
}
.dark.open #header #logo {
	color: #fff;
}
.page-template-home #header #logo {
	color: #fff;
}
.page-template-home #header.act #logo {
	color: #000;
}
.dark.page-template-home #header.act #logo {
	color: #fff;
}
.page-template-home #hamberger span {
	background-color: #fff;
	opacity: 0;
}
.hi #hamberger span {
	opacity: 1;
	transition: .9s;
}
.dark .page-template-home #hamberger span {
	background-color: #000;
}
.page-template-home #hamberger.act span {
	background-color: #000;
}
.dark.page-template-home #hamberger.act span {
	background-color: #fff;
}
.grey.open #nav {
	background-color: #d6d6d6;
}
.open #hamberger span {
	background-color: #000;
}
.open #header #logo {
	color: #000;
}
#home-visual {
	width: 100%;
	height: 100vh;
	position: relative;
	z-index: 98;
}
#home-visual div {
	width: 100%;
	height: 100%;
	position: relative;
	background-color: #aaa;
}
#home-visual div h2 {
	position: absolute;
	top: 50%;
	left: 50%;
	color: #fff;
	z-index: 2;
	font-size: calc(4vw + 4vh + 3vmin);
}
#home-visual .item::after {
	content: "";
	width: calc(100% - 80px);
	height: calc(100% - 140px);
	background-color: transparent;
	border: .3vmin solid transparent;
	box-sizing: border-box;
	position: absolute;
	z-index: 2;
	top: 100px;
	left: 40px;
}
#home-visual .item::before {
	content: "";
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,.3);
	position: absolute;
	z-index: 1;
	top: 0;
	left: 0;
}
#home-visual #main-visual-1::after, 
#home-visual #main-visual-2::after {
	border-color: transparent;
}
#home-visual .item::after {
	opacity: 0;
}
.hi #home-visual .item::after {
	opacity: 1;
	transition: 1s;
}
#home-visual #main-visual-1.slick-current::after {
	transition: 2s;
	border-color: #fff;
}
#home-visual #main-visual-2.slick-current::after {
	transition: 2s;
	border-radius: 1200px;
	border-color: #fff;
}
#home-visual #main-visual-3::after {
}
#home-visual #main-visual-3.slick-current::after {
	width: 81%;
	border-color: #fff;
	left: 9.5%;
	border-radius: 0;
	transform: skewX(13deg);
	transition: 1s;
}
#home-visual div img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
#home-about {
	position: fixed;
	top: 90px;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: calc(100vh - 90px);
	z-index: 0;
}
#home-about div {
	width: 100%;
	position: absolute;
	top: 50%;
	left: 50%;
	box-sizing: border-box;
	padding: 36px;
}
#home-about p {
	font-size: calc(2vw + 3vh + 1.5vmin);
	line-height: 1.25;
}
#home-about p.last {
	text-indent: 15rem;
}
#home-goto {
	top: 0;
	left: 8%; 
	right: 0;
	width: 90%;
	bottom: 0;
	margin-top: 110vh;
	position: relative;
	z-index: 1;
}
#home-goto a {
	font-size: calc(2vw + 3vh + 2vmin);
	text-align: center;
	position: relative;
}
#home-goto.on a {
	width: 25%;
	transition: .35s;
	font-size: calc(1vw + 2vh + 1vmin);
}
#home-goto a.act {
	width: 70%;
	transition: .35s;
	font-size: calc(2vw + 3vh + 2vmin);
}
#home-goto #goto-ex {
	left: 0;
	color: #fff;
	transition: .35s;
}
#home-goto #goto-ex i {
	transform: skew(10deg);
	background: #000;
	left: 0;
	width: 100%;
	content: "";
	position: absolute;
	display: block;
	height: 100%;
	z-index: -1;
	transition: .35s;
}
#home-goto #goto-tb {
	right: 0;
	border-radius: 10000px;
	background: #fff;
	color: #000;
	transition: .35s;
}
#home-project {
	margin-top: 30vh;
	background: #d6d6d6;
	z-index: 1;
	position: relative;
}
#home-project .subtit {
	border-top: 1px solid #000;
	padding-top: 40px;
	margin-bottom: 25px;
}
/*
#home-project ul li:nth-child(3), 
#home-project ul li:nth-child(4), 
#home-project ul li:nth-child(8) {
	width: 47.5%;
}
*/
#home-news {
	padding-top: 10vh;
	padding-bottom: 10vh;
	background: #d6d6d6;
	z-index: 1;
	position: relative;
}
#home-news .inner {
	position: relative;
}
#home-news .more2 {
	position: absolute;
	right: 0;
	top: 40px;
	padding: 10px 20px;
	padding-right: 56px;
}
#home-news .more2:hover {
	background-color: #007FFF;
	color: #000;
	cursor: pointer;
}
#home-news .subtit {
	border-top: 1px solid #000;
	padding-top: 40px;
	margin-bottom: 25px;
}
/* about 
------------------------------------------------------------------------ */
#about .cont-body {
	border-top: 1px solid #000;
}
#introduction {
	padding-top: 12px;
}
#introduction p {
	font-size: 4.2rem;
	line-height: 1.55;
}
#introduction p.last {
	text-indent: 15rem;
}
#introduction ul li {
	position: relative;
}
#introduction ul li i {
	top: 0;
	position: absolute;
	width: 19%;
	height: 100%;
	display: block;
	background-color: #d6d6d6;
	transform: skewX(0deg) scale(1);
	transform-origin: bottom left;
}
.white #introduction ul li i {
	background-color: #fff;
}
.dark #introduction ul li i {
	background-color: #111;
}
#introduction ul li i.last {
	left: 100%;
}
#introduction ul li.slick-active i {
	transform: skewX(18deg) scale(1);
	transition: .8s;
}
#introduction img.rd {
	border-radius: 0;
}
#introduction li.slick-current img.rd {
	border-radius: 1000px;
	transition: 2.6s;
}
#about .sec {
	border-top: 1px solid #000;
	margin-top: 15vh;
}
#about .sec a, 
#about .sec p {
	font-size: 2rem;
}
#about .sec h1.title {
	width: 100%;
	text-align: center;
	vertical-align: middle;
	font-size: 9vmax;
	font-size: calc(3vw + 3vh + 3vmin);
	margin: 0 auto;
	padding: 7vh 0;
	line-height: 1;
}
#about-brand div.exw {
	border-top: 1px solid #000;
}
#about-brand div.exw .col {
	padding-bottom: 20px;
}
#about-culture .col {
	margin-bottom: 1.25%;
}
#about-culture .col .slide {
	margin-bottom: 10px;
}
#about-culture .slick-prev,
#about-culture .slick-next {
	display: none !important;
}
#about-organization h4 {
	font-size: 2rem;
}
#about-organization ol {
	font-size: 1.6rem;
	width: 55%;
	float: left;
}
#about-organization .col {
	position: relative;
	border-top: 1px solid #000;
	padding-top: 16px;
}
#about-organization .col:first-child {
	padding-top: 0;
	border-top: none;
}
#about-organization .col:first-child img {
	border-radius: 1000px;
}
#about-organization .col img.rd {
	width: 36%;
	position: absolute;
	top: 16px;
	right: 0;
	background-color: #ccc;
}
/* category 
------------------------------------------------------------------------ */
#news-list .cont-body ul.txt-list {
}

/* font */
/*
#font-list .cont-body ul li:nth-child(3), 
#font-list .cont-body ul li:nth-child(4), 
#font-list .cont-body ul li:nth-child(8), 
#font-list .cont-body ul li:nth-child(10), 
#font-list .cont-body ul li:nth-child(15) {
	width: 47.5%;
}
*/
/* typobranding */
#typobranding-list .cont-body ul li:nth-child(3n) {
	width: 100%;
}
/* single 
------------------------------------------------------------------------ */
.category-news #header {
	filter: invert(0);
}
#single-news .cont-head {
	width: 70%;
	margin-bottom: 0;
}
#single-news .cont-head .cont-title {
	padding: 50px 0 30px;
}
#single-news .cont-head h1 {
	font-size: 3.4rem;
	line-height: 1.3;
}
#single-news .cont-body .post-body {
	border-top: 1px solid #000;
	font-size: 2rem;
	width: 70%;
	margin: 1.25%;
	margin-bottom: 2.25%;
	display: inline-block;
	vertical-align: top;
	box-sizing: border-box;
}
#single-news .cont-body .post-related {
	border-top: 1px solid #000;
	padding-top: 24px;
	font-size: 2rem;
	width: 25%;
	margin: 1.25%;
	margin-bottom: 2.25%;
	vertical-align: top;
	box-sizing: border-box;
}
#single-news .cont-body .post-body p {
	margin: 24px 0;
}
#single-news .cont-body .post-body .wp-block-image {
	margin: 30px 0;
}
#single-news .cont-body .post-body .wp-block-image figcaption {
	font-size: 1.5rem;
	text-align: center;
}
#single-news #postlink {
	border-top: 1px solid #000;
}
#single-news #postlink li {
	border-bottom: 1px solid #000;
	padding: 1.7vh 0;
	width: 100%;
}
#single-news #postlink li span {
	display: inline-block;
	width: 180px;
}

#single {
	margin-top: 0;
}
#single .cont-head {
	height: 60vh;
	width: 100%;
	background-size: cover;
	background-position: center;
	position: relative;
}
#single .cont-head::after {
	content: "";
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,.3);
	position: absolute;
	top: 0;
	left: 0;
}
#single .cont-body h2 {
	border-top: 1px solid;
	margin-top: 80px;
	margin-bottom: 30px;
	padding-top: 12px;
	font-size: 2.2rem;
}
.post-body .gall .blocks-gallery-item {
	margin-bottom: 0 !important;
}
.post-body figure.mtxl {
	margin-top: 64px !important;
}
.post-body .gall .slick-prev,
.post-body .gall .slick-next {
	display: block !important;
}
#single .cont-body .wp-block-image figcaption {
	font-size: 1.8rem;
}
.post-body .blocks-gallery-grid .blocks-gallery-image,
.post-body .blocks-gallery-grid .blocks-gallery-item,
.post-body .wp-block-gallery .blocks-gallery-image,
.post-body .wp-block-gallery .blocks-gallery-item {
	margin-bottom: 4rem;
}
.post-head div {
	display: inline-block;
	width: 50%;
	vertical-align: top;
	padding-right: 2.5%;
	box-sizing: border-box;
}
.post-head a.arrr {
	float: right;
}
.post-info {
	width: 100%;
	overflow: auto;
}
.post-info .fir {
	width: calc(50% - 32px);
	border-top: 1px solid #000;
	padding-top: 12px;
	float: left;
}
.post-info ul {
	width: 50%;
	float: right;
}
.post-info ul li {
	margin-top: 0;
	border-top: 1px solid #000;
	padding-top: 12px;
}
.post-body {
	width: 100%;
	clear: both;
}
.ing {
	background: #0ff;
}
.ing p {
	font-size: 100px;
}
/* inq 
------------------------------------------------------------------------ */
#inq {
	background-color: #000;
	width: 50%;
	height: 100%;
	position: fixed;
	top: 0;
	z-index: 1000;
	color: #fff;
	padding: 24px 40px;
	box-sizing: border-box;
	left: 100%;
	transition: .3s;
	overflow-y: scroll;
}
.call #inq {
	left: 50%;
	transition: .5s;
}
#inq .close {
	font-size: 1.8rem;
	color: #fff;
	position: absolute;
	top: 24px;
	right: 40px;
}
#inq span.wpcf7-list-item {
	margin: 0;
	margin-right: 20px;
}
.wpcf7-form div {
	display: block;
	margin-bottom: 30px;
}
.wpcf7-form label {
	font-size: 1.4rem;
	color: #fff;
	display: block;
	margin-bottom: 4px;
}
.wpcf7-form input {
	width: 100%;
	border: 0;
	background-color: #000;
	appearance: none;
	border-radius: 0;
	font-size: 1.8rem;
	height: 40px;
	box-sizing: border-box;
	color: #fff;
	border-bottom: 1px solid #444;
	font-family: 'Inter', 'yg745', Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif;
}
.wpcf7-form input::selection {
	background-color: #fff;
	color: #000;
}
.wpcf7-form input[type="checkbox"], 
.wpcf7-form input[type="radio"] {
	width: 16px;
	height: 16px;
	vertical-align: middle;
	border: none;
	background-color: #777;
	margin: 0;
	margin-right: 4px;
	display: inline-block;
}
.wpcf7-form .wpcf7-list-item label {
	font-size: 1.8rem;
}
input[type="checkbox"]:checked,
input[type="radio"]:checked {
	background-color: #f00;
	border-radius: 100px;
	transition: .5s;
}
.wpcf7-form input:focus,
.wpcf7-form textarea:focus {
	outline: none;
	border-color: #fff;
}
.wpcf7-form textarea {
	padding: 12px;
	font-size: 1.8rem;
	width: 100%;
	max-height: 200px;
	appearance: none;
	background-color: #000;
	color: #fff;
	border: 1px solid #999;
	line-height: 1.5;
	border-radius: 0;
	box-sizing: border-box;
	font-family: 'Inter', 'yg745', Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif;
}
.wpcf7-form .wpcf7-submit {
	appearance: none;
	position: absolute;
	padding: 10px 20px;
	background-image: url("images/ico-arr-rw.svg");
	background-size: 40px;
	padding-right: 40px;
	background-repeat: no-repeat;
	background-position: right 20px center;
	padding-right: 100px;
	opacity: 1;
	font-size: calc(.8vw + .8vh + 1.2vmin);
	line-height: 1;
	position: relative;
	background-color: transparent;
	border-radius: 100px;
	height: auto;
	width: auto;
	border: 1px solid #fff;
	font-family: 'Inter', 'yg745', Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif;
}
.wpcf7-form .wpcf7-submit:hover {
	background-color: #f00;
	color: #000;
	border-color: transparent;
	cursor: pointer;
	background-image: url("images/ico-arr-r.svg");
}
.wpcf7-form .wpcf7-submit:focus {
	outline: none;
}
.wpcf7 form .wpcf7-response-output {
	border: none !important;
	color: #000 !important;
	font-size: 16px !important;
	background-color: #FFF500 !important;
}
div.wpcf7-validation-errors,
div.wpcf7-mail-sent-ok {
	border: 0 !important;
	padding: 0 !important;
	text-align: center;
	margin: 0 !important;
	padding: 2em 0 !important;
	background: #e9ecef;
	margin-top: 40px !important;
}
div.wpcf7 img.ajax-loader {
	display: none !important;
}
.wpcf7-form-control-wrap {
	position: relative !important;
}
.wpcf7-not-valid-tip {
	position: absolute !important;
	top: 0 !important;
	font-size: 1.4rem !important;
	color: #f00 !important;
	right: 0 !important;
}
#privacy {
	width: 100%;
	height: 152px;
	padding: 16px;
	box-sizing: border-box;
	border: 1px solid #ddd;
	overflow: hidden;
	overflow-y: scroll;
	margin-top: 16px;
}
#privacy p {
	font-size: 1.3rem;
	margin-bottom: 8px;
}


/* typogallery 
------------------------------------------------------------------------ */
#typogallery-list .cont-body #cont-head-filter div.colcenter::before {
	display: block;
}
#typogallery-list .cont-body #cont-head-filter .col {
	margin-bottom: 1% !important;
}
#typogallery-list .cont-head {
	margin-bottom: 0;
}
#typogallery-list .wp-block-gallery {
	display: block;
	margin-left: -1.25%;
}
#typogallery-list .wp-block-gallery a { 
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
}
.category-typogallery .wp-block-gallery { 
	margin-left: -1.25%;
}
.category-typogallery .slick-prev,
.category-typogallery .slick-next {
	background-color: transparent;
	border: 1px solid #fff;
}
.category-typogallery .slick-lightbox-close {
	top: 32px;
	right: 40px;
	width: auto;
	height: auto;
}
.slick-lightbox .slick-next {
	right: 40px;
}
.slick-lightbox .slick-prev {
	left: 40px;
}
.category-typogallery .slick-lightbox-close:before {
	content: "닫기";
	font-size: 1.8rem;
	color: #fff;
	opacity: 1;
}
.category-typogallery .slick-lightbox-slick-caption {
	margin-top: 10px;
	display: block;
}
#typogallery-list #ajax-load-more .alm-btn-wrap button.alm-load-more-btn {
	font-size: 2rem;
	font-weight: normal;
	background-color: transparent;
	color: #000;
	opacity: 1 !important;
	left: auto;
	position: static;
	border: none;
}
/* search 
------------------------------------------------------------------------ */
#search-cont h1.title {
	font-size: calc(2vw + 2vh + 1vmin);
}
#search-cont h1.title span {
	background: #FFF500;
}
.dark #search-cont h1.title span {
	color: #000;
}
#search-cont h1.title span:last-child {
	background: #007FFF;
}
#search-cont .cont-body li {
	font-size: calc(.5vw + .5vh + .25vmin);
}
#searching {
	position: fixed;
	background: #000;
	top: 0;
	left: 0;
	width: 50%;
	height: 50vh;
	opacity: 0;
	visibility: hidden;
	z-index: -3;
	transition: .25s;
	padding: 24px 40px;
	box-sizing: border-box;
	color: #fff;
}
#searching.act {
	opacity: 1;
	width: 100%;
	z-index: 99999;
	transition: .25s;
	visibility: visible;
}
#searching .search-wrap {
	position: absolute;
	top: 50%;
	left: 40px;
	width: calc(100% - 80px);
}
#searchform input[type=search]::-webkit-search-cancel-button{
	display: none;
}
#searchform {
	font-size: 0;
	letter-spacing: 0;
	word-spacing: 0;
	margin: 12px 0;
	text-align: center;
	color: #fff;
}
#searchform input {
	display: inline-block;
	color: #fff;
}
#searchform input::placeholder {
	color: rgba(255, 255, 255, 0.5);
	opacity: 1;
}
#searchform input[type=search] {
	border: none;
	border-bottom: 1px solid #fff;
	width: calc(100% - 56px);
	height: 80px;
	padding: 24px 0;
	background-color: transparent;
	color: #fff;
	margin: 0;
	box-sizing: border-box;
	font-size: 36px;
	vertical-align: top;
}
#searchform input[type=search]::selection {
	background-color: #fff;
	color: #000;
}
#searchform input#searchsubmit {
	width: 56px;
	height: 80px;
	vertical-align: top;
	background-color: transparent;
	box-sizing: border-box;
	text-indent: -9999em;
	border: none;
	border-bottom: 1px solid #fff;
	background-image: url("images/ico-search-w.svg");
	background-size: 32px;
	background-repeat: no-repeat;
	background-position: center;
	cursor: pointer;
}
.screen-reader-text {
	display: none;
}
#searching a.close {
	top: 24px;
	right: 40px;
	position: absolute;
	font-size: 1.8rem;
	color: #fff;
}
#searching #rec {
	bottom: 24px;
	left: 40px;
	position: absolute;
}
#searching #rec .item {
	width: 50%;
	display: inline-block;
	vertical-align: top;
}
#searching #rec div ul li {
	margin-right: 10px;
	margin-bottom: 5px;
	display: inline-block;
}
#searching #rec div ul li a {
	font-size: 1.8rem;
	padding-left: 0;
	border: 1px solid #fff;
	color: #fff;
	border-radius: 100px;
	padding: 2px 10px;
}
#searching #rec div ul#menu-taglist li a {
	border: none;
	padding: 0;
}
#searching #rec div ul#menu-taglist li:nth-child(3n+1) a:hover {
	color: #f00;
}
#searching #rec div ul#menu-taglist li:nth-child(3n+2) a:hover {
	color: #fff500;
}
#searching #rec div ul#menu-taglist li:nth-child(3n+3) a:hover {
	color: #007FFF;
}
#searching #rec div ul#menu-taglist li a:hover {
	color: #fff500;
	background-color: transparent;
}
#searching #rec div li a:hover {
	color: #000;
	background-color: #fff;
}
#searching #rec div li a::before {
	display: none;
}
#searching a.btn-close:hover {
	background-color: rgba(255, 255, 255, 0.2);
	transition: .25s;
}

.category-exclusive .post-body .slick-prev,
.category-exclusive .post-body .slick-next {
	background-color: #007FFF;
}
.category-font .post-body .slick-prev,
.category-font .post-body .slick-next {
	background-color: #fff500;
}
.category-typobranding .post-body .slick-prev,
.category-typobranding .post-body .slick-next {
	background-color: #f00;
}
.category-font .post-body .wp-block-columns, 
.category-typobranding .post-body .wp-block-columns, 
.category-exclusive .post-body .wp-block-columns, 
.category-font .post-body .wp-block-image, 
.category-typobranding .post-body .wp-block-image, 
.category-exclusive .post-body .wp-block-image {
	margin: 0;
}
#single .cont-body .gall {
	margin-top: 80px;
}
.dark #single .cont-body .invert img {
	filter: invert(1);
}
#gotolist {
	border-top: 1px solid #000;
}

#document {
	margin-top: 150px;
}
#document .cont-head {
	border-bottom: 1px solid #000;
	margin-bottom: 30px;
	padding-bottom: 20px;
	font-size: 2.8rem;
	text-align: center;
}
#document .cont-body p {
	margin-bottom: 30px;
	font-size: 1.7rem;
	line-height: 1.7;
}
#document .cont-body ol, 
#document .cont-body ul {
	margin-bottom: 30px;
}
#document .cont-body ol li, 
#document .cont-body ul li {
	font-size: 1.6rem;
	line-height: 1.7;
}
#document .cont-body h3 {
	font-size: 2.2rem;
	margin-bottom: 5px;
	border-bottom: 1px solid #aaa;
	padding-bottom: 5px;
	margin-top: 40px;
	line-height: 1.7;
}
#document .cont-body h4, 
#document .cont-body h5 {
	font-size: 1.6rem;
	margin-bottom: 5px;
	line-height: 1.7;
}
#document .listst li::before {
	margin-top: 10px;
}

/* setting 
------------------------------------------------------------------------ */
#setting {
	position: fixed;
	width: 100%;
	left: 0;
	background-color: #111;
	height: auto; 
	bottom: -30vh;
	padding: 24px;
	box-sizing: border-box;
	transition: .5s;
	z-index: 20;
	box-shadow: rgba(0, 0, 0, 0.25) 0px 25px 50px -12px;
}
#setting h5 {
	padding-bottom: 10px;
	border-bottom: 1px solid #ccc;
}
#setting a {
	color: #fff;
}
#setting.open {
	bottom: 0;
	transition: .5s ease-out;
}
#setting section {
	width: calc(50% - 60px);
	float: left;
}
#setting section:last-child {
	margin-left: 24px;
}
#setting ol li {
	display: inline-block;
	margin-right: 8px;
	line-height: 1;
}
#setting #type ol li {
	margin-right: 16px;
}
#setting #type ol {
	font-size: 0;
	margin-top: 12px;
}
#setting #type ol li:first-child {
	border-left: none;
	padding-left: 0;
}
#setting #type ol li {
	padding-left: 16px;
	border-left: 1px solid #ccc;
}
#setting #type ol li a {
	font-size: 2rem;
}
#setting ol li a:hover {
	color: #fff;
	transition: .3s;
}
#b-color h5 {
	margin-bottom: 12px;
}
#b-color ol li a {
	width: 24px;
	height: 24px;
	display: block; 
	box-sizing: border-box;
	border-radius: 100px;
	background-color: #fff;
	text-indent: -9999em;
	border: 2px solid #fff;
}
#b-color ol li a.dark {
	background-color: #111;
}
#b-color ol li a.grey {
	background-color: #d6d6d6;
}
body.grey #home-news,
body.grey #home-project,
body.grey #header.act,
body.grey {
	background-color: #d6d6d6;
	transition: .5s ease-in-out;
}
body.dark #home-news,
body.dark #home-project,
body.dark #header.act,
body.dark {
	background-color: #111;
	transition: .5s ease-in-out;
	color: #fff;
}
body.dark .col .cate span, 
body.dark ul.txt-list li a, 
body.dark a {
	color: #fff;
	border-color: #fff;
}
body.dark * {
	border-color: #fff !important;
}
body.dark footer ul li,
body.dark footer p,
body.dark footer ul li a {
	color: #fff;
}
body.white #home-news,
body.white #home-project,
body.white #header.act,
body.white {
	background-color: #fff;
	transition: .5s ease-in-out;
}
body.yg73 {
	font-family: 'Inter', 'yg730', Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif;
}
body.ym74 {
	font-family: 'Inter', 'ym740', Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif;
}
body.yh {
	font-family: 'Inter', 'yh', Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif;
}
#notfound div {
	width: 50%;
	margin: 0 auto;
	margin-top: 20vh;
}
.category-typobranding .arrr:hover::after, 
.page-template-about .arrr:hover::after {
	background-color: #f00;
}
.category-typogallery .menu li.current-menu-item a::before, 
.category-typogallery span.more, 
.category-typogallery .pagination .current,

.category-font .pagination .current,
.category-font span.more, 
.category-font-9599 .menu li.current-menu-item a::before, 
.category-font .menu li.current-menu-item a::before {
	background-color: #FFF500;
}
.category-news .arrr:hover::after, 
.category-news .menu li.current-menu-item a::before, 

.category-exclusive .arrr:hover::after, 
.category-exclusive span.more, 
.category-exclusive .menu li.current-menu-item a::before {
	background-color: #007FFF;
}
.category-typogallery .slick-prev {
	background-image: url(images/ico-arr-lw.svg);
}
.category-typogallery .slick-next {
	background-image: url(images/ico-arr-rw.svg);
}
.single div.border figure img {
	border: 1px solid #000;
	box-sizing: border-box;
}
.bsearch_highlight {
	background: transparent !important;
	border-bottom: 1px solid;
}
#search-cont .col .cate span {
	font-size: 1.4rem;

}
.wp-block-table td {
	border: 1px solid;
}
.wp-block-table th,
.wp-block-table td {
	padding: 24px;
	box-sizing: border-box;
}
#page {
	max-width: 800px;
	margin-top: 100px;
}
#page h2 {
	margin-top: 40px;
	margin-bottom: 10px;
}
#page .wp-block-image figcaption {
	font-size: 1.4rem;
	color: #999;
	text-align: center;
}
#page p,
#page ul {
	margin: 10px 0 20px;
}
#page li {
	list-style: auto;
	list-style-position: inside;
}
@media (min-width: 960px) and (max-width: 1099.98px) { 
#menu-gnb li {
		margin: 0 6px;
	}
#logo,
#lnb a,
#about .sec a,
#about .sec p,
#menu-gnb li a {
		font-size: 1.7rem;
	}

}
.post-body .y780 {
	font-family: 'Inter', 'yg780', Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif;
}

/* typocommunication 
------------------------------------------------------------------------ */
.page-template-typocommunication {
	background: #000 !important;
	color: #fff;
	font-family: 'Syne', 'yg745', Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif;
}
.page-template-typocommunication #header.act {
	background-color: rgba(0,0,0,0.8);
}
.page-template-typocommunication a {
	color: #aaa;
}
.page-template-typocommunication .tb {
	color: #fff;
}
.page-template-typocommunication #fab {
	display: none;
}
#page-typocommunication {
	margin-top: 0;
}
#page-typocommunication .sec {
	position: relative;
	margin: 20vh 0;
}
#ty-12 .porv {
	position: relative;
	margin-top: -120px;
	z-index: -1;
}
#page-typocommunication .tac {
	text-align: center;
}
#page-typocommunication .twrap .line {
	-webkit-text-stroke: 1px #fff; /* Safari, Chrome, Opera */
	text-stroke: 1px #fff; 
	color: transparent;
}
#page-typocommunication .twrap h4 {
	font-size: 2.8rem;
	color: #fff;
	margin-bottom: 32px;
	line-height: 1.3;
}
#page-typocommunication .twrap h3 {
	font-size: 2.8rem;
	line-height: 1.3;
}
#page-typocommunication .twrap h2 {
	line-height: 1.2;
	font-size: 8rem;
}
#page-typocommunication .twrap p {
	font-size: 2rem;
}
.ws {
	width: 25%;
	display: block;
	margin-left: auto;
	margin-right: auto;
}
.wm {
	width: 50%;
}
.wl {
	width: 75%;
}
.ww {
	width: 100%;
}
.nlw {
	margin-left: 0;
}
.nrw {
	margin-right: 0;
}

#ty-intro {
	margin-top: 0 !important;
	width: 100%;
	height: 100vh;
}
#ty-intro video {
	opacity: 0;
	height: 100%;
	object-fit: cover;
	position: absolute;
}
#ty-intro video.do {
	opacity: 1;
}
#ty-intro #p { 
	z-index: 2;
	width: 64px;
	height: 64px;
	filter: invert(1);
cursor: pointer;
}
#ty-intro #p:hover { 
transition: .4s;
transform: translate(-50%, -53%);
}
#ty-intro img {
	z-index: 2;
	width: 100%;
	height: 100%;
	display: block;
	object-fit: cover;
}
.fx {
	display: flex;
}
#ty-1 {
	min-height: 80vh;
	padding: 20vh 0;
}
#ty-1 .fx {
	margin: 15vh auto 40vh;
	gap: 80px;
	justify-content: center
}
#ty-1-v  {
	top: 65%;
	left: 0;
	width: 80%;
	z-index: -1;
}
#ty-1-v img {
	opacity: .5;
}
#ty-1 div .c {
	margin-top: 100px;
	position: relative;
}
#ty-1 div .c::before {
	position: absolute;
	display: block;
	top: -50px;
	width: 100%;
	height: 2px;
	background: #fff;
	content: "";
}
#ty-1-t {
	margin-top: 50vh;
}
#ty-1-t h2 {
	margin: 32px auto;
	padding-right: 40px;
	box-sizing: border-box;
}

#ty-2 {
	overflow: hidden;
}
#ty-2 h2 {
	font-size: 7rem;
color: #fff;
	box-sizing: border-box;
	padding: 60px;
			 padding-right: 0;
}
#ty-2 div::before, 
#ty-2 div::after {
	position: absolute;
	top: 0;
	left: 0;
	background: #fff;
	content: "";
	width: 1px;
	height: 1px; 
}
#ty-2 div::after {
	bottom: 0;
	top: auto;
}
#ty-2 div.on::after, 
#ty-2 div.on::before {
	width: 100%; 
	transition: .7s;
}

#ty-3l {
	position: absolute;
	bottom: 0;
	left: 0;
	background: #fff;
	content: "";
	width: 1px;
	height: 1px; 
}
#ty-3l.on {
	width: 100%; 
	transition: 1.2s;
}
#ty-3 img {
	margin-left: 0;
	width: 40%;
	object-fit: cover;
}
#ty-3 .twrap {
	width: 60%;
	padding: 60px 0 0;
	box-sizing: border-box;
}
#ty-3 .twrap::before {
	position: absolute;
	top: 0;
	left: 0;
	background: #fff;
	content: "";
	width: 1px;
	height: 1px; 
}
#ty-3 #wrap3.on::before {
	height: 100%;
	transition: .7s;
}

#ty-3 .twrap h4 {
	margin: 60px 0 5vw;
}
#ty-3 .twrap .slk2 {
	margin-top: 10vw;
}
#ty-3 .twrap .slk2 .slick-slide {
	width: 300px;
		   margin-right: 32px;
}
#ty-3 .twrap .slk2 div h2 {
	color: #fff;
}
#ty-3 .twrap .slk2 div h4 {
	margin-top: 24px;
	font-size: 1.8rem;
	line-height: 1.6;
	width: 80%;
}
#ty-3 .twrap article {
	padding-left: 60px;
}
#ty-3 .twrap .line {
	background: #fff;
	content: "";
	width: 1px;
	height: 1px; 
}
#ty-3 .twrap #l1 {
	height: 3px;
}
#ty-3 .twrap #l2 {
	margin-top: 6px;
	height: 6px;
}
#ty-3 .twrap #l3 {
	margin-top: 6px;
	height: 12px;
}
#ty-3 .twrap #l1.on {
	width: 100%; 
	transition: .7s;
}
#ty-3 .twrap #l2.on {
	width: 100%; 
	transition: .7s;
	transition-delay: .2s;
}
#ty-3 .twrap #l3.on {
	width: 100%; 
	transition: .7s;
	transition-delay: .5s;
}
#ty-3 .twrap section h4 {
	font-size: 1.8rem;
	line-height: 1.8;
	padding-left: 60px;
	box-sizing: border-box;
	width: 80%;
}

.secl {
	padding-left: 10%;
	box-sizing: border-box;
}
#ty-44 { 
	margin: 0 auto;
}
#ty-44 h2::after {
	content: "+";
	font-size: 10rem;
}
#ty-44 h2, 
#ty-44 h3 {
	font-size: 10rem;
	color: #fff;
	line-height: 1;
}
#ty-44 h3 {
	text-align: right;
}
#ty-4 {
	color: #fff;
	padding: 20vh 0;
	background-color: #000;
}
#ty-4.on {
	filter: invert(1);
	transition: .7s;
}
#ty-4 h2 {
	margin-top: 36px;
}
#ty-4 .twrap {
	margin-top: 60px;
	margin-bottom: 60px;
}

#ty-4 .fx {
	position: relative;
}
#ty-4 .fx>* {
	flex: 1;
	padding: 60px;
	box-sizing: border-box;
}
#wrap4 {
	padding-bottom: 10vh;
}
#wrap4::before {
	position: absolute;
	top: 0;
	left: 50%;
	background: #fff;
	content: "";
	width: 0;
	height: 1px; 
}
#wrap4.on::before {
	width: 1px;
	height: 100%;
	transition: .7s;
}
#ty-4 .fx::before {
	position: absolute;
	top: 0;
	left: 0;
	background: #fff;
	content: "";
	width: 1px;
	height: 1px; 
}
#ty-4 #ty-4typo.on::before {
	width: 100%; 
	transition: .7s;
}
#ty-4 #ty-4per.on::before {
	width: 100%; 
	transition: .7s;
	transition-delay: .2s;
}
#ty-4 .fx>* h2 {
	font-size: 7rem;
	line-height: 1.2;
	    word-break: break-word;
}
#ty-4.on .fx img {
	filter: invert(1);
}
#ty-4 .fx>* p {
	margin-top: 48px;
	font-size: 1.8rem;
	width: 80%;
}

#ty-4 .fx>* p.nrw {
	margin-left: 20%;
}
#ty-4-end {
	margin-top: 100px;
}
#ty-4-end h2 {
	font-size: 9rem;
	margin-top: 40px;
	line-height: 1.2;
}

#ty-45 {
	color: #fff;
}
#ty-45 h3 {
	font-size: 5rem;
	line-height: 1.2;
}
#ty-45 h2 {
	font-size: 10rem;
	line-height: 1.2;
}
#ty-45 h4 {
	font-size: 4rem;
}
#ty-45 p {
	margin-top: 100px;
	font-size: 2rem;
}
#ty-45 .slk2 {
	margin-top: 160px;
	opacity: .4;
}
#ty-45 .slk2 img {
	width: auto;
	margin: 0;
	height: 150px;
}

#ty-6-1 {
	color: #fff;
}
#ty-6-1 h3 {
	font-size: 5rem;
	margin-bottom: 0 !important;
	line-height: 1.2;
}
#ty-6-1 h2 {
	font-size: 10rem;
	line-height: 1.2;
}
#ty-6-1 h4 {
	font-size: 4rem;
}
#ty-6-1 p {
	margin-top: 100px;
	font-size: 2rem;
}
#ty-5 {
	width: 100%;
	overflow: hidden;
	padding: 20vh 0;
}
#ty-5 .fx {
	align-items: flex-end;
	gap: 32px;
	margin-bottom: 30px;
	justify-content: center;
}
#ty-5 h4 {
	font-size: 2rem !important;
	margin-bottom: 20px !important;
}
#ty-5 article div.d2 {
	background-color: transparent !important;
	margin: 30px 0;
	overflow-y: auto;
	overflow-x: hidden;
}
#ty-5 article {
	width: 100%;
	text-align: center;
}
#ty-5 .d2 h6 {
	display: inline-block;
	font-size: 5rem;
	-webkit-text-stroke: 1px #777; /* Safari, Chrome, Opera */
	text-stroke: 1px #777; 
	color: transparent;
	margin: 0 2vw;
}
#ty-5 img {
	z-index: -1;
}

#ty-6 {
	background: url("images/bgone.jpg") no-repeat;
	background-size: 70%;
	background-position: center;
}
#ty-6 h3 {
	margin-bottom: 32px;
}
#ty-7 { 
	padding-bottom: 40vh;
	overflow: hidden;
}
#ty-7 .txt li div {
	width: 80%;
}
#ty-6 .img { 
	opacity: .3;
}
#ty-6 img { 
	transform: translate(0);
}
#ty-6 .act img#i1 {
	transform: translate(0, 0px) rotate(10deg);
	transition: .5s;
}
#ty-6 .act img#i2 {
	transform: translate(50%, -30%) rotate(-15deg);
	transition: 1s;
}
#ty-6 .act img#i3 {
	transform: translate(-50%, -50%) rotate(15deg);
	transition: 1.2s;
}
#ty-6 .act img#i4 {
	transform: translate(0, -60%) rotate(-10deg);
	transition: 1.2s;
}

#ty-6 .txt {
	z-index: 2;
	width: 100%;
	margin-top: 180px; 
}
#ty-6 .txt li {
	flex: 3;
	padding: 50px;
	box-sizing: border-box;
	border: 1px solid #fff;
	border-left: 0;
	aspect-ratio: 1 / 1;
	position: relative;
}
#ty-6 .txt li.ii {
	border-right: none;
}
#ty-6 .txt li.ee {
	flex: 1;
}
#ty-6 .txt li.ee:last-child {
	border-right: none;
}
#ty-6 .txt li h4 {
	margin-bottom: 30px;
}
#ty-7-txt {
	padding-top: 200px;
}
#ty-7-txt::before {
	position: absolute;
	top: 0;
	left: 50%;
	background: #fff;
	content: "";
	width: 1px;
	height: 0; 
}
#ty-7-txt.on::before {
	height: 160px; 
	transition: .7s;
}
#ty-7-txt h4 {
	line-height: 1.5 !important;
	font-size: 3.2rem !important;

}


#ty-8-txt {
	padding-bottom: 20px;
	border-bottom: 1px solid #aaa;
}
#ty-8-txt a {
	color: #aaa;
}
#ty-8-txt h2 {
	font-size: 15rem !important;
	margin-right: 30px;
	display: inline-block;
}
#ty-8-txt a h3 {
	display: inline-block;
}
#ty-8-txt a:hover {
	color: #fff;
}
#ty-8-txt a:hover span {
	transform: rotate(90deg) translate(12px, -12px);
	transition: .5s;
}
#ty-8-txt a span {
	transform: rotate(90deg);
	font-size: 6rem;
}

#lt1 {
	transform: translate(-20%, 0%) rotate(90deg);
	z-index: -1;
	width: 35%;
	top: 0;
	position: absolute;
}
#ty-8 {
	margin-bottom: 10vh !important;
	margin-top: 34vh !important;
}
#ty-9 #lt2 {
	transform: rotate(20deg);
	position: absolute;
	top: -60%;
	right: 5%;
	width: 35%;
		   z-index: -1;
}
#ty-9 {
	margin-top: 0 !important;
	padding-top: 0vh;
	overflow: hidden;
}
#ty-9 .img {
	min-height: 90vmin;
	position: relative;
	z-index: 2;
	margin-top: 15vh;
}
#ty-9 .img img {
	position: absolute;
	height: 14vmin;
	width: auto;
}
#ty-9 .img img#i1 {
	top: 12.5%;
	left: 100%;
}
#ty-9 .img img#i2 {
	top: 12.5%;
	left: -100%;
}
#ty-9 .img img#i3 {
	top: 62.5%;
	left: 100%;
}
#ty-9 .img img#i4 {
	top: auto;
	bottom: 0;
	left: -100%;
}
#ty-9 .img img.on {
	transition: 1s;
	opacity: 1;
}
#ty-9 .img img#i1.on {
	top: 12.5%;
	left: 60%;
	transform: translate(-50%, -50%);
}
#ty-9 .img img#i2.on {
	top: 37.5%;
	left: 48%;
	transform: translate(-50%, -50%);
}
#ty-9 .img img#i3.on {
	top: 62.5%;
	left: 60%;
	transform: translate(-50%, -50%);
}
#ty-9 .img img#i4.on {
	top: auto;
	bottom: 0;
	left: 48%;
	transform: translate(-50%, -50%);
}
#ty-9 article {
	position: relative;
}

article.secl h6 {
	border-radius: 100px;
	border: 1px solid;
	color: #888; 
	font-size: 1.6rem; 
	padding: 4px 16px;
	display: inline-block;
}
article.secl p {
	font-size: 2rem;
	margin-top: 36px;
	margin-bottom: 52px;
}
article.secl h3 {
	margin: 24px 0;
	font-size: 3.2rem; 
	color: #fff;
}
article.secl h5 {
	font-size: 2rem; 
	color: #888; 
}
.slk2 img {
	width: 500px;
	margin: 0 10px;
}
.por {
	position: relative;
}
.por article {
	position: absolute;
	bottom: 0;
}

#ty-12 .porvv {
	position: absolute;
	top: 0;
}
#ty-12 #gom {
	width: 15%;
	position: absolute;
	right: 36px;
	bottom: 52px;
}
#ty-11, 
#ty-12, 
#ty-14 {
	margin-top: 12vh !important;
}
#ty-10 {
	margin-bottom: 12vh !important;
}
#ty-11 {
	margin-top: 12vh !important;
	margin-bottom: 12vh !important;
}
#ty-12 {
	margin-bottom: 0 !important;
}
#ty-13 {
	margin-top: 0 !important;
}
#ty-13 #ttwe {
	position: absolute;
	z-index: 3;
	height: 28vmin;
	width: auto;
	left: 30px;
	top: 80vh;
	transform: scale(1);
}
#ty-13 #ttwe2 {
	position: absolute;
	z-index: 3;
	height: 26vmin;
	width: auto;
	top: 50vh;
	right: 30px;
	transform: scale(1);
}
#ty-13 #ttwe2.on {
	top: 20vh;
	transition: .5s;
}
#ty-13 #ttwe.on {
	top: 60vh;
	transition: .5s;
}
#ty-14 {
	margin-bottom: 0 !important;
}
#ty-14 ul {
	display: flex;
}
#ty-14 ul li {
	flex: 1;
	height: 0;
	padding-bottom: 50%;
	position: relative;
}
#ty-14 ul li div {
	position: absolute;
	left: 32px;
	bottom: 28px;
}
#ty-14 ul li img {
	margin-top: 1px;
}
#ty-14 ul li div h3 {
	font-size: 4.8rem;
}
#ty-14 ul::after {
	position: absolute;
	top: 0;
	left: 50%;
	background: #fff;
	content: "";
	width: 1px;
	height: 1px; 
}
#ty-14 ul.on::after {
	height: 100%; 
	transition: 1.5s;
}
#ty-14 ul::before {
	position: absolute;
	top: 0;
	left: 0;
	background: #fff;
	content: "";
	width: 1px;
	height: 1px; 
}
#ty-14 ul.on::before {
	width: 100%; 
	transition: 1.5s;
}
#ty-15 {
	margin-top: 0 !important;
}
#ty-15 p {
	font-size: 18rem;
	padding: 2.5vh 0;
	border-top: 1px solid #fff;
	border-bottom: 1px solid #fff;
}
.marquee {
	width: 100%;
	padding: 10px 0;
	overflow: hidden;
	background-color: #000;
	color: #fff;
}
#ty-16 {
	position: relative;
}
#ty-16 a {
	font-size: 8rem;
	text-align: center;
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 2;
}
#ty-16 a:hover {
	color: #fff;
	transition: .4s;
}
#ty-16 a span {
	font-size: 5rem;
}
.opv { opacity: .3; }

.hero,
.hero_content {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}

.hero {
	overflow: hidden;
	background: url("images/mainimg.jpg") no-repeat 50% fixed;
	background-size: cover;
	width: 100%;
	height: 100vh;
	z-index: -1;
}

.hero_video,
.hero iframe {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100vw;
	height: 56.25vw; /* 9/16*100 = 56.25 */
	min-height: 100vh;
	min-width: 177.77vh; /* 16/9*100 = 177.77 */
}

.hero iframe {
	opacity: 0;
}

.hero iframe.loaded {
	opacity: 1;
}

.hero_content {
	z-index: 8675309;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.hero_content_title {
	color: #fff;
	font-size: clamp(1.5rem, 5vw, 3.25rem);
	line-height: 1.75rem;
	text-align: center;
	text-transform: uppercase;
	letter-spacing: 0.375em;
	font-weight: lighter;
	margin-bottom: 2.625rem;
}

.hero_content_play {
	display: block;
	position: relative;
	width: 4rem;
	height: 4rem;
	border: 2px solid transparent;
	border-radius: 50%;
	background: rgba(22, 22, 16, 0.75);
	text-indent: -9999px;
	transition: border-color 0.3s ease;
	animation: pulse 3s infinite;
}
.hero_content_play:hover {
	border-color: #fff;
	animation: none;
}

.hero_content_play:after {
	content: "";
	display: block;
	position: absolute;
	top: 1rem;
	left: 1.425rem;
	width: 0;
	height: 0;
	border: 0;
	border-color: transparent transparent transparent #fff;
	border-style: solid;
	border-width: 1rem 0 1rem 1.5rem;
}