/* include 공통 CSS */


/************************* header_inc 시작*************************/

.header_t			{width:100%; margin:0 auto; height:90px; position:fixed; left:0; top:0px; z-index:99;  -webkit-transition: all 300ms ease-out;
-moz-transition: all 300ms ease-out;
-o-transition: all 300ms ease-out;
transition: all 300ms ease-out;}

.h-inner{ width: 100%; max-width: 1600px; margin: 0 auto; height: 90px; border-bottom: 1px solid rgba(255, 255, 255, 0.5); display: flex; justify-content: space-between; align-items: center; }

/* 로고 */
.head_logo .w_logo {display: block; position:relative; width: auto;}
.head_logo .c_logo {display: none; width: auto;}

.heightBlank					{}


/* 햄벅 */
.mo_nav				{display:block; }
.mo_nav *{
-webkit-transition: all 300ms ease-out;
-moz-transition: all 300ms ease-out;
-o-transition: all 300ms ease-out;
transition: all 300ms ease-out;}
.mo_nav .navbar-toggle {position: relative; background-color:transparent; background-image:none; border-radius: 0; border:0;}
.mo_nav .navbar-toggle:focus {outline: 0;}
.mo_nav .navbar-toggle .icon-bar {background: var(--w-color); display:block; width:30px; height:2px; }
.mo_nav .navbar-toggle .icon-bar + .icon-bar {margin-top:6px; }
.mo_nav .navbar-toggle .icon-bar + .icon-bar + .icon-bar{margin-top:6px;  }

.mo_nav:hover .navbar-toggle .icon-bar								{transform:translateX(5px);}
.mo_nav:hover .navbar-toggle .icon-bar + .icon-bar		{transform:translateX(16px);}
.mo_nav:hover .navbar-toggle .icon-bar + .icon-bar + .icon-bar		{transform:translateX(5px);}



/**/

.f-nav{width:100%; padding:0; height:90px; background: var(--w-color);  box-shadow:1px 1px 10px rgba(0,0,0,0.05);}
.f-nav .head_logo .w_logo{display: none;}
.f-nav .head_logo .c_logo{display: block;}
.f-nav .menu .major > ul > li > a{color:#212121 !important;}
.f-nav .menu .major > ul >li + li > a:before{background: rgba(0,0,0,0.3);}
.f-nav .mo_nav .navbar-toggle .icon-bar{ background-color: var(--main-color);}

@media(max-width: 1430px){
	.h-inner{ padding: 0 3%; transition: all .3s;}
}

@media(max-width: 860px){
	.header_gnb_bg{ display: none;}
	.header_t{height: 70px;}
	.h-inner{height: 70px;}
	.f-nav{height: 70px;}
	.head_logo .w_logo, .head_logo .c_logo{width: auto; height: 32px; }

}

/************************* header_inc 끝*************************/

/************************* main_inc 시작*************************/
.main_visual										{position:relative; margin:0 auto;}
.main_center										{margin:0 auto; }
.shop_main_wrap									{margin-top:20px;}

.content_desc{ min-height: 250px;}

/* main-공통 */
.section{ position: relative; width: 100%; margin: 0 auto; display: block;  }
.m-inner{ width: 100%; max-width: 1400px; margin: 0 auto; display: block; padding: 100px 0;}
.m-flex{ display: flex; justify-content: space-between;}

.m-title{margin: 0 0 50px; position: relative; z-index: 1;}
.m-title span{ font-size: 20px; font-weight: 700; color: var(--main-color); text-transform: uppercase; line-height: 1; display: block; margin-bottom: 20px; }
.m-title h2{ font-size: 38px; font-weight: 700; line-height: 50px;}
.m-title a{ position: absolute; right: 0; bottom: 0; display: flex; align-items: center; font-size: 16px; }
.m-title a i{ font-size: 22px; padding-left: 10px; }
.m-ftext a h3{ font-size: 24px; font-weight: 800;  line-height: 1.1; text-transform: uppercase; }
.m-ftext a p{ font-size: 16px; line-height: 1.5; }

.main_visual .scroll{ position: absolute; color: var(--w-color); width: 60px; margin: 0 auto; left: 0; right: 0; bottom: 0; z-index: 11;}
.main_visual .scroll span{ font-size: 16px; font-weight: 700; text-transform: uppercase; animation: scroll 1.5s ease infinite; position: absolute; top: -20%;}
.main_visual .scroll::after{ content: ""; display: block; width: 3px; height: 60px; background: var(--w-color); margin: 15px auto 0;}

@keyframes scroll {
	0% {top: -10%;}
	50% {top: -20%;}
	100% {top: -10%;}
}

@media(max-width: 1050px){
	.main_visual .scroll span{ font-size: 12px; left: 7px; }
}

/* m01 */

.m01_obj1{ position: absolute; top: 5%; left: 55%; display: block; width: 200px; height: 200px; margin: 0 0 0 -435px; }
.m01_obj2{ position: absolute;	top: 10%;	left: 50%;	display: block;	width: 306px;	height: 306px;	margin: 0 0 0 730px;}
.m01_obj3{ position: absolute;	top: 65%;	left: 50%;	display: block; width: 285px; 	height: 285px;	margin: 0 0 0 -1070px;	}
.m01_obj4{ position: absolute;	bottom: -50%;	left: 50%;	display: block;	width: 180px;	height: 180px;	margin: 0 0 0 630px}
.m01_obj5{ position: absolute;	bottom: -25%;	left: 50%;	display: block;	width: 130px;	height: 130px;	margin: 0 0 0 -530px;}
.m01_obj6{ position: absolute;	bottom: -35%;	left: 50%;	display: block;	width: 60px;	height: 60px;	margin: 0 0 0 -400px}

.m01_obj1 .m01_obj_item{ background-color: var(--r-bg-color); border-radius: 50%;}
.m01_obj2 .m01_obj_item{ background-image: url("./img/m1_img01.png");}
.m01_obj3 .m01_obj_item{ background-image: url("./img/m1_img02.png");}
.m01_obj4 .m01_obj_item{ background-color: #fbe3cc; border-radius: 50%;}
.m01_obj5 .m01_obj_item{ background-color: #fbe3cc; border-radius: 50%;}
.m01_obj6 .m01_obj_item{ background-color: var(--bg-color); border-radius: 50%;}

.m01_obj_item{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-repeat: no-repeat; background-position: center center; z-index: -1;}

.main01 .m-wrap{ width: 70%; position: relative; z-index: 1; }
.main_count .main_num{ display: flex; justify-content: flex-end; }
.main_count .main_num > div{ position: relative; width: 275px; height: 275px; background: var(--bg-color); padding: 25px;  margin: 0 0 0 25px; transition: all .3s;}
.main_count .m_ntxt{ position: absolute; right: 25px; bottom: -30px; text-align: right; }
.main_count .m_ntxt p{ font-size: 20px; font-weight: 700; color: var(--main-color); text-transform: uppercase; }
.main_count .m_ntxt h3{ font-size: 80px; font-weight: 600; line-height: 1; }

/* m02 */
.main02::before{ content: ""; display: block; width: 330px; height: 330px; background-color: var(--bg-color); position: absolute; bottom: 70px; left: -10px; }

.m-fbox a{ display: block; position: relative; color: var(--font-m-color); transition: all .3s ease;}
.m-fbox a .m-fbox-img{overflow: hidden; max-width: 260px; max-height: 330px; }
.m-fbox a img{ display: block;  transition: all .3s ease;}
.m-fbox a h3{  min-height: 55px; margin: 25px 0 0 0; }

.m-fbox a i{ position: absolute; right: 0; bottom: 0; font-size: 26px; opacity: 0; color: var(--main-color); transition: all .3s ease;}
.m-fbox a:hover{ color: var(--main-color); margin-top: -25px;}
.m-fbox a:hover .m-fbox-img{ box-shadow: 1px 1px 8px rgba( 0, 0, 0, 0.5);}
.m-fbox a:hover img{ transform: scale(1.15); }
.m-fbox a:hover i{ opacity: 1;}


/* m03 */
.main03{ background-color: var(--r-bg-color);}

/* m04 */
.m-fbox1{ width: 48%; }
.m-fbox1 a{ position: relative; display: flex; justify-content: space-between; align-items: center; background: var(--bg-color); padding: 45px 60px; color: var(--font-m-color); transition: none;}
.m-fbox1 a:hover{ background: url("./img/m04_bg1.png") no-repeat; width: 100%; background-size: cover; color: var(--w-color) !important;}
.m-fbox1 a h3{ margin: 0 0 15px; }

.m-button{ position: relative; display: block; overflow: hidden; width: 100%; max-width: 150px; height: 50px; line-height: 47px;   border: 2px solid #333; background: #333; color: var(--w-color); border-radius: 35px; }
.m-button::before, .m-button::after{ content: "";	position: absolute;	top: 0;	right: 0;	bottom: 0;	left: 0;	border-top: 25px solid var(--main-color);	border-bottom: 25px solid var(--main-color); 
	-webkit-transition: all .3s ease-out;
-moz-transition: all .3s ease-out;
-o-transition: all .3s ease-out;
transition: all .3s ease-out;}
.m-button::before{ border-right: 25px solid transparent;	transform: translateX(-100%);}
.m-button::after{ border-left: 25px solid transparent;	transform: translateX(100%);}
.m-button span{ display: flex; font-size: 15px; align-items: center; justify-content: center; position: relative; z-index: 1;}
.m-button span i{ font-size: 20px; padding-left: 5px; }
.m-fbox1 a:hover .m-button{ border: 2px solid var(--main-color);}
.m-fbox1 a:hover .m-button::before{ transform: translateX(-25%);}
.m-fbox1 a:hover .m-button::after{ transform: translateX(25%);}


@media(max-width: 1480px){

	.m-inner{ padding: 100px 1%;}
	.m-title h2{ font-size: 34px; line-height: 1.3;}
	.m-title span{ font-size: 18px; margin-bottom: 15px; }
	.m01_obj2{ left: 40%;}
	.m01_obj3{ left: 58%;}

	.main02 .m-flex > div{ margin: 0 0 0 1%;}
	.main02 .m-flex > div:nth-child(1){ margin: 0;}
	.m-fbox a img{ width: 100%; }
	.m-fbox a h3{ margin: 15px 0;}
	.m-ftext a h3{ font-size: 20px;}
	.m-ftext a p{ font-size: 15px; }

	.m-fbox1{ width: 49%;}
	.m-fbox1 a{ padding: 7%;}
}

@media(max-width: 1200px){
	.main_count .main_num > div{ width: 200px; height: 200px; }
	.main01 .m-wrap{ width: 65%;}
	.main_count .m_ntxt h3{ font-size: 60px;}
	.main_count .m_ntxt p{ font-size: 17px; }

	.m-ftext a p{ font-size: 14px; }
	.m-button{ height: 45px; line-height: 42px; max-width: 120px; border-radius: 25px; }
	.m-button span{ font-size: 14px; }
	.m-button span i{ font-size: 17px; }
}

@media(max-width: 1050px){
	.m-title h2{ font-size: 30px; }
	.m-title span{ font-size: 16px; margin-bottom: 10px; }

	.main_count .main_num > div{ width: 180px; height: 180px; padding: 2%; }
	.main_count .main_num > div img{ display: block; width: auto; height: 52px;}
	.main01 .m-wrap{ width: 65%;}
	.main_count .m_ntxt h3{ font-size: 50px;}
	.main_count .m_ntxt p{ font-size: 16px; }

	.m-ftext a h3{ font-size: 17px;}
	.m-ftext a p{ font-size: 14px; line-height: 1.5; }

	.m-fbox1 a{ padding: 7% 5%;}
	.m-button{ max-width: 100px; height: 40px; line-height: 37px;}
	.m-button span{ font-size: 12px;}
}

@media(max-width: 980px){
	.m-fbox1 a{ min-height: 125px;}
}

@media(max-width: 920px){
	.m-inner{ padding: 80px 3%;}
	.m-title{ margin: 0 0 25px;}

	.main01 .m-flex{ flex-direction: column;}
	.main_count .m_ntxt{ bottom: -20px; right: 15px;}
	.main_count .m_ntxt h3{ font-size: 36px;}
	.main_count .m_ntxt p{ font-size: 14px;}
	.main01 .m-wrap{ width: 100%;}
	.main_count .main_num > div{ width: 32%; height: 150px; padding: 3%; }
	.main_count .main_num > div:nth-child(1){ margin:0;}
	.main_count .main_num{ justify-content: center;}


}

@media(max-width: 780px){
	.m-title a{ font-size: 14px; }

	.main02::before{ width: 200px; height: 200px; bottom: 30px; }
	.main02 .m-flex{ flex-flow: row wrap;}
	.main02 .m-flex > div{ width: 48%; margin: 0 0 5% 0;}
	.main02 .m-flex > div:nth-child(1){ margin: 0 0 5% 0;}
	.main02 .m-flex > div:nth-child(3), .main02 .m-flex > div:nth-child(4){ margin: 0;}
	.m-fbox a .m-fbox-img{ max-height: 30vw;}
	.m-fbox a:hover{ margin-top: 0;}
	.m-fbox a img{ position: relative; top: -100px;}
	.m-fbox a:hover img{ transform: scale(1);}
	.m-fbox a i{ font-size: 22px; }

	.main04 .m-flex{ flex-direction: column;}
	.m-fbox1{ width: 100%;}
	.main04 .m-flex > div:nth-child(1){ margin: 0 auto 3%;}
	.m-fbox1 a{ min-height: unset;}
	.m-button::before, .m-button::after{ display: none;}
}

@media(max-width: 680px){
	.m-inner{ padding: 10% 3%;}
	.m-title{ margin: 0 0 15px; }
	.m-title h2{ font-size: 24px; }
	.m-title span{ font-size: 14px; margin-bottom: 10px; }
	.m-br{ display: none;}
}

@media(max-width: 480px){
	.m-title span{ font-size: 12px; margin-bottom: 5px;}
	.m-title h2{ font-size: 18px;}
	.m-title a{ position: relative; font-size: 12px; margin:10px 0 0;}

	.main_count .main_num{ flex-flow: row wrap;}
	.main_count .main_num > div{ width: 45%; height: 130px; padding: 5%; margin: 0 auto 5%;}
	.main_count .main_num > div img{ height: 38px;}
	.main_count .m_ntxt{ bottom: 5%;}
	.main_count .m_ntxt p{ font-size: 11px;}
	.main_count .m_ntxt h3{ font-size: 26px;}

	.main02::before{ display: none;}
	.main02 .m-flex > div{ margin: 0 0 8% 0;}
	.m-fbox a .m-fbox-img{ max-height: 35vw;}
	.m-fbox a img{ top: -40px;}
	.m-ftext a p{ font-size: 12px;}
	.m-ftext a h3{ font-size: 14px; min-height: 30px; margin: 10px 0;}

	.m-fbox1 a{ padding: 5%; flex-direction: column; align-items: flex-start;}
	.m-ftext a h3{ min-height: unset; margin: 7% 0px;}
	.m-ftext a p{ list-style: 1; font-size: 11px; margin: 0 0 10px;}
	.m-button{ max-width: 80px; height: 30px; line-height: 27px; }
	.m-button span{ font-size: 10px;}
	.m-button span i{ font-size: 13px; }
}


/************************* main_inc 끝*************************/



/************************* title_navi 시작 *************************/
.navi_all {width:100%; margin:0 auto;  height:50px;  }
.navi_in	{ padding:0;max-width:1400px; margin:0 auto; display: flex; align-items: center; }

.home_btn_all						{ width: 3%; position: relative;}
.home_btn_all::after{ content: ""; display: block; width: 5px; height: 5px; border-radius: 5px; background-color: #999; position: absolute; right: -10px; top: 45%;}
.home_btn_all a					{display:block; width: 30px; height: 30px; line-height: 32px; font-size: 16px; font-weight: 600; color: var(--w-color); border-radius: 50%; background-color: var(--main-color); text-align: center; }

.navi_left					{width: 25%;}
.navi_left div			{float:left;}
.navi_left div::after{ content: ""; display: block; clear: both; }

.navi_main		{width:45%;  padding-left: 12px; height:50px; position:relative; line-height:50px;  cursor:pointer; }


.navi_main h1 { font-size:18px; font-weight: 700; margin-left:10px;}
.navi_main > .deco_right { float:right;  }

.navi_main >a.down_btn1	{position:absolute; right:10px; top:0px;}
.navi_main >a.down_btn2	{position:absolute; right:10px; top:0px;}
.navi_main >a.down_btn3	{position:absolute; right:10px; top:0px;}

.navi_title01	{padding:0; height:50px; width:100%; position:relative; line-height:50px; }
.navi_title01 h1 { font-size:16px; font-weight: 500;  margin-left:10px; width:100%;}


.navi_sub {width:50%;  padding-left: 10px; margin-left: 5px;  height:50px; line-height:50px; position:relative; cursor:pointer;}
.navi_sub::before{ content: ""; display: block; width: 5px; height: 5px; border-radius: 5px; background-color: #999; position: absolute; left: 0; top: 45%; }

.navi_sub > h2						{ color: var(--main-color); font-size:18px; font-weight: 700;  cursor:pointer; margin-left:10px;}
.navi_sub > a.down_btn4	{position:absolute; right:10px; top:0px; }

.navi_sub > p						{float:right; }

.extend1							{position:relative; top:-1px; width:100%; }
.extend1 > ul				{position:absolute; left:-1px; min-height:1px; width:100%; padding: 0;  border-top:0; z-index: 999; background:#fff; border:1px solid #efefef; display:none;}
.extend1 > ul li a { display: block; width: 100%;}
.extend1 > ul li:hover a{background-color: var(--main-color); color: var(--w-color) !important;}


.extend2							{position:relative; top:-1px; width:100%;}
.extend2 > ul				{position: absolute;left:-1px; min-height:1px; width:100%; padding: 0;z-index: 999; background:#fff; border:1px solid #efefef; display:none; }
.extend2 > ul li a {  display: block; width: 100%;}
.extend2 > ul li:hover a{background-color: var(--main-color); color: var(--w-color) !important;}

.extend > ul > li		{min-height:20px;}
.down_btn			{cursor:pointer; }

@media(max-width: 1480px){
	.navi_left{ width: 100%; max-width: 400px;}
}

@media(max-width: 1280px){
	.navi_main h1, .navi_sub > h2{ font-size: 16px;}
	.navi_title01 h1{ font-size: 14px; }
}

@media(max-width: 1000px){
	.home_btn_all::after{ display: none;}
}

@media(max-width: 480px){
	.navi_in{ flex-flow: row wrap;}
	.home_btn_all{ width: 100%;}
	.home_btn_all a{ font-size: 12px; width: 25px; height: 25px; line-height: 27px; }
	.navi_main{ padding-lefT: 0;}
	.navi_main h1, .navi_sub > h2, .navi_title01 h1{ font-size: 12px;}
}

/************************* title_navi 끝 *************************/


/************************* footer_inc 시작 *************************/
.footer_t{background: #111; width: 100%; margin: 0 auto; }
.f-inner{padding: 60px 0; width: 100%; max-width: 1400px; margin: 0 auto; display: flex; justify-content: space-between; font-size:12px; color:#a2a2a2; line-height: 1.6;}
.foot_info p span{display: inline-block; padding: 0 10px; }
.footer_site_link ul{display:flex; flex-wrap:wrap; justify-content: flex-end; text-transform:uppercase; margin-bottom: 5px; }
.footer_site_link ul li a{font-size:12px; color:#a2a2a2;  display:block;}
.footer_site_link ul span{font-size:12px; color:#a2a2a2; display:inline-block; padding:0 10px;}
.footer_site_link ul li a:hover{color:#fff;}

.footer_copyright p{font-size:12px; color:#a2a2a2;  text-transform:uppercase;}


@media(max-width: 1800px){
	.f-inner{padding: 60px 3%;}
}

@media(max-width: 1160px){
	.f-inner{display: block; padding: 8% 3%;}
	.footer_site_link{ margin: 15px 0 0;}
	.footer_site_link ul{margin-bottom: 0; align-items: center; justify-content: flex-start; }
}

@media(max-width: 1000px){
	.f-inner{line-height: 1.6; font-size: 11px !important; }
	.footer_site_link ul li a{font-size: 11px;}
}

@media(max-width: 600px){
	.f_inner{line-height: 1.8; font-size: 10px !important; padding: 10% 3%;}
	.footer_site_link ul li a{font-size: 10px;}
}

/************************* footer_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 끝 *************************/


/************************* sub_start *************************/


.s_flex{ display: flex; align-items: center; justify-content: space-between;}
.s_flex.s_box .s_text{ width: 45%;}
.s_flex .s_text h3{ font-size: 30px; font-weight: 700; line-height: 1.4; margin: 0 0 25px; }
.s_flex .s_text p{ font-size: 17px; line-height: 1.6; color: var(--font-s-color); width: 85%;}

.s_flex .s_img{ position: relative; padding: 0 25px;}
.s_flex .s_img p{ position: absolute; transform: rotate(90deg); font-size: 17px; font-weight: 600; color: #686868; text-transform: uppercase;}

.s1_box1 .s_img p{ left: -125px; top: 120px; }
.s1_box2 .s_img p{ right: -170px; top: 170px; }

.s_wrap b{ font-size: 24px; font-weight: 700; color: var(--main-color); margin: 0 0 30px; display: block; }
.s1_com .s_text{ position: relative; width: 22%; min-height: 250px; background: var(--w-color); border: 1px solid #d7d7d7; border-radius: 25px; padding: 25px; }
.s1_com .s_text img{ position: absolute; right: 20px; bottom: 25px; display: block; }

.ceo_text h3::after{ content: ""; display: block; width:200px; height: 3px; background-color: var(--main-color); margin: 35px 0; }
.ceo_text p.last .name{ font-size: 20px; font-weight: 600;}
.ceo_img{ position: relative; padding-right: 25px;}
.ceo_img img{ display: block; }
.ceo_img p{ position: absolute; top: 105px; right: -110px;  font-size: 17px; font-weight: 600; color: #686868; transform: rotate(90deg); }

.s13 .s_flex{ align-items: flex-start;}
.his_twrap{ position: relative; padding: 0 0 0 20px;}
.his_twrap::before{ content: ""; position: absolute; left: -1px; top: 13px; width: 1px; height: 100%; background: #e6e6e6;}
.his_con{ display: flex; margin: 0 0 60px; position: relative;}
.his_con::before{ content: ""; display: block; width: 6px; height: 6px; border-radius: 6px; background: var(--main-color); position: absolute; left: -23px; top: 13px; }
.his_con span{font-size: 26px; font-weight: 700; display: block; }
.his_con ul{ width: calc(100% - 60px); margin: 0 0 0 40px; padding: 5px 0 0; }
.his_con ul li{ font-size: 17px; color: var(--font-s-color); margin: 0 0 15px; }


.s14 .s_wrap{ position: relative; }
.s14 .s_wrap::before{ content: ""; display: block; width: 350px; height: 350px; border-radius: 0 150px 0 0; position: absolute; right: -45px; top: -45px; z-index: -1; background-color: var(--r-bg-color);}

.map_wrap{position: relative; box-shadow: 10px 10px 35px rgba(0, 0, 0, 0.2); border-radius: 0 130px 0 0; overflow: hidden;  }
.map_con.s_flex{ padding: 60px 0; }
.map_con .map_left{ width: 50%; padding-right: 55px; }
.map_con .map_right{ width: 50%;  padding: 35px; background-color: var(--main-color); color: var(--w-color) !important; }
.map_con.s_flex .s_text p{ width: 100%; }

.map_right .map_logo{margin: 0 0 15px; border-bottom: 1px dashed #fff; padding-bottom: 15px; }
.map_right .map_logo img{ display: block;}
.map_right .s_flex{padding: 0 0 15px; justify-content: flex-start;}
.map_right h4{ font-size: 18px; font-weight: 600; width: 120px;}
.map_right p{ font-size: 16px; }

.pro_sub .s_flex .s_text h3::after{ content: ""; display: block; width:80%; height: 2px; background-color: var(--main-color); margin: 25px 0 25px -250px; }
.pro_sub .s_wrap h4{ font-size: 30px; font-weight: 700; padding-bottom: 25px; border-bottom: 2px solid var(--font-m-color);}
.s_box_list.s_flex{ justify-content: flex-start; align-items: flex-start; border-bottom: 1px solid #d7d7d7; padding: 25px 0;}
.s_box_tit{display: flex; align-items: flex-start; gap: 10px; font-size: 22px; font-weight: 500; color: var(--main-color); width: 25%;}
.s_box_tit span{white-space: nowrap; font-size: 18px; font-weight: 700; display: inline-block; color: var(--font-m-color); margin-right: 25px;}
.s_box_text {flex: 1; /* 남은 공간 채우기 */	font-size: 22px;	font-weight: 700; line-height: 1.4; white-space: normal; /* 줄바꿈 허용 */}

.s_box_info{ width: 75%;}
.s_box_info img{margin-top: 20px;}
.s_box_info ul li{ position: relative; padding-left: 15px; font-size: 16px; line-height: 1.8;}
.s_box_info ul li::before{ content: ""; display: block; width: 7px; height: 7px; border: 2px solid #686868; border-radius: 50%; position: absolute; top: 10px; left: 0; }

.pro_sub .s_wrap1{ position: relative; margin: 0px auto 0; }
.pro_sub .s_wrap1::before{ content: ""; display: block; width: 100%; height: 550px; background: #f6f6f6; position: absolute; left: 0; top: 0; z-index: -1; }
.pro_sub .s_wrap1 h4{ font-size: 30px; font-weight: 700; padding-bottom: 25px; }
.s_tit_center{ text-align: center; padding: 100px 0 60px;}
.s_tit_center p{ font-size: 18px; line-height: 1.5; color: var(--font-s-color);}


.pro_sub .s_box_list1{ width: 80%; margin: -100px auto 0; background: var(--w-color); position: relative; z-index: 2; }
.pro_sub .s_box_list_in{ padding: 60px; border-bottom: 1px dotted #d7d7d7;}



@media(max-width: 1480px){

	.s_flex .s_text h3{ font-size: 30px; margin: 0 0 20px;}
	.s_flex .s_text p{ font-size: 16px; width: 100%;}
	.s_flex .s_img p{ font-size: 16px; }

	.ceo_text.s_text{ padding: 0 3% 0 0;}

	.his_img{ width: 50%;}
	.his_img img{ display: block; width: 100%;}

	.pro_img{ padding: 0 3% 0 0;}
	.pro_img img{ display: block; width: 100%; }
	.pro_sub .s_flex .s_text h3::after{ margin: 15px 0 15px -180px;}
	.s_box_tit{ width: 30%; font-size: 20px; }
	.s_box_info{ width: 70%;}

	.s_wrap1 .s_box img{ display: block; width: 100%; }
	.pro_sub .s_box_list1{ width: 90%;}
	.pro_sub .s_box_list_in{ padding: 40px;}
}

@media(max-width: 1200px){
	.s_flex .s_text h3{ font-size: 28px; line-height: 1.2;}

	.s12 .s_flex{ flex-direction: column-reverse; padding: 0;}
	.ceo_img{ height: 45vh; overflow: hidden; padding: 0 25px 0 0; margin: 0 auto 3% 0;}
	.ceo_img img{ width: 100%; position: relative; top: -180px;}
	.ceo_img p{ font-size: 14px; top: 87px; right: -85px; }
	.ceo_text h3::after{ width: 100px; margin: 25px 0;}
	.ceo_text p.last .name{ font-size: 18px; }

	.s14 .s_wrap::before{ right: -25px; top: -25px; width:250px; height: 250px; }
	.wrap_map{ height: 350px !important;}
	.map_con .map_right{ padding: 25px; }
	.map_right .s_flex{ padding: 0 0 10px;}
	.map_right h4{ font-size: 16px;}
	.map_right p{ font-size: 13px; }

	.pro_sub .s_wrap h4{ font-size: 24px; padding-bottom: 15px;}
	.pro_img { margin: 0 0 5%;}
	.pro_sub .s_flex .s_text h3::after{ margin: 15px 0 0; width: 100px;}
	.s_box_tit{ width: 100%;  font-size: 18px; }
	.s_box_tit span{ margin-right: 10px; }
	.s_box_info{ width: 100%; margin: 10px auto 0;}
	.s_box_info ul li{ font-size: 14px;}

	.s_tit_center{ padding: 80px 0 40px;}
	.pro_sub .s_wrap1 h4{ font-size: 26px; padding-bottom: 20px;}
	.s_tit_center p{ font-size: 16px;}
	.s_wrap1 .s_box_tit{ width: 30%;}
	.s_wrap1 .s_box_info ul{ display: flex; justify-content: space-between; flex-flow: row wrap;}
	.s_wrap1 .s_box_info ul li{ width: 50%;}
}

@media(max-width: 1080px){
	.s_flex{ flex-direction: column; align-items: baseline;}
	.s_flex .s_img{ padding: 0 25px 30px;}
	.s_flex .s_img img{ display: block; width: 100%; }
	.s_flex.s_box .s_text{ width: 100%;}
	.m_br{ display: none;}
	.s_flex.s1_box2{ flex-direction: column-reverse;}
	.s1_box2 .s_img p{ right: auto; left:-165px;}

	.s1_com.s_flex{ flex-direction: inherit;}
	.s1_com .s_text{ padding: 2%; min-height: 230px;}
	.s1_com .s_text img{ bottom: 20px; width: auto; height:65px;}

	.his_img{ width: 100%; height: 50vh; overflow: hidden; margin: 0 auto 3%;}
	.his_con span{ font-size: 22px;}
	.his_con ul li{ font-size: 15px; }

	.s14 .s_flex{ flex-direction: inherit; align-items: flex-start;}
}

@media(max-width: 880px){
	.s_flex .s_text h3{ font-size: 24px; }
	.s_flex .s_text p{ font-size: 15px;}

	.s1_com .s_text{ width: 24%; min-height: 180px;}
	.s1_com .s_text img{ height: 55px;}

	.s14 .s_flex{ flex-direction: column;}
	.map_con .map_left{ width: 100%; padding-right: 0;}
	.map_con .map_right{ width: 100%; margin: 5% auto 0;}

	.pro_sub .s_wrap h4{ font-size: 20px; padding-bottom: 10px;}
	.pro_sub .s_flex .s_text h3::after{ margin: 10px 0 0; width: 100px;}
	.s_box_tit{ width: 100%;  font-size: 16px; }
	.s_box_tit span{ margin-right: 5px; font-size: 15px; }
	.s_box_info{ width: 100%; margin: 5px auto 0;}
	.s_box_info ul li{ font-size: 13px;}

	.pro_sub .s_wrap1::before{ height: 350px; }
	.pro_sub .s_box_list1{ margin: -50px auto 0;}
	.s_tit_center{ padding: 60px 0 20px;}
	.pro_sub .s_box_list_in{ padding: 30px; }
	.pro_sub .s_wrap1 h4{ font-size: 22px; padding-bottom: 10px;}
	.s_tit_center p{ font-size: 14px;}
	.s_wrap1 .s_box_tit{ width: 100%;}
}

@media(max-width: 680px){
	.s_flex .s_img p{ font-size: 13px;}
	.s1_box1 .s_img p{ left: -95px; top: 95px; }
	.s1_box2 .s_img p{ left: -130px; top: 135px;}
	.s_flex .s_text h3{ font-size: 20px; margin: 0 0 10px;}
	.s_flex .s_text p{ font-size: 14px; }
	.s_wrap b{ font-size: 20px; margin: 0 0 10px;}
	.s1_com.s_flex{ flex-flow: row wrap; }
	.s1_com .s_text{ width: 49%; margin: 0 0 2%; min-height: 130px; padding: 3%; border-radius: 10px;}

	.ceo_img{ height: 32vh;}

	.his_img{ height: 32vh; margin: 0 auto 5%;}
	.his_con{ margin: 0 0 8%;}
	.his_con span{ font-size: 18px;}
	.his_con ul{ margin: 0 0 0 20px;}
	.his_con ul li{ font-size: 13px; }

	.s_wrap1 .s_box_info ul li{ width: 100%;}
}

@media(max-width: 480px){
	.s_flex{ padding: 0 0 10%;}
	.s1_com.s_flex{ padding: 0;}
	.s_flex .s_img p{ position: relative; left: auto !important; top: auto !important; transform: rotate(0); font-size: 10px; margin: 0 0 5px;}
	.s_flex .s_img{ padding: 0 0 5%;}
	.s_flex .s_text h3{ font-size: 16px; line-height: 1.2;}
	.s_flex .s_text p{ font-size: 12px;}
	.s_wrap b{ font-size: 18px;}

	.his_twrap::before{ top: 8px;}
	.his_con::before{ top: 7px;}
	.his_con span{ font-size: 16px;}
	.his_con ul li{ font-size: 11px; margin: 0 0 10px;}

	.map_right .map_logo img{ width: auto; height: 32px; }
	.map_con .map_right{ padding: 5%;}
	.map_right h4{ font-size: 14px;}
	.map_right p{ font-size: 11px;}

	.pro_sub .s_wrap h4{ font-size: 16px; padding-bottom: 5px;}
	.pro_sub .s_flex .s_text h3::after{ margin: 5px 0 0; width: 80px;}
	.s_box_tit{ width: 100%;  font-size: 14px; }
	.s_box_tit span{ margin-right: 5px; font-size: 13px; }
	.s_box_info ul li{ font-size: 11px; line-height: 1.5; padding-left: 12px; }
	.s_box_info ul li::before{ width: 4px; height: 4px; border: 2px solid #686868; top: 4px; }

	.pro_sub .s_wrap1 h4{ font-size: 18px;}
	.s_tit_center p{ font-size: 12px; }
	.pro_sub .s_box_list1{ margin: 0 auto; width: 100%; }
	.pro_sub .s_box_list_in{ padding: 20px; }
}

/************************* sub_끝 *************************/