@charset "utf-8";
/* CSS Document */

*{margin:0;padding:0;/*font:inherit;color:inherit*/}
*, :after, :before {box-sizing:border-box;}
:root {-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;text-size-adjust:100%;cursor:default;line-height:0;overflow-wrap:break-word;word-break:break-word;-moz-tab-size:4;tab-size:4;border:none}
html, body{}
img, picture, video, canvas, svg {/*display: block;max-width:100%;*/}
button {background:none;border:0;cursor:pointer;}
a {text-decoration:none;}
ul,ol,dl {list-style-type:none; margin:0;}
table {border-collapse:collapse;border-spacing:0;}
iframe {border: 0;}
input, textarea, button { border:none;outline:none }
input, textarea, button:focus { outline:none }
select { border:none; outline:none }


:root {
	
	/*overflow-x:hidden;*/
	
	
	/* default */
	font-family:'nsn_1';
	--font-default:'nsn_1';
	
	font-size:13px;
	color:#333;
	
	/* color */
	--color-key:#3fbeca;
	
	/* size */
	/*--font-size-bordlist-pc:15px;
	--font-size-bordlist-mobile:13px;*/

}

#contents { width:100%; height:100%; overflow:hidden; min-width:1288px; position:relative }

.centerBox { display:flex; justify-content:center; align-items:center }
.text_ellipsis1 { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:block }
.text_ellipsis2 { overflow:hidden; text-overflow:ellipsis; word-break:break-all; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2 }

.box1288 { max-width:1288px; margin:0 auto }
.box1920 { left:50%; margin-left:-960px; position:relative }

/* 개인정보취급방침,회원약관 */
#private_box { width:100%; height:100%; margin:0 auto; position:relative; padding:20px }
#private_box .tit { background:#eee; border-radius:5px; overflow:hidden; text-align:left; display:flex }
#private_box .tit .wrap { border-radius:5px; height:40px; padding:0 25px 0 20px; display:flex; justify-content:flex-start; align-items:center; gap:10px; background:var(--color-key) }
#private_box .tit .wrap > div { width:4px; height:4px; background:rgba(255,255,255,.5); border-radius:2px; display:inline-block }
#private_box .tit .wrap > p { font-family:'nsn_2'; font-size:15px; color:#fff; display:inline-block  }
#private_box .txt { margin-top:20px }
#private_box .inputprivate { font-family:var(--font-default);width:100%; height:335px; padding:10px; border:1px solid #ccc; background:#fff; color:#333; line-height:1.4 }

/* popup */
#popup_pc { top:0; left:0; position:absolute; width:100%; background:rgba(255,0,0,.5); line-height:0 }
#popup_mobile { top:0; left:0; position:absolute; width:100%; background:rgba(0,0,255,.5); line-height:0 }

/* more */
.common_mc .common_btn_more { display:flex; align-items:center; gap:10px; padding:10px 15px; position:relative; transition:all .3s ease-out }
.common_mc .common_btn_more:before { content:''; top:10px; left:0; position:absolute; width:1px; height:calc(100% - 20px); background:rgba(0,0,0,.1); transition:all .3s ease-out }
.common_mc .common_btn_more:after { content:''; top:10px; right:0; position:absolute; width:1px; height:calc(100% - 20px); background:rgba(0,0,0,.1); transition:all .3s ease-out }
.common_mc .common_btn_more .icon { top:50%; left:50%;transform:translate(-50%,-50%) rotate(45deg); position:absolute; width:20px; height:20px; opacity:0; transition:all .3s ease-out }
.common_mc .common_btn_more .icon:before { content:''; top:calc(50% - 1px); left:0%; position:absolute; width:100%; transform:scaleX(.5); height:2px; background:var(--color-key); transition:all .6s ease-in-out }
.common_mc .common_btn_more .icon:after { content:''; top:0; left:calc(50% - 1px); position:absolute; width:2px; height:100%; transform:scaleY(.5);background:var(--color-key); transition:all .6s ease-in-out }
.common_mc .common_btn_more p { font-family:'nsn_2'; font-size:13px; line-height:1; color:rgba(0,0,0,.5); transition:all .3s ease-out }
.common_mc .common_btn_more:hover { padding:10px 15px 10px 15px }
.common_mc .common_btn_more:hover:before { top:0px; height:calc(100% - 0px); background:rgba(0,0,0,.2) }
.common_mc .common_btn_more:hover:after { top:0px; height:calc(100% - 0px); background:rgba(0,0,0,.2) }
.common_mc .common_btn_more:hover .icon { opacity:1; transform:translate(-50%,-50%) rotate(-90deg); width:30px; height:30px;  }
.common_mc .common_btn_more:hover p { color:rgba(0,0,0,0) }
.common_mc .common_btn_more:hover .icon:before { transform:scaleX(1) }
.common_mc .common_btn_more:hover .icon:after { transform:scaleY(1) }
@media only screen and (max-width:1023px) {
	/*.common_mc .common_btn_more { position:absolute; top:0; right:20px; width:48px; height:48px }
	.common_mc .common_btn_more .icon { margin-top:-12px; margin-left:-12px; width:24px; height:24px }*/
}

/* ******************************************************* swiper ******************************************************* */

.common_mc .swiper { line-height:0 }

/* swiper-pagination */
.common_mc .swiper-pagination { bottom:auto; position:relative; margin-top:60px; width:100% !important }
.common_mc .swiper-pagination-bullet { width:8px; height:8px; border-radius:4px; overflow:hidden; opacity:1; background:rgba(0,0,0,.1); 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,.5) }
@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:100px; height:100%; cursor:pointer; display:none }
.common_mc .btn_prev { left:-100px }
.common_mc .btn_next { right:-100px }
.common_mc .btn_pn .arrow_wrap { top:50%; left:50%; transform:translate(-50%,-50%); position:absolute; width:80px; height:80px; background:#fff; border-radius:50%; border:1px solid rgba(0,0,0,.1); transition:all .3s ease-out }
.common_mc .btn_pn .arrow { border:solid #aaa; border-width:0 1px 1px 0; display:inline-block; vertical-align:middle; padding:12px; 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:5px }
.common_mc .btn_next .arrow_wrap .arrow { top:50%; left:50%; transform:translate(-50%,-50%) rotate(-45deg); position:absolute; margin-left:-5px }
.common_mc .btn_pn:hover .arrow_wrap { border-color:rgba(0,0,0,.3) }
.common_mc .btn_pn:hover .arrow { border-color:var(--color-key) }

/* ******************************************************* popup ******************************************************* */

#popup_pc { display:block }
#popup_mobile { display:none }
@media only screen and (max-width:767px) {
	#popup_pc { display:none }
	#popup_mobile { display:block }
}
