@charset "utf-8";

/* Common */
#wrap {position:relative; width:100%; display:block; word-wrap: break-word;}
#wrap:after {content:''; display:block; clear:both;}
.section {overflow:hidden; }
.section:after {content:''; display:block; clear:both;}
.contents {position:relative; width:100%; height:100%; display:flex; align-items:center; justify-content:center; padding-top:90px;}
.contents.noflex {display:block}
.contents-box {z-index:1}
.conwrap {position:relative; width:92%; top:0; max-width:980px; margin:0 auto; padding:230px 0 130px 0; }
.conwrap:after {content:''; display:block; clear:both;}
.layout {position:relative; width:92%; max-width:980px; margin:0 auto;  }
h3.title {font-family:'Gmarket Sans'; font-size:55px; font-weight:300; line-height:68px; text-align:center; margin-bottom:50px;}
h3.title strong {display:block; font-weight:700}

p.base {font-size:14px; color:#1e1e1e;}

@media (max-width:1200px) {
	.conwrap {padding:19% 0 10% 0; }
}

@media (max-width:991px) {
	.conwrap {width:100%;  padding:148px 30px 90px 30px;}
	.layout {width:100%;  padding:0 30px; }
}

@media (max-width:801px) {
	.conwrap {padding:138px 25px 80px 25px;}
	.layout {padding:0 25px; }
}

@media (max-width:600px) {
	.conwrap {width:100%;  padding:128px 20px 70px 20px; }
	.layout {padding:0 20px; }
}

@media (max-width:500px) {
	.conwrap {padding:118px 20px 60px 20px; }
}

@media (max-width:319px) {
	.conwrap {padding:118px 15px 60px 15px; }
	.layout {padding:0 15px; }
}


/* header : PC  */
#header {position:absolute; left:0; top:0; z-index:2;width:100%;  height:100px;  padding:25px 0 0 0; background:#191e25; z-index:5000;  }
.mainWrap #header {background:none; }

#header .layout {width:100%; max-width:100%;padding:0 30px;}
#header h1 {position:absolute; left:30px; top:10px; width:200px; height:30px; float:left;  margin:5px 0 0 0;z-index:3; }
#header h1 a {background:url(/assets/img/common/logo000.svg) no-repeat 0 50%; background-size:auto 30px; height:100%; display:block; }
#header h1 a strong {font-size:0; }

#header h2 {display:none; width:160px; height:40px; float:left;  margin:10px 0 0 20px; }
#header h2 a {background:url(/assets/img/common/logo.svg) no-repeat 0 50%; background-size:100%; width:100%; height:100%; display:block; }
#header h2 a strong {font-size:0; }

@media all and (max-width:1100px){
	#header {position:fixed; height:56px;  padding:0;}
	#header.bg{z-index:4500; background:#191e25;}
	#header h1 {top:0; margin: 0; }
	#header h1 a {line-height:55px; height:56px; background-size:auto 26px;}
	#header h2 {display:block;}
}

@media all and (max-width:801px){
	#header .layout {width:100%; padding:0 25px;}
	#header h1 {left:25px;}
}

@media all and (max-width:600px){
	#header .layout {width:100%; padding:0 20px;}
	#header h1 {left:20px;}
}

@media all and (max-width:319px){
	#header .layout {width:100%; padding:0 15px;}
	#header h1 {left:15px;}
}

/*@media all and (min-width:992px){*/
/*	.mainWrap #header {background:none; }*/
/*}*/

#nav a span,#nav .inside,#nav li,#navbutton a,#navbutton2 a,#navbutton span,#navbutton2 span {
	transition:all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
	-webkit-transition:all 0.5s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0s;
	-moz-transition:all 0.5s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0s;
	-o-transition:all 0.5s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0s;
	-ms-transition:all 0.5s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0s;
}

#navbutton a {cursor:pointer; height:48px; position:fixed; right:30px; text-indent:-999em; top:6px; width:24px; z-index:105;}
#navbutton .on {width:26px;z-index:106;}
#navbutton .on span{background:#fff !important; height:2px;position:absolute;top:17px;width:26px;-webkit-border-radius:2px;-moz-border-radius:2px;-o-border-radius:2px;-ms-border-radius:2px;-khtml-border-radius:2px;border-radius:2px}
#navbutton span{background:#fff;height:2px;left:0; position:absolute;top:15px;width:24px;-webkit-border-radius:2px;-moz-border-radius:2px;-o-border-radius:2px;-ms-border-radius:2px;-khtml-border-radius:2px;border-radius:2px;}

#navbutton span + span{top:23px; width:16px; left:auto; right:0;}
#navbutton span + span + span{top:31px; width:24px}
#navbutton a.on span:first-child{
	transform:translate3d(0, 6px, 0) rotate(225deg);
	-webkit-transform:translate3d(0, 6px, 0) rotate(225deg);
	-moz-transform:translate3d(0, 6px, 0) rotate(225deg);
	-o-transform:translate3d(0, 6px, 0) rotate(225deg);
	-ms-transform:translate(0, 6px) rotate(45deg);
}
#navbutton a.on span+span{top:22px; opacity:0;
	transform:translate3d(0, 150px, 0) rotate(-720deg);
	-webkit-transform:translate3d(0, 150px, 0) rotate(-720deg);
	-moz-transform:translate3d(0, 150px, 0) rotate(-720deg);
	-o-transform:translate3d(0, 150px, 0) rotate(-720deg);
}
#navbutton a.on span+span+span{top:29px;opacity:1;
	transform:translate3d(0, -6px, 0) rotate(-225deg);
	-webkit-transform:translate3d(0, -6px, 0) rotate(-225deg);
	-moz-transform:translate3d(0, -6px, 0) rotate(-225deg);
	-o-transform:translate3d(0, -6px, 0) rotate(-225deg);
	-ms-transform:translate(0, -6px) rotate(-45deg);
}


/* nav */
#nav{width:100%; margin:0 auto;display:inline-block; z-index:10; visibility:visible; }
#nav .back{position:absolute; left:-100%; top:0; width:100%; height:100%; background:#fff; opacity:0; z-index:2;
	-webkit-box-shadow:0 1px 1px rgba(0,0,0,0.2);
	-moz-box-shadow:0 1px 1px rgba(0,0,0,0.2);
	-o-box-shadow:0 1px 1px rgba(0,0,0,0.2);
	-ms-box-shadow:0 1px 1px rgba(0,0,0,0.2);
	box-shadow:0 1px 2px rgba(0,0,0,0.2);}
#nav .back:before {position:absolute;left:0; top:0; width:100%; height:100%; content:''; background:#fff; display:block; opacity:1; z-index:2; }
#nav .inside{width:100%; display:block; }
#nav .inside nav {width:100%; text-align:left;  }
#nav a{box-sizing: border-box; display:block;}

#nav .inside,
#nav .inside nav,
#nav .inside .menu,
#nav .inside nav > ul.menu  {*zoom:1;   font-size:0;}
#nav .inside nav {width:100%; margin:0;}
#nav .inside nav > ul.menu {width:100%; display:flex; justify-content:center; align-items:center; }
#nav .inside nav > ul.menu:after {content:""; display:inline-block; clear:both;}
#nav .inside nav > ul.menu > li {position:relative; display:inline-block;margin:0 40px; outline:none; width:auto; color:#0a0a0a; font-size:0; }
#nav .inside nav > ul.menu > li:first-child {margin-left:0;}
#nav .inside nav > ul.menu > li:last-child {margin-right:0;}
#nav .inside nav > ul.menu > li > a {display:inline-block; padding-bottom:20px; line-height:40px; height:60px; font-size:17px; font-weight:400; color:#fff; display:flex; justify-content:space-between; align-items:center; text-decoration:none; transition:all 0.3s}
#nav .inside nav > ul.menu > li > a:after {content:''; display:block; clear: both; transition:all 0.3s}

#nav .inside nav > ul.menu > li:hover > a   {position:relative; color:#2a6bd3;display:inline-block;}
#nav .inside nav > ul.menu > li.active > a  {color:#2a6bd3;display:inline-block;}

#nav #selArray{transition-delay:0.34s;-webkit-transition-delay:0.34s;-moz-transition-delay:0.34s;-o-transition-delay:0.34s;-ms-transition-delay:0.34s;}
#nav .contact li{transition-delay:0.375s;-webkit-transition-delay:0.375s;-moz-transition-delay:0.375s;-o-transition-delay:0.375s;-ms-transition-delay:0.375s; }

#nav.show {visibility:visible;}
#nav.show .back{opacity:0;}
#nav.show .inside {margin-left:0;}
#nav.show .inside,
#nav.show li{transform:translate3d(0, 0, 0);-webkit-transform:translate3d(0, 0, 0);-moz-transform:translate3d(0, 0, 0);-o-transform:translate3d(0, 0, 0);-ms-transform:translate3d(0, 0, 0);outline:none;}

#nav .contact{padding:20px 0; }
#nav .contact a{line-height:1.6; font-size:12px; cursor:default;}
#nav .smenu {display:none; position:relative; }
#nav .smenu li {text-align:left;}
#nav .smenu li a {display:block; line-height:40px; color:rgba(255, 255, 255, 0.6); text-align:left; font-weight:400; font-size:15px;}
#nav .smenu li a:hover {color:rgba(255, 255, 255, 1.0);}

#nav nav ul.hbox {position:absolute; left:auto; right:85px; top:10px; width:180px;padding:0; display:flex; justify-content:end; align-items:center; z-index:11;}
#nav nav ul.hbox li.sm {width:auto; font-size:14px !important; font-weight:100; text-align:center; padding:0; margin-left:14px;}
#nav nav ul.hbox li.sm a {width:auto; font-size:14px; color:#bebebe;   padding:0; line-height:32px; height:32px; font-weight:500;}
#nav nav ul.hbox li.sm.sm1 a {color:#c77057 !important;}
#nav nav ul.hbox li.sm.sm1 a:hover {color:#2936d6 !important;}
#nav nav ul.hbox li.sm a:hover {color:#fff;}
#nav nav ul.hbox li.sm:hover > a:before  {display:none;}
#nav nav ul.hbox li.active > a {color:#2936d6;}

#nav nav ul.nationbox {position:absolute; right:30px; top:10px;}
.area-custom-select {position: relative; width: 100%; height: 100%;}
.custom-select {display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; font-size:0; box-sizing: border-box; cursor: pointer; outline: 0; opacity:1;}
.custom-select:hover {opacity:1;}
.select-origin {display:none;}
.custom-select-text {position: absolute; right: 0; color:#fff; font-weight:300; line-height:32px; }
.custom-img-nation {position: absolute; top: 7px; left: 0; width:18px; height:auto;}
.custom-select-list {position: absolute; width: 50px; height: auto; padding: 5px 0; border: solid 1px #222934; border-radius: 10px; background-color: #262b31; text-align: center; margin-top: 0; margin-left: -5px; box-sizing: border-box; z-index: 15;}
.custom-select-option {display:block; height:30px; line-height: 30px; padding-top:4px; color:#999; font-size: 0; font-weight:300; cursor: pointer; box-sizing: border-box; transition:background 0.3s;}
.custom-select-option:hover {color: #ffffff; background: rgba(255,255,255,0.05); box-sizing: border-box;}
.custom-select-option.english {background:url(/assets/img/XTRION/language_en.svg) 50% 50% no-repeat;}
.custom-select-option.korean {background:url(/assets/img/XTRION/language_ko.svg) 50% 50% no-repeat;}

.signupWrap

	/* swiper : animation */
.swiper-pagination-bullet-active em{opacity:1 !important; visibility:visible !important; }
.swiper-wrap-container{margin-left:auto;margin-right:auto;}
.swiper-wrap-container,.gangnam-swiper-container{width:100%;height:100%;}


/* Center slide text vertically */
.swiper-slide {text-align:center;font-size:18px;background:#fff; display:-webkit-box;display:-ms-flexbox;display:-webkit-flex;display:flex;
	-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;-webkit-align-items:center;align-items:center;overflow:hidden;}

#header,#header h1,#nav a span,
.swiper-slide .section_index .list,
.section_index .list dd a,
.section_index .list dd a:before,
.section_index .list dd span,
.btn-detail,.btn-detail em,
#nav .inside,#nav li,
.section_index .list dd,#gotop,
.swiper-slide-active .section .bg,
.section_no8 .map,.section_no8 .info,
.section_index .list dt,
.swiper-pagination-bullet-ready .swiper-pagination-bullet,
.swiper-pagination-bullet em,
#navbutton a,
#navbutton span {
	transition:all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
	-webkit-transition:all 0.3s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0s;
	-moz-transition:all 0.3s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0s;
	-o-transition:all 0.3s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0s;
	-ms-transition:all 0.3s cubic-bezier(0.215, 0.610, 0.355, 1.000) 0s;
}

@media all and (max-width:1280px){
	#nav .inside nav > ul.menu > li{margin:0 20px}
	.custom-select-list {top:41px;}
}

@media all and (max-width:1024px){
	#nav .inside nav > ul.menu > li > a {font-size:16px;}

	#navbutton  {display: block; }
	#nav nav ul.hbox li.sm {background:none;}

	/* nav */
	#nav {display:none; position:fixed;left:auto;top:0; right:-100%; width:100%;max-width:100%; height:100%;z-index:12;visibility:hidden; text-align:center; margin:0;}
	#nav .back{display:none;position:fixed;left:-100%;top:0;width:100%;height:100%;background:#000; opacity:0.6; filter:alpha(opacity=60);}
	#nav .back:before{position:fixed;left:0;top:0;width:100%;height:100%;content:'';background:#000;display:block; opacity:0.6; filter:alpha(opacity=60);z-index:11;}
	#nav .inside{position:absolute; right:100%;top:0;width:100%; height:100%; margin-left:0; z-index:15; -webkit-overflow-scrolling:touch;  background:#050505;
		display: block;overflow-x:hidden; overflow-y:auto;
		transform:translate3d(100%, 0px, 0px);
		-webkit-transform:translate3d(100%, 0px, 0px);
		-moz-transform:translate3d(100%, 0px, 0px);
		-o-transform:translate3d(100%, 0px, 0px);
		-ms-transform:translate3d(100%, 0px, 0px);}
	#nav nav{margin:0; position:relative; height:100%;}
	#nav a{box-sizing: border-box; width:100%;   text-align: left; display:block; line-height:50px; height:50px; outline:none; }
	#nav a:hover {color:#1e1e1e;}
	#nav li{width:100%; float:left;
		transform:translate3d(250px, 0px, 0px);
		-webkit-transform:translate3d(250px, 0px, 0px);
		-moz-transform:translate3d(250px, 0px, 0px);
		-o-transform:translate3d(250px, 0px, 0px);
		-ms-transform:translate3d(250px, 0px, 0px);}

	#nav .inside nav  {display:block; width:100%;height:auto;  }
	#nav .inside nav > ul.menu {width:100%; padding:60px 0 0 0;display:block; }
	#nav .inside nav > ul.menu > li {width:100%; border-bottom:1px solid #222222; margin:0;}
	#nav .inside nav > ul.menu > li:first-child{margin-left:0}
	#nav .inside nav > ul.menu > li > a {width:100%; line-height:49px; height:50px; font-size:16px; padding:0 25px; text-align:center;  color:#fff; display:block; font-weight:500; text-align:left; justify-content:end; }
	#nav .inside nav > ul.menu > li > a span {color:#fff;}
	#nav .inside nav > ul.menu > li:hover > a,
	#nav .inside nav > ul.menu > li.active > a  {color:#2a6bd3; opacity:1; filter:alpha(opacity=100);}
	#nav .inside nav > ul.menu > li:hover > a span,
	#nav .inside nav > ul.menu > li.active > a span {color:#2936d6;  }

	#nav .inside nav > ul.menu > li.on > a {position:relative; color:#fff;  }
	#nav .inside nav > ul.menu > li.on > a span  {color:#fff;  }
	#nav .inside nav > ul.menu > li:hover > a:before ,
	#nav .inside nav > ul.menu > li.active > a:before,

	#nav .inside nav > ul.menu li.mw {text-algin:center;}
	#nav .inside nav > ul.menu li.mw a {width:100%; line-height:49px; height:50px; font-size:16px; color :#fff; margin:0 auto; background:none}

	#nav .inside nav ul.hbox {position:fixed;  top:56px; right:0; width:100%; padding:0;  z-index:11; border-bottom:1px solid #2f3035; }
	#nav nav ul.hbox li.sm {margin: 0 15px;}
	#nav nav ul.hbox li.sm a  {line-height:55px; height:56px;  color:#fff; }
	#nav nav ul.hbox li.sm2:before  {position:absolute; left:-15px;top:50%; transform:translateY(-50%); z-index:11; content:''; display:inline-block;width:1px; height:12px; background:#ededed;  }
	#nav nav ul.hbox li.sm a:hover {color:#2936d6;  }

	#nav .inside nav ul.nationbox {position:fixed;  top:112px; right:0; width:100%; height:56px; z-index:11; border-bottom:1px solid #2f3035;}
	.custom-select {height:100%; line-height:100%;}
	.custom-img-nation {top:18px;}
	.custom-select-list {top:37px; right:-5px;}

	#nav .smenu {background:none; min-width:100%; }
	#nav .inside nav > ul.menu > li .smenu li {border-bottom:1px solid #3a3b40;}
	#nav .inside nav > ul.menu > li .smenu li:last-child {border-bottom:none;}
	#nav .inside nav > ul.menu > li .smenu li a {background:#303030; color:#ccc; text-align:left; justify-content:end; padding:0 25px;}

	#nav .inside nav > ul.menu > li .smenu li:hover em {display:inline-block;color:#fff;}

	#nav.show {display:block; visibility:visible;}
	#nav.show .back {display:block;opacity:0.6; }
}

@media all and (max-width:768px){
	#navbutton a {right:20px;}
}

@media all and (max-width:319px){
	#navbutton a,#navbutton .on {right:10px;}
}

@media all and (min-width:1025px){
	#navbutton {display:none; height:0;}
	#nav a span, #nav .inside, #nav li {transition:all 0s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; }

	#nav .inside nav > ul.menu li.mw a {background:#2936d6; border-radius:38px; line-height:36px; height:38px; margin:0 0 5px 10px; padding:0; width:124px;    justify-content:center;}
	#nav .inside nav > ul.menu li.mw:hover a {background:#f8653a; color:#fff; }
	#nav .inside nav > ul.menu li.mw:hover > a:before  {display:none;}
	.mypageWrap #nav .inside nav > ul.menu li.mw a {background:#2936d6; color:#fff; }

	#nav nav ul li .smenu {display:none; position:absolute; top:60px; left:50%; transform:translateX(-50%); width:180px; background:rgba(0, 0, 0, 0.9); padding:10px 15px; border-radius:0 0 10px 10px; transition: all .3s;}
	#nav .inside nav > ul.menu li:hover .smenu {display:block !important; background:rgba(0, 0, 0, 0.8); animation: fadein 0.7s;-moz-animation: fadein 0.7s; -webkit-animation: fadein 0.7s; -o-animation: fadein 0.7s;}

}

@keyframes fadein {
	from {opacity: 0;}
	to {opacity: 1; }
}
@-moz-keyframes fadein {
	from {opacity: 0; }
	to {opacity: 1;}
}
@-webkit-keyframes fadein {
	from {opacity: 0; }
	to {opacity: 1;}
}
@-o-keyframes fadein {
	from {opacity: 0; }
	to {opacity: 1;}
}





/* Footer */
.footer {width:100%; padding:50px 0; background:#0a0a0a; }

.footer_wrap{display:flex; justify-content:space-between; max-width:980px; width:90%; margin:0 auto 60px;  }
.footer_wrap .ft_company{width:35%;}
.footer_wrap .ft_company .ft_logo{}
.footer_wrap .ft_company .sns_list{display:flex; margin-top:20px;}
.footer_wrap .ft_company .sns_list li{margin:0 10px 10px 0; }
.footer_wrap .ft_company .sns_list li a{display:block; width:28px; height:28px; transition:all 0.3s }
.footer_wrap .ft_company .sns_list li a:hover{opacity:0.8}
.footer_wrap .ft_company .sns_list li a img{width:28px; }
.footer_wrap .ft_nav{}
.footer_wrap .ft_nav .ft_nav_list{display:flex; }
.footer_wrap .ft_nav .ft_nav_list > li{margin-left:60px;}
.footer_wrap .ft_nav .ft_nav_list > li:first-child{margin-left:0}
.footer_wrap .ft_nav .ft_nav_list li span{font-size:18px; color:#fff}
.footer_wrap .ft_nav .ft_nav_list li .ft_sub_list{}
.footer_wrap .ft_nav .ft_nav_list li .ft_sub_list li{}
.footer_wrap .ft_nav .ft_nav_list li .ft_sub_list li a{display:block; color:#767676; transition:all 0.3s}
.footer_wrap .ft_nav .ft_nav_list li .ft_sub_list li a:hover{color:#cbcbcb}

.footer .copybox {position:relative; width:90%; max-width:980px; margin:0 auto; display:flex; justify-content: space-between; align-items:start; }
.footer .copybox .copyright {width:50%; color:#505050; line-height:1.4; }
.footer .copybox ul {width:50%;  color:#53555d;display:flex; justify-content:end; align-items:center;}
.footer .copybox ul li {padding: 0 10px;  }
.footer .copybox ul li:last-child {position:relative;  padding: 0 0 0 10px;  }
.footer .copybox ul li:last-child:before{position:absolute; top:6px; left:0; content:''; display:inline-block; width:1px; height:13px; background:#343434; opacity:0.8   }
.footer .copybox ul li a {color:#505050; transition:all 0.3s }
.footer .copybox ul li a:hover {color:#2936d6 ; }

@media (max-width:950px) {
	.footer_wrap .ft_company .sns_list{flex-wrap:wrap; width:160px }
	.footer_wrap .ft_nav .ft_nav_list > li{margin-left:40px;}
}
@media (max-width:800px) {
	.footer {padding:40px 0; }
	.footer_wrap{flex-wrap:wrap; justify-content:center; margin:0 auto 20px;}
	.footer_wrap .ft_company,
	.footer_wrap .ft_nav{width:100%; }
	.footer_wrap .ft_company .ft_logo{text-align:center}
	.footer_wrap .ft_company .ft_logo img{height:24px}
	.footer_wrap .ft_company .sns_list{justify-content:center; width:100%; margin-top:15px; }
	.footer_wrap .ft_company .sns_list li{margin:0 5px 5px;}
	.footer_wrap .ft_nav .ft_nav_list{justify-content:space-around; margin-top:30px; text-align:center}
	.footer_wrap .ft_nav .ft_nav_list > li{margin-left:0}
	.footer_wrap .ft_nav .ft_nav_list li span{font-size:17px}
	.footer_wrap .ft_nav .ft_nav_list::after{display:none}
}
@media (max-width:600px) {
	.footer .copybox {display:block; text-align:center;}
	.footer .copybox .copyright {width:100%;   }
	.footer .copybox ul {width:100%; justify-content:center;  }
}
@media (max-width:500px) {
	.footer_wrap .ft_nav{display:none;}
}
@media (max-width:360px) {
	.footer_wrap .ft_company .sns_list{width:160px; margin:5px auto 0 }
}


/* Modal */
#modalBg {display:none; position:fixed; width:100%; height:100%; top:0; left:0; background:rgba(0,0,0,0.5); z-index:6000}

.modal-box {display:none; position:fixed; top:50%; left:50%; transform:translate(-50%, -50%); width:90%; max-width:480px; max-height:80%;  background:#fff; box-shadow:0 0 5px 0 rgba(0, 0, 0, 0.3); z-index:7000;  border-radius:18px;  }
.modal-box.large{max-width:780px;}
.modal-box.biglarge{max-width:1200px;}
.modal-box ::-webkit-scrollbar{width:5px; height: 5px; background:#eeeff2; border-radius:0 4px 4px 0}
.modal-box ::-webkit-scrollbar-button:start:decrement, ::-webkit-scrollbar-button:end:increment{display:block; height:0px}
.modal-box ::-webkit-scrollbar-track{background: #efefef; -webkit-border-radius:10px; border-radius:10px;}
.modal-box ::-webkit-scrollbar-thumb{height:30%; width:5px; background:rgba(0, 0, 0, .2); -webkit-border-radius:10px; border-radius:10px ;}

.modal-head {display:flex; align-items:center; justify-content:center; height:60px; border-bottom:1px solid #ededed; color:#101010;}
.modal-head.t-left {justify-content:start;}
.modal-head h4 {font-size:20px; font-weight:500; color:#0a0a0a; margin-bottom:0; padding:0 25px;}
.modal-body {position:relative; padding:25px; color:#303030;}
.modal-body.center {display:flex; justify-content:center; align-items:center; padding:35px 25px;}
p.md-base {font-size:16px;  color:#1e1e1e; letter-spacing:0; text-align:center; line-height:1.8;}

.modal-foot {width:100%; padding:0 25px 25px 25px; display:flex; align-items:center; justify-content:center;  border-radius:0 0 18px 18px;}
.modal-foot a {display:block; line-height:55px; height:56px; color:#fff; font-weight:500; background:#101010; text-align:center; flex:1; border:0px solid #474747; border-radius: 8px; font-size:15px; text-transform:uppercase; transition:all 0.3s}
.modal-foot a.btn-close {background:#787878;}
.modal-foot a.btn-close.ov {background:#101010;}
.modal-foot a:nth-child(2) {margin:0 0 0 12px;}
.modal-foot a:hover{color:#fff; background:#2936d6;border:0px solid #2936d6;}
.modal-foot a:nth-child(2):hover,
.modal-foot a.btn-close:hover  {background:#333; color:#fff;}
.modal-foot a.btn-close.ov:hover  {background:#2936d6; color:#fff;}
.modal-foot a.btn-close.dis:hover  {background:#fff; color:#dbdbdb;}

.modal-close a {width:40px; height:40px; position:absolute; right:-25px; top:-45px; display:block; color:#fff; font-size:0; background:url(/assets/img/common/modal_close.svg) no-repeat center 50%; background-size:40px;  transition:all 0.3s }
.modal-close a i {font-size:0;}

#receiveAddress .modal-foot {display:block; }
#receiveAddress .modal-foot a {width:100%;}
#receiveAddress .modal-foot a:nth-child(2) {margin:12px 0 0 0;}

.pop_qrwrap h5 {width:100%; text-align:center; font-size:16px; font-weight: 400;padding:0 0 25px; }
.pop_qrwrap .qrimg {width:100%; text-align:center;}
.pop_qrwrap .qrimg span {width:160px; height:160px; display:inline-block; margin:0 auto;}
.pop_qrwrap .qrimg span img {width:100%; }
.pop_qrwrap .qrtxt {width:100%; text-align:left; word-break:break-all; line-height:1.4; padding:15px 0 0 0;}

.pop_redeem h5{padding:20px 0 15px; font-size:18px; font-weight:600; }
.pop_redeem .address{padding:20px; background:#f1f1f1; line-height:20px; word-wrap:break-word; border-radius: 8px;}

.pop_giftcardDitail{max-height:calc(80vh - 190px); overflow-y:auto}
.pop_giftcardDitail .card_detail_top{display:flex; justify-content:space-between; padding:0 20px; }
.pop_giftcardDitail .card_detail_top .card_img{width:45%; }
.pop_giftcardDitail .card_detail_top .card_img .img_border{width:100%; border:1px solid #eaeaea; border-radius:20px;}
.pop_giftcardDitail .card_detail_top .card_img img{display:block; width:100%;}
.pop_giftcardDitail .card_detail_top .card_info{display:flex; align-content:center; flex-wrap:wrap; width:50%;}
.pop_giftcardDitail .card_detail_top .card_info h5{display:inline-block; font-size:18px; line-height:20px; font-weight:700; vertical-align:top }
.pop_giftcardDitail .card_detail_top .card_info .btn_copy{display:inline-block; width:20px; height:20px; margin-left:10px; background:url(/assets/img/contents/icon_my_copy.svg) center 50% no-repeat; background-size:18px; text-indent:-99999px; vertical-align:top; transition:all 0.3s}
.pop_giftcardDitail .card_detail_top .card_info .btn_copy:hover { background:url(/assets/img/contents/icon_my_copy_on.svg) center 50% no-repeat; background-size:18px; }
.pop_giftcardDitail .card_detail_top .card_info .code{width:100%}
.pop_giftcardDitail .card_detail_top .card_info .qr_img{max-width:90px; width:80%; margin:20px 0 0}
.pop_giftcardDitail .card_detail_top .card_info .qr_img img{display:block}

.pop_giftcardDitail .card_amount{width:94%; margin:20px auto; padding:15px; background:#ededed; font-size:22px; font-weight:700;  text-align:center }
.pop_giftcardDitail .card_amount .unit{font-size:16px; font-weight:300; color:#787878; }
.pop_giftcardDitail .card_amount .lock{display:inline-block; margin-left:10px; font-size:14px; font-weight:400;  }
.pop_giftcardDitail .card_sub_info{display:flex; justify-content:space-between; flex-wrap:wrap; padding:0 10px; font-size:13px; line-height:1.4;}
.pop_giftcardDitail .card_sub_info dl{width:48%;}
.pop_giftcardDitail .card_sub_info dl:last-child{width:100%}
.pop_giftcardDitail .card_sub_info dl dt{margin:10px 0 5px; font-weight:500; }
.pop_giftcardDitail .card_sub_info dl dd{word-break:break-word}
.pop_giftcardDitail .card_sub_info{}

.pop_lock_detail{}
.pop_lock_detail h4{margin:30px 0 10px}
.pop_lock_detail h4:first-child{margin-top:0}
.pop_lock_detail .lock_total_num{padding:15px 20px; background:#ededed; font-size:20px; font-weight:700; text-align:right;}
.pop_lock_detail .lock_total_num .unit{margin-left:5px; font-size:15px; font-weight:300; }
.pop_lock_detail .lock_transac_list{height:calc( 80vh - 340px); overflow-y: auto}
.pop_lock_detail .lock_box{margin-top:15px; padding:10px 20px; border:1px solid #dbdbdb; border-radius:10px; }
.pop_lock_detail .lock_box:first-child{margin-top:0}
.pop_lock_detail .lock_box .lock_amount{font-size:18px; font-weight:700; }
.pop_lock_detail .lock_box .lock_amount .unit{margin-left:5px; font-size:14px; font-weight:300; color:#787878; }
.pop_lock_detail .lock_box .lock_add{margin:10px 0; font-size:14px; line-height:1.1; font-weight:500; word-break:break-all}
.pop_lock_detail .lock_box .lock_type{font-size:14px; line-height:1.2; color:#777}
.pop_lock_detail .lock_box .lock_info{display:flex; margin-top:5px;}
.pop_lock_detail .lock_box .lock_info dl{margin-left:10px; font-size:14px; line-height:1; }
.pop_lock_detail .lock_box .lock_info dl:first-child{margin-left:0}
.pop_lock_detail .lock_box .lock_info dl::after{display:none}
.pop_lock_detail .lock_box .lock_info dl dt,
.pop_lock_detail .lock_box .lock_info dl dd{display:inline-block; margin-right:3px; font-size:13px; line-height:1.2; color:#999}
.pop_lock_detail .lock_box .lock_info dl dt{font-weight:500;}

.pop_dapp_reject{}
.pop_dapp_reject .date{margin-top:10px; font-size:14px; line-height:1; color:#999;}

.pop_dapp_use{max-height:calc( 80vh - 200px ); padding:20px; overflow-y:auto }
.pop_dapp_use .step{margin:30px 0 10px; padding:0 0 5px; border-bottom:1px solid #ddd}
.pop_dapp_use .step:first-child{margin-top:0}
.pop_dapp_use .step .num{display:inline-block; font-size:24px; line-height:25px; font-weight:100; color:#aaa; vertical-align:top }
.pop_dapp_use .step .tit{display:inline-block; margin-left:10px; font-size:22px; line-height:25px; font-weight:500; vertical-align:top}
.pop_dapp_use .con{padding:5px 0 0 10px;}


@media (max-width:801px) {
	.modal-foot a {line-height:49px; height:50px; }
}
@media (max-width:750px) {
	.pop_giftcardDitail .card_detail_top .card_img{width:55%;}
	.pop_giftcardDitail .card_detail_top .card_info{width:40%}
}
@media (max-width:575px) {
	.modal-head {height:60px;}
	.modal-head h4 {font-size:20px;padding:0 20px;}
	.modal-body {padding:20px;}
	.modal-body.center {padding:35px 20px;}
	p.md-base {font-size:15px;  }
	p.md-base.w440 {width:100% !important;}
	.modal-foot a {font-size:16px;}
	.modal-close a{width:30px; height:30px; background-size:30px;}
}
@media (max-width:500px) {
	.pop_giftcardDitail .card_detail_top{flex-wrap:wrap; }
	.pop_giftcardDitail .card_detail_top .card_img{max-width:190px; width:100%; margin:0 auto; }
	.pop_giftcardDitail .card_detail_top .card_info{display:block; width:100%; margin:20px 0 0; text-align:center }
	.pop_giftcardDitail .card_detail_top .card_info .qr_img{margin:20px auto}
}


.plistbtn {width:100%; display:flex; justify-content:center; align-items: stretch;}
.plistbtn li {width:50%; margin:0 10px; }
.plistbtn li:first-child {margin:0 10px 0 0;}
.plistbtn li:last-child {margin:0 0 0 10px;}




/* radio*/
.plistbtn li input[type=radio] {display: none;}
.plistbtn li input[type=radio] + label {display: inline-block;cursor: pointer;position: relative; width:100%; height:100%; color:#1e1e1e; vertical-align:middle;  font-weight:normal; padding:25px 20px; border:1px solid #dbdbdb; border-radius:5px;  }
.plistbtn li input[type=radio] + label:before{content: "";display: inline-block;width:100%;height: 100%; margin: 0 0 10px;position: absolute;left:0;top:0; box-sizing:border-box;}
.plistbtn li input[type=radio] + label:hover {border:1px solid #000;}
.plistbtn li input[type=radio] + label span {width:100%; display:block; line-height:1.4;}
.plistbtn li input[type=radio] + label span.tit {font-size:18px; font-weight:600; }
.plistbtn li:first-child input[type=radio] + label span.tit {padding:75px 0 10px; background:url(/assets/img/contents/icon_person.svg) no-repeat center 1px; background-size:52px;}
.plistbtn li:last-child input[type=radio] + label span.tit {padding:75px 0 10px; background:url(/assets/img/contents/icon_ex.svg) no-repeat center 1px; background-size:60px;}
.plistbtn li input[type=radio]:checked + label,
.plistbtn li input[type=radio]:checked + label:hover{border:1px solid #2936d6 }
.plistbtn li input[type=radio]:checked + label:before {padding-top:40px; content:''; display:inline-block; background:url(/assets/img/contents/check_on.svg) no-repeat center 40px; background-size:21px;  font-size:30px; font-weight:normal; color: #2936d6 ;text-align: center;line-height:18px;  }
.plistbtn li input[type=radio]:checked + label span {color:#2936d6 ;}

@media (max-width:400px) {
	.plistbtn {display:block;}
	.plistbtn li {width:100%; display:block; margin:0;}
	.plistbtn li:first-child{margin:0;}
	.plistbtn li:last-child {margin:15px 0 0 0;}
	.plistbtn li input[type=radio] + label {padding:20px 15px; }
	.plistbtn li input[type=radio] + label span{font-size:14px;}
	.plistbtn li:first-child input[type=radio] + label span.tit {padding:63px 0 5px; background-size:46px;}
	.plistbtn li:last-child input[type=radio] + label span.tit {padding:63px 0 5px;  background-size:52px;}
}


.plistinfo {width:100%; }
.plistinfo li {display:inline-block;  line-height:1.4; padding:5px 0 5px 26px; background:url(/assets/img/contents/icon_check_circle_g.svg) no-repeat 0 7px; background-size:16px; }


/* input */
.form-basic {display:block; width:100%; color:#ccc; border-radius:8px; border:1px solid #333; background:#272829; padding:0 15px; line-height:55px; height:56px;}
.form-memo {font-size:14px; color:#333; letter-spacing:0; margin:10px 0 0 0; line-height:1.4;}
.form-memo.error {color:#2936d6 ;}
.form-memo.done {color:#3471ff; }

input.form-basic::placeholder {color:#999; opacity:1;}
input.form-basic::-webkit-input-placeholder{color:#999;}
input.form-basic:-ms-input-placeholder {color:#999;}
input.form-basic:-moz-placeholder {color:#999;}

@media (max-width:801px) {
	.form-memo {font-size:14px; color:#333; letter-spacing:0; margin:10px 0 0 0;}
	.form-basic {line-height:49px; height:50px;}
}


/* Button */
.btnwrap {width:100%; display:flex; justify-content:center; align-items: stretch;text-align:center;}
.btnwrap a {width:50%; max-width:270px; line-height:1; height:56px; display:flex; justify-content:space-between;align-items:center; font-weight:500; margin:0 20px; text-transform:uppercase;}
.btnwrap a span {width:100%; text-align:center; line-height:1.2 ;  word-break:keep-all; padding:0 10px;}
.mypage .btnwrap a {margin:0 10px; }
.btnwrap a:first-child {margin-left:0; }
.btnwrap a:last-child {margin-right:0;}


.btn {text-transform:uppercase; display:inline-block; width:100%; line-height:55px; height:56px; font-size:15px; text-align:center; color:#1e1e1e; font-weight:600; background-color:transparent; border:1px solid transparent; -webkit-user-select:none; -moz-user-select:none; user-select:none; white-space:nowrap; cursor:pointer; transition:all 0.3s}
.btn1 {text-transform:uppercase; display:inline-block;width:100%; line-height:55px; height:56px; font-size:15px; text-align:center; color:#1e1e1e; font-weight:600; background-color:transparent; border:1px solid transparent; -webkit-user-select:none; -moz-user-select:none; user-select:none; white-space:nowrap; cursor:pointer; transition:all 0.3s}

.btn_bdrd {border-radius: 8px;}
.btn_bdrd02 {border-radius:0 0 8px 8px;}

/* btn color */
.btn.btn-base {color:#fff; background-color:#2936d6 ; border-color:#2936d6 ;}
.btn.btn-base:hover {color:#2936d6 ; background-color:#fff; border-color:#2936d6 ;}
.btn.btn-gary5 {color:#fff; background-color:#555; border-color:#555;}
.btn.btn-gary5:hover {color:#555; background-color:#fff; border-color:#555;}


/* btn outline color */
.btn.btn-outline-base {color:#2936d6 ; background-color:#fff; border-color:#2936d6 ;}
.btn.btn-outline-base:hover {color:#fff; background-color:#2936d6 ; border-color:#2936d6 ;}
.btn.btn-outline-gray5 {color:#555; background-color:#fff; border-color:#555;}
.btn.btn-outline-gray5:hover {color:#fff; background-color:#555; border-color:#555;}

.btn_01 {color:#474747 !important;  background-color:#fff !important;  border:1px solid #474747 !important;}
.btn_01:hover {color:#fff !important;  background-color:#2936d6 !important; border:1px solid #2936d6 !important; }
.btn_02 {color:#fff !important;  background-color:#555 !important;  border:1px solid #474747 !important; }
.btn_02:hover {color:#fff !important;  background-color:#787878 !important; border:1px solid #787878 !important; }
.btn_03 {color:#2936d6  !important; background-color:#fff !important; border:1px solid #2936d6  !important; }
.btn_03:hover {color:#fff !important;  background-color:#2936d6  !important; border:1px solid #2936d6  !important; }
.btn_04 {color:#fff !important; background-color:#555; border:1px solid #555 !important; }
.btn_04:hover {color:#fff !important; background-color:#2936d6  !important; border:1px solid #2936d6  !important; }
.btn_05 {color:#fff !important; background-color:#787878; border:1px solid #787878 !important; }
.btn_05:hover {color:#fff !important; background-color:#2936d6  !important; border:1px solid #2936d6 !important; }
.btn_06 {color:#fff !important; background-color:#2936d6; border:1px solid #191e25 !important; font-size:16px !important;}
.btn_06:hover {color:#101010 !important; background-color:#fff  !important; border:1px solid #2936d6  !important; }
.btn_07 {color:#fff !important; background-color:#040404; border:1px solid #fff !important; }
.btn_07:hover {color:#fff !important; background-color:#2936d6  !important; border:1px solid #2936d6 !important; }
.btn_off {color:#fff !important;  background-color:#dbdbdb !important; border:1px solid #dbdbdb !important;}
.btn_off_disable {user-select: none; pointer-events: none}

.btn_off:hover ,
.btn_01.btn_off:hover,
.btn_02.btn_off:hover,
.btn_03.btn_off:hover,
.btn_04.btn_off:hover {background-color:#dbdbdb !important;border:1px solid #dbdbdb !important; color:#fff !important;}


@media (max-width:801px) {
	.btnwrap a {margin: 0 15px; }
	.btnwrap a:first-child {margin-left:0;}
	.btnwrap a:last-child {margin-right:0;}
	.btn {height:50px; line-height:49px; }
	.btn1 {height:50px; line-height:49px; }
}

@media (max-width:767px) {
	.btnwrap a  {margin:0 10px; height:50px; line-height:49px;}
	.btnwrap a:first-child {margin-left:0;}
	.btnwrap a:last-child {margin-right:0;}

}

@media (max-width:600px) {
	.btnwrap a,
	.mypage .btnwrap a {margin:0 7px; }
	.btnwrap a:first-child {margin-left:0;}
	.btnwrap a:last-child {margin-right:0;}
}

@media (max-width:400px) {
	.btnwrap a,
	.mypage .btnwrap a {margin:0 5px; }
	.btnwrap a:first-child {margin-left:0;}
	.btnwrap a:last-child {margin-right:0;}
}

@media (max-width:320px) {
	.btnwrap a  {font-size:14px;}
}



/* Toast  */
#toast {width:80%; max-width:334px; position:fixed; bottom:100px; left:50%; color:#101010; font-weight: 600; transform:translate(-50%, 10px); background:#fff; transition:opacity .5s, visibility .5s, transform .5s; overflow:hidden; opacity:0.85; visibility:hidden; text-align:center; padding:0 20px; z-index:99999999; line-height:55px; height:56px; border-radius:56px;}
#toast.reveal {opacity:0.85; visibility:visible; transform:translate(-50%, 0);}

@media (max-width:500px) {
	#toast {line-height:49px; height:50px; border-radius:50px;}
}


/* Pagination */
.pagination {position:relative; width:100%; display:flex; justify-content:center; align-items:center;}
.pagination a {display:block; font-size:16px; color:#4d4d4d; padding:0 12px;}
.pagination a.active, .pagination a:hover {font-weight:700; color:#2936d6 ;}
.pagination .first,
.pagination .prev,
.pagination .next,
.pagination .end {position:relative; width:16px; height:16px; padding:0; transition:all 0.3s; text-indent:-9999px;}
.pagination .first, .pagination .end {background:url(/assets/img/common/icon_paging_arr10.png) center center / 16px 16px no-repeat;}
.pagination .prev, .pagination .next {background:url(/assets/img/common/icon_paging_arr1.png) center center / 10px 16px no-repeat;}
.pagination .first, .pagination .prev {margin-right:12px;}
.pagination .next, .pagination .end {margin-left:12px; transform:rotate(180deg);}


/* qucik  */
.quick_wrap{display:flex; flex-direction:column; position:fixed; right:40px; bottom:40px; z-index:13; width:56px }
.quick_wrap .quick_sns_wrap{position:relative; margin:0 0 10px }
.quick_wrap .btn_sns_view{display:block; position:relative; z-index:14; width:56px; height:56px; background:url("/assets/img/common/quick_sns_view.svg") no-repeat -56px 0;  background-size:auto 56px; text-indent:-9999px; }
.quick_wrap .btn_sns_view.on{background:url("/assets/img/common/quick_sns_view.svg") no-repeat 0 0; background-size:auto 56px; }
.quick_wrap .quick_sns_list{display:flex; display:none; flex-direction:column; position:absolute; bottom:28px; z-index:13; padding:8px 12px 32px 12px; background:#f5f5f5; border:1px solid #ccc; border-radius:27px 27px 0 0 ; }
.quick_wrap .quick_sns_list li a{display:block; width:30px; height:30px; margin:4px 0; opacity:0.5; transition:all 0.3s }
.quick_wrap .quick_sns_list li a:hover{opacity:1; }
.quick_wrap .top{width:56px; height:56px; line-height:55px; border:0; opacity:0.5; background:#0a0a0a url(/assets/img/common/icon_top.svg) no-repeat center 50%; background-size:22px; text-align:center; color:#fff; border-radius:50%; text-indent:-9999px; transition:all 0.3s}
.quick_wrap .top:hover {border:1px solid #2936d6 ;  opacity:1; background:#2936d6 url(/assets/img/common/icon_top.svg) no-repeat center 50%; background-size:22px; }

.main #top {display:none !important;   }

@media all and (max-width:801px){
	.quick_wrap{right:20px; bottom:20px; width:50px}
	.quick_wrap .btn_sns_view{width:50px; height:50px; background-position:-50px 0; background-size:auto 50px; }
	.quick_wrap .btn_sns_view.on{background-position: 0; background-size:auto 50px; }
	.quick_wrap .quick_sns_list{padding:6px 9px 25px 9px}
	.quick_wrap .top{width:50px; height:50px; line-height:49px; background-size:40%;}
	.quick_wrap .top:hover {background-size:40%; }
}


/* page */
.page {width:100%; padding:30px 0 0 0;}
.page ul {width:100%;padding:0; display:flex; justify-content:center; align-items:center;}

.page ul li {min-width:20px;text-align:center;}
.page ul li.pre {margin-right:5px; }
.page ul li.next {margin-left:5px; }
.page ul li a {display:inline-block; line-height:30px; height:30px; text-align:center;margin:0 7px; font-weight:400; color:#767676; text-decoration:none; }
.page ul li a span {font-size:0;}
.page ul li a.on {color:#fff; font-weight:600; color:#2936d6 ; border-bottom:1px solid #2936d6 ; }
.page ul li a:hover {color:#505050;}
.page ul li a.on:hover {color:#2936d6 ;}
.page ul li.start a {width:30px; margin:0; background:url(/assets/img/contents/page_start.svg) no-repeat center 50%; background-size:12px; }
.page ul li.pre a {width:30px; margin:0; background:url(/assets/img/contents/page_pre.svg) no-repeat center 50%;background-size:8px; }
.page ul li.next a {width:30px;margin:0; background:url(/assets/img/contents/page_next.svg) no-repeat center 50%;background-size:8px; }
.page ul li.end a {width:30px;margin:0; background:url(/assets/img/contents/page_end.svg) no-repeat center 50%;background-size:12px; }
.page ul li.start:hover a {width:30px; margin:0; background:url(/assets/img/contents/page_start_on.svg) no-repeat center 50%; background-size:12px; }
.page ul li.pre:hover a {width:30px; margin:0; background:url(/assets/img/contents/page_pre_on.svg) no-repeat center 50%;background-size:8px; }
.page ul li.next:hover a {width:30px;margin:0; background:url(/assets/img/contents/page_next_on.svg) no-repeat center 50%;background-size:8px; }
.page ul li.end :hover a {width:30px;margin:0; background:url(/assets/img/contents/page_end_on.svg) no-repeat center 50%;background-size:12px; }


/* nodata */
.nodata {width:100%; text-align:center; padding:130px 0; }
.nodata span {display:block;width:100%; text-align:center; padding:95px 0 0 0; background:url(/assets/img/common/icon_nodata.svg) no-repeat center 0; background-size:88px; color:#1e1e1e; font-size:16px;}
.nodata1 {width:100%; text-align:center; padding:100px 0;text-align:center; border-bottom:1px solid #333;}
.nodata1 span {display: inline-block; padding:0 0 0 34px; background:url(/assets/img/common/icon_nodata022.svg) no-repeat 0 50%; background-size:22px; color:#ccc; font-size:16px; line-height:30px;}

@media (max-width:801px) {
	.nodata span {padding:80px 0 0 0; background:url(/assets/img/common/icon_nodata.svg) no-repeat center 0; background-size:70px;  }
}

@media (max-width:500px) {
	.nodata, .nodata1 {padding:100px 0; }
	.nodata span {padding:70px 0 0 0; background:url(/assets/img/common/icon_nodata.svg) no-repeat center 0; background-size:60px;  font-size:15px;}
}


@keyframes fadein {
	from {opacity: 0;}
	to {opacity: 1; }
}
@-moz-keyframes fadein {
	from {opacity: 0; }
	to {opacity: 1;}
}
@-webkit-keyframes fadein {
	from {opacity: 0; }
	to {opacity: 1;}
}
@-o-keyframes fadein {
	from {opacity: 0; }
	to {opacity: 1;}
}