/* include 공통 CSS */

/************************* 공통 시작*************************/
.poppins {font-family: 'Poppins', sans-serif;}
.basker {font-family: 'Baskervville', serif;}
.noto {font-family: 'Noto Sans KR', sans-serif;}
.dmserif {font-family: 'DM Serif Display', serif;}
/* ff-* 표준 폰트 클래스 — 신규 작업은 이쪽 사용 (기존 4종은 하위호환 유지) */
.ff-montserrat {font-family: 'Montserrat', 'Noto Sans KR', sans-serif;}
.ff-poppins {font-family: 'Poppins', 'Noto Sans KR', sans-serif;}
.ff-noto {font-family: 'Noto Sans KR', sans-serif;}
.ff-dmserif {font-family: 'DM Serif Display', serif;}

.inner {margin: 0 auto; max-width:1800px; width: 100%;}
.content_desc {padding-bottom: 120px;}
@media(max-width:1840px){
	.inner {padding: 0 4%;}
}

.more-square a,
.contact-square a,
.filter-square a {display: inline-flex; justify-content:center; align-items:center; width: 100%; height: 100%; padding:18px 12px; font-size: var(--text__desc05); line-height: 1; text-align: center; border:2px solid var(--black-01); transition:.3s ease all;}

.more-square {width:131px;}
.contact-square {width:158px;}
.filter-square {width:130px;}
.more-square a {max-width:131px;}
.contact-square a {max-width:158px;}
.filter-square a {max-width:130px;}

.more-square.white a,
.contact-square.white a,
.filter-square.white a {color: #fff; border:2px solid #fff; }


.more-square.white a:active,
.more-square.white a:focus,
.contact-square.white a:active,
.contact-square.white a:focus,
.filter-square.white a:active,
.filter-square.white a:focus {background-color: #fff; color: var(--black-01);}

@media(min-width:769px){
.more-square.white a:hover,
.contact-square.white a:hover,
.filter-square.white a:hover {background-color: #fff; color: var(--black-01);}
}

@media (max-width:768px){
	.contact-square {width:120px;}
	.contact-square a {max-width:120px; padding:12px;}
}
@media (max-width:500px){
	.contact-square {width:100px;}
	.contact-square a {max-width:100px}
}


/************************* 공통 끝 *************************/

/************************* header_inc 시작*************************/
.header_t{position: relative; mix-blend-mode: difference; z-index: 10;}

.header-wrap {position: fixed; left:0; top:0; padding:15px 0; width:100%;}
.header-wrap .header-contents {display: flex; justify-content:space-between; align-items:center;}

.header_gnb a{color:#fff; font-size:17px; font-weight:600;}

.header_gnb .main_menu{display: flex; align-items: center; justify-content: center;}
.header_gnb .main_menu .menu{position: relative; padding:0 40px;}  
.header_gnb .main_menu .menu>a{display: block; line-height: 50px; transition:.3s ease all;}

.header_gnb .snb_menu{display: none !important; position: absolute; top:88px; background:#fff; padding:5px; width: 100%; left:0; right:0; margin: auto; border:1px solid #ddd;}
.header_gnb .snb_menu a{font-weight:500; display: block; padding:10px 0; color:#121212; font-size:14px; text-align: center;}

.header_gnb .main_menu li>a:focus, .header_gnb .main_menu li:hover>a{color:#fd8104;}/*hover*/
.header_gnb .main_menu li.active>a{color:#fd8104;}/*1댑스 현재 페이지 on*/
.header_gnb .snb_menu .sub_active>a{color:#fd8104;}/*2댑스 현재 페이지 on*/


@media(max-width:1340px){
	.header_gnb a {font-size: 16px;}
	.header_gnb .main_menu .menu {padding: 0 30px;}
}
@media(max-width:1080px){
	.header_gnb {display: none;}
}

/* 햄벅 */
a.ham-btn {display:block;}
a.ham-btn .icon-bar {margin-top: 5px; background:#fff; display:block; width:18px; height:2px;}
a.ham-btn .icon-bar:first-of-type {margin-top: 0;}
a.ham-btn .icon-bar:nth-of-type(2) {width: 12px;}

.gnb-wrap {position: fixed; top: 0; left: 0; padding: 97px 0 3.1%; justify-content: space-between; width: 100%; height: 100vh; opacity: 0; visibility:hidden; transition:.3s ease all; z-index: 100;}
.gnb-wrap.on {opacity: 1; visibility:visible;}
.gnb-wrap i.xi-close {position: absolute; top: 28px; right: calc((100% - 1800px) / 2); font-size: 20px;font-weight: 700; color: #fff; z-index: 100; cursor:pointer;}
.gnb-wrap .gnb-overlay {position: absolute; top: 0; left: 0; width: 100%; height: 0%; background-color: var(--black-01); opacity: 0; visibility:hidden; transition:.3s ease all;}
.gnb-wrap.on .gnb-overlay {height: 100%; opacity: 1; visibility:visible;}
.gnb-wrap .inner {height: 100%;}
.gnb-wrap .inner .gnb-contents {position: relative;  width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: space-between;}
.gnb-wrap ul li a {font-weight: 700; color: #fff;}
.gnb-wrap ul.gnb-main {padding-top: 96px; display: flex;}
.gnb-wrap ul.gnb-main > li {margin-right: 6.2%;}
.gnb-wrap ul.gnb-main > li:last-child {margin-right: 0;}
.gnb-wrap ul.gnb-main > li > a {display: inline-block; margin-bottom: 0.4em; font-size: var(--title__head05);}
.gnb-wrap ul.gnb-sub > li > a {display: inline-block; padding:0.25em 0; font-size: var(--text__desc01); opacity: 0.5; transition:.3s ease all;}
.gnb-wrap ul.gnb-sub > li > a:active,
.gnb-wrap ul.gnb-sub > li > a:focus {opacity: 1;}

@media(max-width:1080px){
	.gnb-wrap {padding:70px 0 3%;}
	.gnb-wrap i.xi-close {right: 4%;}
	.gnb-wrap ul.gnb-main {display: block; padding-top: 80px;}	
	.gnb-wrap ul.gnb-main > li {margin: 0 0 20px 0;}
	.gnb-wrap ul.gnb-sub {display: flex;}
	.gnb-wrap ul.gnb-sub > li {margin-right: 15px;}

	.gnb-info {flex-wrap:wrap;}
	.gnb-info h4 {margin-top: 0.3em; width: 100%;}
}
@media(max-width:768px){
	.gnb-wrap ul.gnb-main {padding-top: 8%;}
}


@media(min-width:769px){
	.gnb-wrap ul.gnb-sub > li > a:hover {opacity: 1;}
}

.gnb-info {display: flex; justify-content:space-between;}
.gnb-info ul {display: flex;}
.gnb-info ul li {margin-right: 16px;}
.gnb-info ul li a {font-size: var(--text-02); font-weight: 600; opacity: 0.5;}
.gnb-info ul li a.blog {opacity: 1;}
.gnb-info h4 {font-size: var(--text-03); opacity: 0.5; color: #fff;}


/************************* header_inc 끝*************************/

/************************* main_inc 시작*************************/
.main_visual										{position:relative; margin:0 auto;}

.main_count 				{background:url('./img/text_bg.jpg') no-repeat center top; padding:60px 3%;}
.main_count .main_num						{ margin:0 auto;}
.main_count .main_num ul:after	{display:block; clear:both; content:''; width:100%;}
.main_count .main_num ul li				{float:left; width:25%; text-align:center; padding:0px 0; position:relative;}
.main_count .main_num ul li h1		{color:#fff; font-size:30px; font-weight:800; margin:0 0 15px 0; padding:0; line-height:100%;}
.main_count .main_num ul li p			{color:#fff; font-size:18px; font-weight:700; margin:0; padding:0; line-height:100%;}

@media(max-width:768px){
.main_count {padding-top:20px;}
.main_count .main_num ul li				{float:left; width:50%; text-align:center; padding:0px 0; position:relative;}
.main_count .main_num ul li:nth-child(3n){margin-top:30px;}
.main_count .main_num ul li:nth-child(4n){margin-top:30px;}

}

/************************* main_inc 끝*************************/

/************************* title_navi 시작 *************************/
.navi_all{border-bottom:1px solid #ddd;}
.navi_in{width:100%; max-width:1300px; margin:0 auto; display: flex;}
.navi_in .home_btn_all a{display: flex; align-items: center; justify-content: center; padding:15px;}
.navi_in .down_btn{position:relative; border-left:1px solid #ddd; border-right:1px solid #ddd;}
.navi_in .down_btn2{border-right:1px solid #ddd; border-left:0;}
.navi_in .down_btn .down_btn_title{display: flex; align-items: center; padding:17px 30px; cursor: pointer; width:240px;}
.navi_in .down_btn .down_btn_title h3{font-size:15px; font-weight:600; line-height:1; transition:all .2s;}
.navi_in .down_btn:hover .down_btn_title h3{color:#ea002b;}
.navi_in .down_btn .down_btn_title img{position:absolute; right:30px; top:0; bottom:0; margin:auto; transition:all .3s;}

ul.extend{position:absolute; background:#fff; width:calc(100% + 2px); top:50px; border:1px solid #ddd; z-index: 5; left:-1px; padding:10px 0; display: none;}
ul.extend li{}
ul.extend li a{ font-size:15px; font-weight:600; display: block; margin:0 30px; padding:13px 0; transition:all .3s;}
ul.extend li a:hover{color:#ea002b;}
@media(max-width:1050px){
	.navi_in .down_btn .down_btn_title {width:200px; padding: 20px;}
}
@media(max-width:768px){
	ul.extend {top:55px;}
	ul.extend li a {font-size: 14px; margin: 0px 20px; padding: 10px 0;}
}
@media(max-width:600px){
	.navi_in .home_btn_all{display: none;}
	.navi_in .down_btn{width:50%;}
	.navi_in .down_btn .down_btn_title {width:100%; padding: 15px;}
	.navi_in .down_btn .down_btn_title h3 {font-size: 13px;}
	.navi_in .home_btn_all a {padding:8px;}
	.navi_in .down_btn .down_btn_title img {right:15px;}
	ul.extend {top:43px;}
	ul.extend li a {font-size: 13px; margin: 0px 17px; padding: 8px 0;}
}



/************************* title_navi 끝 *************************/


/************************* footer_inc 시작 *************************/
footer {padding:91px 0 73px; background-color: var(--black-01);}
footer .ft-contact {display: flex; flex-flow:row wrap; justify-content:space-between; align-items:flex-end; padding-bottom: 19px; color: #fff; border-bottom:1px solid #fff;}
footer .ft-contact h2 {font-size: 42px; font-weight: 700; letter-spacing: 0.7px; line-height: 1; color: var(--gray-06);}

footer .ft-info {padding-top: 44px; display: flex; flex-flow:row wrap; justify-content:space-between; align-items:flex-end; color: var(--gray-01);}
footer .ft-info .ft-lt p {margin-top: 8px; font-size: var(--text__desc04); line-height: 1.43;}
footer .ft-info .ft-lt p:first-child {margin-top: 0;}
footer .ft-info .ft-lt p span {margin-right: 10px;}
footer .ft-info .ft-lt p span:last-child {margin-right: 0;}
footer .ft-info .ft-rt {text-align:right;}
footer .ft-info .ft-rt ul li {margin-top: 2px; font-size: var(--text__desc04); line-height: 1.43;}
footer .ft-info .ft-rt ul li:first-child {margin-top: 0;}
footer .ft-info .ft-rt ul li a {color: var(--gray-01);}
footer .ft-info .ft-rt p {margin-top: 31px; font-size: var(--text__desc04); line-height: 1.43;}

@media(max-width:1080px){
	footer {padding:60px 0 50px;}
	footer .ft-info {padding-top: 30px;}
	footer .ft-info .ft-lt {width: 100%;}
	footer .ft-info .ft-rt {margin-top: 25px; width: 100%; text-align:left;}
	footer .ft-info .ft-rt ul li {margin: 0 12px 0 0; display: inline-block;}
	footer .ft-info .ft-rt p {margin-top: 10px;}
}
@media(max-width:768px){
	footer {padding:45px 0 40px;}
	footer .ft-contact h2 {font-size: 24px;}
	footer .ft-info .ft-lt p {line-height: 1.6;}
	footer .ft-info .ft-lt p span {display: block; margin-right: 0;}
}

/************************* footer_inc 끝 *************************/



/************************* left_lnb_inc 시작 *************************/
.left_lnb		{  }
/************************* left_lnb_inc 끝 *************************/



/************************* ui.totop 시작 *************************/
#toTop {
	display:none;
	text-decoration:none;
	position:fixed;
	bottom:10px;
	right:10px;
	overflow:hidden;
	width:51px;
	height:51px;
	border:none;
	text-indent:100%;
	background:url("./img/ui.totop6.png") no-repeat left top;
}

#toTopHover {
	background:url("./img/ui.totop6.png") no-repeat left -51px;
	width:51px;
	height:51px;
	display:block;
	overflow:hidden;
	float:left;
	opacity: 0;
	-moz-opacity: 0;
	filter:alpha(opacity=0);
}

#toTop:active, #toTop:focus {
	outline:none;
}
/************************* ui.totop 끝 *************************/