@charset "utf-8";

/****************************************************************************************************
*	Slide Up Layer
*****************************************************************************************************/
.SUL									{position:fixed; top:0px; right:; left:; bottom:0; width:100%; max-width:calc(1240px - 310px - 2px); display:none; height:100%; box-sizing:border-box; overflow:hidden; z-index:100;}

.SUL .maskbg							{display:block; width:100%; position:absolute; top:0; right:0; bottom:0; left:0; background-color:#000; opacity:0; transition:opacity 0.4s;}
.SUL.on .maskbg							{opacity:.5;}
.SUL.on .sul_wrap						{transform:translateY(0);}

/* Layer Type 01 */
.SUL .sul_wrap							{position:relative; width:100%; height:100%; padding:0 20px; box-sizing:border-box; background-color:#fff; overflow:hidden; transform:translateY(100%); transition:transform 0.4s; border-radius:10px 10px 0 0}
.SUL .sul_header						{display:inline-block; position:relative; margin:0px auto; width:100%; text-align:center;}
.SUL .sul_body							{position:relative; /*min-height:calc(100% - 60px - 94px); max-height:calc(100vh - 60px - 94px);*/ box-sizing:border-box; overflow:hidden; overflow-y:auto; outline:none;}
.SUL .sul_footer						{padding:16px 20px 28px;}

/* Layer Type 02 */
.SUL.type02 .sul_wrap					{position:absolute; right:0; bottom:0; left:0; height:auto; padding:30px 30px 20px 30px; border-radius:10px 10px 0 0; box-sizing:border-box; overflow:visible;}
.header_title							{display:inline-block; width:100%; margin:0 auto; padding:15px 0; box-sizing:border-box; font-size:18px; font-weight:700; text-align:left; line-height:1.44; color:#333; border-bottom:1px solid #DDD}
.header_title a.btn_reset				{float:right; display:inline-block; height:28px; padding:0 14px; margin-left:5px; border-radius:28px; border:1px solid #DDD; box-sizing:border-box; background-color:#fff; font-size:12px; font-weight:500; line-height:24px; letter-spacing:-1px; color:#888;}
.SUL.type02 .sul_body					{min-height:auto; max-height:calc(100vh - 100px); box-sizing:border-box; overflow:hidden; overflow-y:auto;}
.SUL.type02 .sul_footer					{padding:0px;}

@media screen and (max-width:980px) {
	.SUL.type02 .sul_wrap				{padding:30px 20px 10px 20px;}
}


/* Filter Area */
.filter_area							{margin:10px auto;}
.filter_area > li						{display:inline-block; width:100%; padding:20px 0; border-bottom:1px solid #EDEDED;}
.filter_area > li:last-child			{border:none; padding-bottom:10px}
.filter_area .filter_title				{display:inline-block; width:100%; margin-bottom:15px; font-size:15px; font-weight:700; letter-spacing:-1px; color:#333;}

.filter_area .obj_division				{display:block; box-sizing:border-box;}
.filter_area .obj_division > li			{display:inline-block; margin-bottom:10px; box-sizing:border-box;}
.filter_area .obj_division.col_5 > li	{float:left; display:inline-block; width:20%;}
.filter_area .obj_division.col_4 > li	{float:left; display:inline-block; width:25%;}
.filter_area .obj_division.col_3 > li	{float:left; display:inline-block; width:33.3333%;}
.filter_area .obj_division.col_2 > li	{float:left; display:inline-block; width:50%;}

/* Close */
.SUL .sul_close 						{position:absolute; top:0; left:0; display:none; width:100%; height:30px; color:transparent; overflow:hidden; text-indent:-1000em;}
.SUL .sul_close:before					{content: ''; position:absolute; display:block; top:12px; left:50%; width:60px; height:6px; margin-left:-30px; border-radius:3px; background-color:#000; opacity: .35;}
.SUL .sul_close							{display:block;}


/***** Select layer *****/
.sulSelect {position:fixed; right:0; left:0; bottom:0; display:none; height:100%; box-sizing:border-box; overflow:hidden; z-index:100;}
.sulSelect .maskbg {display:block; position:absolute; top:0; right:0; bottom:0; left:0; background-color:#000; opacity:0; transition:opacity 0.4s;}
.sulSelect .sulSelect_wrap {position:absolute; right:0; bottom:0; left:0; width:100%; padding-top:30px; padding-bottom:18px; border-radius:8px 8px 0 0; box-sizing:border-box; background-color:#fff; transform:translateY(100%); transition:transform 0.4s;}
.sulSelect .sulSelect_header {padding:0 20px;}
.sulSelect .sulSelect_header > h2 {width:100%; padding:6px 0 24px; border-bottom:1px solid #eee; color:#333; font-weight:700; font-size:18px; line-height:1.44; letter-spacing:-0.8px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
.sulSelect .sulSelect_body {max-height:calc(100vh - 60px - 105px); box-sizing:border-box; overflow:hidden; overflow-y:auto; outline:none;}
.sulSelect .sulSelect_close {position:absolute; top:0; left:0; display:block; width:100%; height:30px; color:transparent; overflow:hidden;}
.sulSelect .sulSelect_close:before {content:''; position:absolute; top:12px; left:50%; display:block; width:52px; height:6px; margin-left:-26px; border-radius:3px; background-color:#333; opacity:.15;}

.sulSelect.on .maskbg {opacity:.5;}
.sulSelect.on .sulSelect_wrap {transform:translateY(0);}

.sulSelect_list {padding-top:20px;}
.sulSelect_list li {padding: 0 20px;}
.sulSelect_list li a {display:block; width:100%; padding:13px 0 12px; font-size:18px; font-weight:400; line-height:1.5; letter-spacing:-0.6px; color:#333; overflow:hidden;}
.sulSelect_list li.on {background-color:#f6f6f6;}
.sulSelect_list.ty02 {padding-bottom:20px;}
.sulSelect_list.ty03 .off {position:relative; opacity:0.2;} /* 2020_07_09 */
.sulSelect_list.ty03 .off a {cursor:auto} /* 2020_07_09 */
.sulSelect_list.ty03 .tit {margin-bottom:2px; font-size:18px; color:#333; font-weight:400; line-height:1.5; letter-spacing:-0.6px;}
.sulSelect_list.ty03 .date {font-size:12px; color:#231f20; font-weight:400; line-height:1.58; letter-spacing:-0.5px;}


/* Full browser Layer Popup */
.pop_wrap					{position:fixed; left:0; top:0; width:100%; height:100%; padding:30px 30px; overflow-x:hidden; overflow-y:auto; z-index:55555; visibility:hidden; box-sizing:border-box;
							opacity:0; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s;}

.pop_open .pop_wrap.opened{visibility: visible;opacity:1;}
.pop_wrap:before			{content:'';display: block;position: fixed;left:0;top:0;width:100%;height:100%;background: #000;opacity: 0;-webkit-transition: .2s ease opacity;transition: .2s ease opacity;}
.pop_open .pop_wrap:before	{opacity: .8;-webkit-transition: .2s ease opacity;transition: .2s ease opacity;}

.pop_wrap2					{position:fixed; left:0; top:50px; width:100%;  padding:30px 30px; overflow-x:hidden; overflow-y:auto; z-index:110; visibility:hidden; box-sizing:border-box;
							opacity:0; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s;}

.pop_open .pop_wrap2.opened{visibility: visible;opacity:1;}
.pop_wrap2:before			{content:'';display: block;position: fixed;left:0;top:50px;width:100%;background: #000;opacity: 0;-webkit-transition: .2s ease opacity;transition: .2s ease opacity;}
.pop_open .pop_wrap2:before	{opacity: .8;-webkit-transition: .2s ease opacity;transition: .2s ease opacity;}

.pop_cont		{background:#fff; position:relative; width:100%; margin:auto; top:30%; padding:30px; opacity:0;
							-webkit-transform:translateY(-50%) rotateX(-70deg); -moz-transform:translateY(-50%) rotateX(-70deg); -ms-transform:translateY(-50%) rotateX(-70deg); transform:translateY(-50%) rotateX(-70deg);
							-webkit-transform-style:preserve-3d; -moz-transform-style:preserve-3d; transform-style:preserve-3d;
							/*-webkit-transition:all 0.2s; -moz-transition:all 0.2s; transition:all 0.2s;*/}

.pop_open .pop_cont			{opacity:1; -webkit-transform:rotateX(0deg) translateY(-50%); -moz-transform:rotateX(0deg) translateY(-50%); -ms-transform:rotateX(0deg) translateY(-50%); transform:rotateX(0deg) translateY(-50%);}
.pop_cont .pop_closeArea	{display:block; width:25px; height:25px; position:absolute; font-size:0; top:20px; right:20px; cursor:pointer; z-index:99;}
.pop_cont .cssIcon.x		{position:absolute; font-size:0; display:block; top:0px; right:0px; cursor:pointer;}
.pop_cont .cssIcon.x:before	{right:10px; top:1px; height:20px; width:1px;}
.pop_cont .cssIcon.x:after	{right:10px; top:1px; height:20px; width:1px;}


@media screen and (min-width:980px) and (max-width:5000px) { 
.pop_cont		{width:80%; max-width:350px;}
.pop_cont.type500	{width:80%; max-width:500px;}
}

/* popup - common */
.popCommon_cont .popCont_text			{height:150px; position:relative; box-sizing:border-box; padding:0;}
.popCommon_cont .popCont_text strong	{position:relative; display:block; text-align: center; font-size:22px; color:#111; font-weight:500; -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); transform:translateY(-50%); top:50%;}




/****************************************************************************************************
*	Main Popup
*****************************************************************************************************/
.c_popup						{position:fixed; left:0; top:0; width:100%; height:100%; background:transparent; display:flex; justify-content:center; align-items:center; flex-direction:column; z-index:99;}
.c_popup .pop_wraps				{z-index:90; position:relative; max-width:600px; max-height:638px; display:inline-block; border-radius:10px; overflow:hidden;}
.c_popup_bg						{background:rgba(0,0,0,0.7); position:fixed; left:0; top:0; width:100%; height:100%; z-index:10}
.c_popup .pop_contents			{overflow:hidden; padding:0px; margin:0 auto; text-align:center}

.c_popup .img_box				{overflow:hidden; width:600px; height:600px; background:#fff; border:0 !important; box-sizing:border-box;}
.c_popup .img_box img			{max-width:600px; max-height:600px;}

.c_popup .close_box				{background:#fff; border:0 !important; overflow:hidden;}
.c_popup .close_box label		{float:left; font-size:12px; color:#666; font-weight:500; position:relative; text-align:left; box-sizing:border-box; margin-right:10px; padding:10px; line-height:12px; letter-spacing:-1px;}
.c_popup .close_box label:hover {text-decoration:underline; cursor:pointer; color:#222;}
.c_popup .close_box input		{margin-right:6px; margin-top:0px}

.c_popup .close_box .btn_close	{float:right; width:25px; height:25px; padding:5px; margin-top:8px; margin-right:0px;}
.c_popup .close_box .btn_close i{position:relative; top:-1px;}


.c_popup .swiper-pagination-bullet-active	{opacity:1 !important; background:#eb3300 !important; outline:none;}
.c_popup .swiper-pagination-bullet			{width:12px; height:12px; display:inline-block; border-radius:100%; background:#FFF; opacity: .2;}

.c_popup .swiper-button-prev, 
.c_popup .swiper-button-next				{opacity:0; top:50%; width:50px !important; height:50px !important; cursor:pointer; outline:none; background-image:none; z-index:100;
											-webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;
											border-radius:100%; border:none; -webkit-box-shadow:inset 0 0 0 1px rgb(255 255 255 / 50%); box-shadow:inset 0 0 0 1px rgb(255 255 255 / 50%);}

.c_popup .swiper-button-prev				{left:-6%; opacity:.6; filter:alpha(opacity=60); -ms-filter:alpha(opacity=60); outline:none;}
.c_popup .swiper-button-prev:after			{position:absolute; top:calc(50% - 8px) !important; left:20px; width:14px; height:14px; border:4px solid #FFF; border-radius:2px; border-top:none; border-left:none; -webkit-transform:rotate(135deg); transform:rotate(135deg); -moz-transform:rotate(135deg); content:'';}

.c_popup .swiper-button-next				{right:-6%; opacity:.6; filter:alpha(opacity=60); -ms-filter:alpha(opacity=60); outline:none;}
.c_popup .swiper-button-next:after			{position:absolute; top:calc(50% - 8px) !important; right:20px; width:14px; height:14px; border:4px solid #FFF; border-radius:2px; border-top:none; border-left:none; -webkit-transform:rotate(-45deg); transform:rotate(-45deg); -moz-transform:rotate(-45deg); content:'';}

.c_popup:hover .swiper-button-prev			{left:2%; opacity:0.5;}
.c_popup:hover .swiper-button-next			{right:2%; opacity:0.5;}
.c_popup .swiper-button-prev:hover,
.c_popup .swiper-button-next:hover			{opacity:1.0; filter: alpha(opacity=100); -ms-filter:alpha(opacity=100); border:none; -webkit-box-shadow:inset 0 0 0 10px rgb(255 255 255 / 50%); box-shadow:inset 0 0 0 10px rgb(255 255 255 / 50%); overflow:visible !important;}


@media screen and (max-width:750px) {	
	.c_popup				{width:100%; left:0 !important; border:0; padding:10px; box-sizing:border-box;}
	.c_popup .pop_wraps		{width:100%;}

	.c_popup .img_box		{width:auto; height:auto;}
	.c_popup .img_box a		{width:100%;}
	.c_popup .img_box img	{width:100%; height:auto; max-width:none;}

	.c_popup .swiper-button-prev		{left:-60px; opacity:.6; filter:alpha(opacity=60); -ms-filter:alpha(opacity=60); outline:none;}
	.c_popup .swiper-button-next		{right:-60px; opacity:.6; filter:alpha(opacity=60); -ms-filter:alpha(opacity=60); outline:none;}
}

.c_popup .Bpage_num						{position:absolute; right:10px; bottom:10px; z-index:20; min-width:50px; padding:4px 8px; border-radius:14px; background:rgba(0,0,0,.5); font-size:11px; font-weight:500; line-height:15px; color:#fff; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}