:root {
	/* color */
	--color-primary-dark:#000;
	--color-primary:#333;
	--color-primary-bright:#666;
	--color-key:#2797c7;
	--color-key-bright:#2797c7;
	--color-key-dark:#2797c7;
	/* background */
	--background-bright:#fafafa;
	/* ease */
	--ease-out-1:cubic-bezier(0.33, 1, 0.68, 1);
	--ease-in-out-1:cubic-bezier(0.65, 0, 0.35, 1);
	--ease-out-2:cubic-bezier(0.22, 1, 0.36, 1);
	--ease-in-out-2:cubic-bezier(0.83, 0, 0.17, 1);
	--ease-out-back:cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* ****************************** 말줄임 ****************************** */

.text-ellipsis-line1 { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:block; }
.text-ellipsis-line2 { overflow:hidden; text-overflow:ellipsis; word-break:break-all; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2 }

/* more */
.common_mc .common_btn_more { position:relative; width:100px; height:40px; display:flex; justify-content:center; align-items:center; gap:10px; /*background:rgba(0,0,255,.1);*/ }
.common_mc .common_btn_more .icon { position:relative; width:10px; height:10px; transition:all ease-out .3s }
.common_mc .common_btn_more .icon:before { content:''; top:calc(50% - 1px); left:0; position:absolute; width:100%; height:2px; background:#333 }
.common_mc .common_btn_more .icon:after { content:''; top:0; left:calc(50% - 1px); position:absolute; width:2px; height:100%; background:#333 }
.common_mc .common_btn_more p { transform:translateY(-2px); font-family:'Noto Sans KR'; font-size:15px; color:#333; line-height:1; letter-spacing:-.5px; transition:all ease-out .3s }
/* hover */
.common_mc .common_btn_more:hover .icon { transform:rotate(180deg) }

/* ******************************************************* swiper ******************************************************* */

.common_mc .swiper { line-height:0 }

/* swiper-pagination */
.common_mc .swiper-pagination { bottom:auto !important; position:relative; margin-top:40px; width:100% !important }
.common_mc .swiper-pagination-bullet { width:8px; height:8px; border-radius:4px; overflow:hidden; opacity:1; background:rgba(0,0,0,.2); transition:all ease-out .3s; cursor:pointer; margin:0 !important }
.common_mc .swiper-pagination-bullet:nth-child(n+2) { margin-left:8px !important }
.common_mc .swiper-pagination-bullet-active { width:40px; transition:all ease-out .3s; background:rgba(0,0,0,.6) }
/*@media only screen and (max-width:1023px) {
	.common_mc .swiper-pagination { bottom:auto; position:relative; margin-top:40px }
	.common_mc .swiper-pagination-bullet { width:6px; height:6px; border-radius:3px }
	.common_mc .swiper-pagination-bullet:nth-child(n+2) { margin-left:6px !important }
	.common_mc .swiper-pagination-bullet-active { width:30px }
}
@media only screen and (max-width:767px) {
	.common_mc .swiper-pagination { margin-top:20px }
}*/

/* prev/next */
.common_mc .btn_pn { top:0; position:absolute; width:60px; height:100%; cursor:pointer; display:none; z-index:1; /*background:rgba(0,0,255,.2)*/ }
.common_mc .btn_prev { left:-60px }
.common_mc .btn_next { right:-60px }
.common_mc .btn_pn .arrow_wrap { top:50%; left:50%; transform:translate(-50%,-50%); position:absolute; width:40px; height:40px; background:#fff; border-radius:50%; border:1px solid rgba(0,0,0,.4); transition:all .3s ease-out }
.common_mc .btn_pn .arrow { border:solid rgba(0,0,0,.5); border-width:0 1px 1px 0; display:inline-block; vertical-align:middle; padding:7px; transition:all .3s ease-out }
.common_mc .btn_prev .arrow_wrap .arrow { top:50%; left:50%; transform:translate(-50%,-50%) rotate(135deg); position:absolute; margin-left:4px }
.common_mc .btn_next .arrow_wrap .arrow { top:50%; left:50%; transform:translate(-50%,-50%) rotate(-45deg); position:absolute; margin-left:-4px }
/* hover */
.common_mc .btn_pn:hover .arrow_wrap { border-color:rgba(0,0,0,.4) }
.common_mc .btn_pn:hover .arrow { border-color:rgba(0,0,0,1) }