@import url('animation.css'); /* 애니메이션 */
@import url('../css/library/font/font.css'); /* FONT */
@import url('style.css'); /* WEB&MOBILE */

/* CSS Document ************************************************/
*{margin: 0; padding: 0; font-family: 'Noto Sans KR','Roboto'; font-weight: 400;  }

/***********************************    Reset    ***********************************/
header,footer,section,article,aside,nav,hgroup,details,menu,figure,figcaption{display:block}
html,body{margin:0;padding:0; height: 100%; width: 100%;}
body{font-family:'Noto Sans KR','Roboto','돋움',Dotum,'굴림',Gulim,Tahoma,Verdana,AppleGothic,sans-serif; font-size:14px;line-height:20px; background-color: #222;}
h1,h2,h3,h4,h5,h6{margin:0;padding:0;font-size:14px; font-family: 'Noto Sans KR','Roboto'; font-weight:400; word-break:keep-all;}
p {word-break:keep-all;}
ol,ul{margin:0;padding:0;list-style:none; box-sizing:border-box;}
div,li,dl,dt,dd,form,iframe,p,a,span,blockquote,i,figure{margin:0;padding:0;box-sizing:border-box}
fieldset{margin:0;padding:0;border:0 solid transparent}
legend,hr{display:none}
label{vertical-align:middle}
img{margin:0;padding:0;border:0;vertical-align:top}
table,th,td{margin:0;padding:0; border-collapse: collapse; border-spacing: 0; border: 0;}
input,textarea,select{margin:0;padding:0;background:#fff;font-family:'Noto Sans KR','Roboto','돋움',Dotum,Gulim,Tahoma,Verdana,AppleGothic,sans-serif;font-size:14px;color:#333;vertical-align:middle;border:0;border-radius:0;-webkit-border-radius:0;-webkit-appearance:none;box-sizing:border-box;outline:0;}
caption{visibility:hidden;width:0;height:0;margin:0;padding:0;font-size:0;line-height:0}
a{font-family:'Noto Sans KR','Roboto','돋움',Dotum,Gulim,Tahoma,Verdana,AppleGothic,sans-serif;font-size:14px;margin:0;padding:0;border:0;cursor:pointer;background:0}
a::-moz-focus-inner{border:0;padding:0}em{font-style:normal}
img{vertical-align:top; }
a,button{text-decoration:none;color:#333; }
a.link:hover,button.link:hover{text-decoration:underline}
a,input,button{transition:all 100ms ease-in-out;-o-transition:all 100ms ease-in-out;-ms-transition:all 100ms ease-in-out;-moz-transition:all 100ms ease-in-out;-webkit-transition:all 100ms ease-in-out}
.no-border{border:none!important}
input[type='radio'], input[type='checkbox'] {border:none !important}
select {-webkit-appearance: none;  /* 네이티브 외형 감추기 */-moz-appearance: none; appearance: none;  background-image:url(../image/common/arrow_select01.png); background-repeat:no-repeat; background-position:99% 50%; padding-left:30px; line-height:40px; height:40px; border:1px solid #DDD;}
select::-ms-expand { display: none;}/* IE 10, 11의 네이티브 화살표 숨기기 */

#wrapper { width:100%; height: 100%; }
.main_wrapper::before { position: fixed; left: 0px; top: 0px; bottom: 0; width: 320px; background-color: #111; content: ""; }

/*HEADER************************************************/
.gnb_header { position: absolute; left: 0px; top: 0px; width: 320px; padding: 40px; background-color: #111; z-index: 15; }

.gnb_box { position: relative; margin-bottom: 40px;}
	.gnb_box .logo {
		display: block;
		width: 130px;
		height: 40px;
		background-size: 100%;
		background-image: url(../image/common/logo_img2.png);
		background-repeat: no-repeat;
	}
.gnb_box .total_btn { display: none; position: absolute; top: 0px; right: 0px; width: 50px; height: 50px; background-image:url(../image/common/icon_gnb_top.png); background-repeat:no-repeat; background-size: 100px 50px; background-position: 0px 0px; }

.bottom_menu.scroll-up { opacity: 0; bottom: -60px;}
.bottom_menu { position: fixed; opacity: 1; left: 0px; bottom: 0px; right: 0px; z-index: 10; display: none; flex-wrap: wrap; width: 100%; height: 60px; background-color: #111; transition:all 0.3s  ease-in-out; -webkit-transition:all 0.3s ease -in-out;}
.bottom_menu li { width: 25%; text-align: center; padding: 5px;}
.bottom_menu li span { display: block; width: 100%; font-size: 12px; line-height: 15px; color: #FFF; text-align: center; }
.bottom_menu li i { margin-bottom: 3px;}

@media only screen and (max-width:1024px) {
	.main_wrapper::before { display: none;}
	.gnb_header { position: relative; width: 100%; background-color: none; padding: 0px; background-color: #222;}
	.gnb_box { height: 70px; margin-bottom: 0px; border-bottom: 1px solid #333; background-color: #222; padding: 15px;}
	.gnb_box .total_btn { display: block; top: 10px; right: 10px;}
	.bottom_menu { display: flex;}

	.gnb_box.scroll-up {opacity: 0; top: -70px;}
	.gnb_box { position: fixed; opacity: 1; left: 0px; top: 0px; right: 0px; z-index: 10;}
}

@media only screen and (max-width:767px) {
	.gnb_box .logo { width:110px; height: 34px; }
	.gnb_box { height: 60px; margin-bottom: 0px; border-bottom: 1px solid #333; padding: 12px 15px;}
	.gnb_box .total_btn { top:5px; background-size: 80px 40px; background-position: 5px 5px;}
}

/*MENU************************************************/
.gnb_total { position: relative;}
.gnb_total .close_btn { display: none; position: absolute; top: 0px; right: 0px; width: 50px; height: 50px; background-image:url(../image/common/icon_gnb_top.png); background-repeat:no-repeat; background-size: 100px 50px; background-position: -50px 0px; z-index: 1; }
.gnb_total .menu_info { position: relative; width: 100%; margin-bottom: 40px; border: 1px solid #333; border-radius: 10px; padding: 15px 15px 15px 65px;}
.gnb_total .menu_info>div { position: absolute; left: 15px; top: 15px; width: 40px; height: 40px; border-radius: 50%; overflow: hidden;}
.gnb_total .menu_info p { font-size: 13px; line-height: 20px; color: #1c61ff; }
.gnb_total .menu_info a { position: relative; display: inline-block; font-size: 15px; line-height: 20px; color: #FFF; }
.gnb_total .menu_info a:hover { color: #BBB; }
.gnb_total .menu_info a:first-of-type { padding-right: 10px; margin-right: 10px;}
.gnb_total .menu_info a:first-of-type::before { position: absolute; top: 3px; right: -2px; width: 1px; height: 14px; background-color: #999; content: "";}

.gnb_total .menu_nav { width: 100%;}
.gnb_total .menu_nav li { margin-bottom: 40px;}
.gnb_total .menu_nav li h2 { display: block; width: 100%; font-size: 14px; line-height: 20px; padding-bottom: 15px; margin-bottom: 10px; color: #1c61ff; border-bottom: 1px solid #333; }
.gnb_total .menu_nav li a { display: block; width: 100%; font-size: 18px; line-height: 20px; padding: 10px 0px; color: #FFF; }
.gnb_total .menu_nav li a:hover { color: #BBB;}
.gnb_total .menu_nav li .select { background-color: #222; border: 0px; color: #FFF; font-size: 16px; width: 110px; background-image:url(../image/common/arrow_select02.png); background-position: 95% 50%; border-radius: 10px;}
.gnb_total .menu_nav li .select:focus {background-image:url(../image/common/arrow_select02.png); }
.gnb_total .menu_nav li .copyleft { text-align: left;}

@media only screen and (max-width:1024px) {
	.gnb_total.active {opacity: 1; right: 0px;}

	.gnb_total {opacity: 0; position: fixed; top: 0px; right: -100%; width: 320px; height: 100%; z-index: 15; background-color: #111; padding: 15px 20px; transition:all 0.3s  ease-in-out; -webkit-transition:all 0.3s ease -in-out; }
	.gnb_total .close_btn { display: block; top: 10px; right: 10px; }
	.gnb_total .menu_info { border: 0px; padding: 0px 0px 0px 50px; margin-bottom: 30px;}
	.gnb_total .menu_info>div { left: 0px; top: 0px; }

	.gnb_total .menu_nav li { margin-bottom: 30px;}
	.gnb_total nav { height: calc(100% - 55px); overflow-y: auto;}
}

@media only screen and (max-width:767px) {
	.gnb_total {padding: 15px; }
	.gnb_total .close_btn { top:5px; background-size: 80px 40px; background-position: -35px 5px;}
}

/*FOOTER*/
.footer { width: 100%; background-color: #000; padding: 60px 15px 80px;}
.copyleft { font-size: 14px; color: #AAA; text-align: center;}

@media only screen and (max-width:767px) {
	.footer { width: 100%; background-color: #000; padding: 40px 15px 50px;}
	.copyleft { font-size: 11px; }
}

/* ICON */
.icon_bottom {display:inline-block; width:30px; height:30px; background-image:url(../image/common/icon_bottom.png); background-repeat: no-repeat; background-size:120px 30px; overflow:hidden; text-indent:-9999px; vertical-align:middle; }
.icon_bottom.home { background-position: 0px 0px;}
.icon_bottom.myinfo { background-position: -30px 0px;}
.icon_bottom.order { background-position: -60px 0px;}
.icon_bottom.notice { background-position: -90px 0px;}

.icon_quick { display:inline-block; width:60px; height:60px; background-image:url(../image/common/qucik_icon.png); background-repeat: no-repeat; background-size:660px 60px; overflow:hidden; text-indent:-9999px; vertical-align:middle; }
.icon_quick.type01 { background-position: 0px 0px;}
.icon_quick.type02 { background-position: -60px 0px;}
.icon_quick.type03 { background-position: -120px 0px;}
.icon_quick.type04 { background-position: -180px 0px;}
.icon_quick.type05 { background-position: -240px 0px;}
.icon_quick.type06 { background-position: -300px 0px;}
.icon_quick.type07 { background-position: -360px 0px;}
.icon_quick.type08 { background-position: -420px 0px;}
.icon_quick.type09 { background-position: -480px 0px;}
.icon_quick.type10 { background-position: -540px 0px;}
.icon_quick.type11 { background-position: -600px 0px;}

@media only screen and (max-width:767px) {
	.icon_quick { display:inline-block; width:40px; height:40px; background-image:url(../image/common/qucik_icon.png); background-repeat: no-repeat; background-size:440px 40px; overflow:hidden; text-indent:-9999px; vertical-align:middle; }
	.icon_quick.type01 { background-position: 0px 0px;}
	.icon_quick.type02 { background-position: -40px 0px;}
	.icon_quick.type03 { background-position: -80px 0px;}
	.icon_quick.type04 { background-position: -120px 0px;}
	.icon_quick.type05 { background-position: -160px 0px;}
	.icon_quick.type06 { background-position: -200px 0px;}
	.icon_quick.type07 { background-position: -240px 0px;}
	.icon_quick.type08 { background-position: -280px 0px;}
	.icon_quick.type09 { background-position: -320px 0px;}
	.icon_quick.type10 { background-position: -360px 0px;}
	.icon_quick.type11 { background-position: -400px 0px;}
}



/*INPUT*/
.inp-txt{ width:100%; height:40px; border:1px solid #FFF; font-size:14px; padding:9px 15px; line-height:20px; border-radius: 10px;}
.inp-txt::placeholder { color:#999;}
.inp-txt::-webkit-input-placeholder {color:#999;}
.inp-txt:-ms-input-placeholder {color:#999;}
.inp-txt:focus{color: #222; border-color: #1c61ff;}
.inp-txt[type='text']:disabled { background-color:#EEE; border:1px solid #EEE;}

.inp-txt.both { margin-top:10px;}
.inp-txt.disabled {background-color:#EEE; border:1px solid #EEE;}
.inp-txt.disabled:focus{background-color:#EEE; border:1px solid #EEE;}

.inp-txt[type=password]{font-family:'Roboto',Tahoma,Verdana,AppleGothic,sans-serif;}
.inp-txt[type=password]:-ms-input-placeholder{font-family:'Roboto',Tahoma,Verdana,AppleGothic,sans-serif;}
.inp-txt[type=password]::-webkit-input-placeholder{font-family:'Roboto',Tahoma,Verdana,AppleGothic,sans-serif;}
.inp-txt[type=password]:-moz-placeholder{font-family:'Roboto',Tahoma,Verdana,AppleGothic,sans-serif;}
.inp-txt[type=password]::-moz-placeholder{font-family:'Roboto',Tahoma,Verdana,AppleGothic,sans-serif;}
.inp-txt[type=password]::placeholder {font-family:'Noto Sans KR','Roboto',Tahoma,Verdana,AppleGothic,sans-serif;}

/*INPUT CHEC*/
.inp_true, .inp_false { position: relative; }
.inp_true .inp-txt, .inp_false .inp-txt { padding-right: 40px;}
.inp_true::before, .inp_false::before { position: absolute; width: 20px; height: 20px; border-radius: 50%; top: 10px; right: 10px; content: ""; background-size: 16px; background-repeat: no-repeat; background-position: center center; }
.inp_true::before {background-color: #1c61ff; background-image:url(../image/common/icon_check_join_on.png);}
.inp_false::before {background-color: #f40000; background-image:url(../image/common/icon_check_del.png);}

/*SELECT*/
.select {display:inline-block; width:100%; height:40px; border:1px solid #FFF; font-size:14px; color: #666; padding-left:15px;  background-image:url(../image/common/arrow_select01.png); background-size: 24px; }
.select:focus {color:#222; }

/*ALERT TEXT*/
span.alert_text { position:relative; padding-left:28px; color:#ed1c24; font-size:15px; line-height:20px; display:inline-block;}
span.alert_text::after { position:absolute; width:18px; height:18px; left:0px; top:0px; line-height:16px; border-radius:50%; border: 1px solid #ed1c24; content:"!"; color:#ed1c24; font-weight:600; text-align:center;}
span.alert_text.both { margin-top:10px;}
span.alert_text.black { color:#222;}
span.alert_text.black::after { border: 1px solid #222; color:#222;}
span.alert_text.blue { color:#1c61ff;}
span.alert_text.blue::after { border: 1px solid #1c61ff; color:#1c61ff;}
span.alert_text.grey { color:#999;}
span.alert_text.grey::after { border: 1px solid #999; color:#999;}

span.check_text { position:relative; padding-left:28px; color:#1c61ff; font-size:15px; line-height:20px; display:inline-block;}
span.check_text::after { position:absolute; width:18px; height:18px; left:0px; top:0px; line-height:16px; border-radius:50%; border: 1px solid #1c61ff; content:""; background-image:url(../image/common/icon_check_join.png); background-repeat: no-repeat; background-size: 18px; }
span.check_text.both { margin-top:10px;}

@media only screen and (max-width:767px) {
	span.alert_text {padding-left:25px; font-size:14px; }
	span.alert_text::after { width:16px; height:16px; top:3px; line-height:14px; }

	span.check_text {padding-left:25px; font-size:14px; }
	span.check_text::after { width:16px; height:16px; top:3px; line-height:14px; background-size: 16px; }
}

/*FONT COLOR*/
span.font_blue {color: #1c61ff;}
span.font_red {color: #ed1c24;}
span.font_grey {color: #999;}
span.font_black {color: #222;}

/* CHECK BOX */
input[type="checkbox"].check_box {display: none;}
input[type="checkbox"].check_box + label {display: inline-block; padding-left: 30px; font-size: 15px; line-height: 22px; height: 22px; margin-right: 10px; cursor: pointer; background-image:url(../image/common/icon_checkbox.png); background-repeat: no-repeat; background-position: 0px 0px; background-size: 22px; color: #888; }
input[type="checkbox"].check_box:checked + label { background-image:url(../image/common/icon_checkbox_on.png); color: #222;}
input[type="checkbox"].check_box + label:last-child {margin-right: 0;}
input[type="checkbox"].check_box.both + label { margin-top: 10px;}

/* RADIO BOX */
input[type="radio"].radio_box {display: none;}
input[type="radio"].radio_box + label {display: inline-block; padding-left: 30px; font-size: 15px; line-height: 22px; height: 22px; margin-right: 10px; cursor: pointer; background-image:url(../image/common/icon_radio.png); background-repeat: no-repeat; background-position: 0px 0px; background-size: 22px; color: #888;}
input[type="radio"].radio_box:checked + label {background-image:url(../image/common/icon_radio_on.png); color: #222;}
input[type="radio"].radio_box + label:last-child {margin-right: 0;}
input[type="radio"].radio_box.both + label { margin-top: 10px;}

/*TAB*/
.tab_menu { position: relative; background-color: #666666; border-radius: 25px; overflow: hidden; z-index: 10; display: flex; flex-wrap: wrap; margin-bottom: 30px;}
.tab_menu a { position: relative; display: block; height: 50px; font-size: 18px; color: #FFF; line-height: 50px; text-align: center; z-index: 2; transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; }
.tab_menu a.active { color: #FFF;}
.tab_menu:after { position:absolute; height: 50px; background-color: #1c61ff; border-radius: 25px; transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; content: "";}

.tab_menu.set02.on1:after, .tab_menu.set03.on1:after, .tab_menu.set04.on1:after {left:0px;}

.tab_menu.set02 a{ width:50%; }
.tab_menu.set02:after { width: 50%;}
.tab_menu.set02.on2:after {left:50%;}

.tab_menu.set03 a{ width:33.3%; }
.tab_menu.set03:after { width: 33.3%;}
.tab_menu.set03.on2:after {left:33.3%;}
.tab_menu.set03.on3:after {left:66.6%;}

.tab_menu.set04 a{ width:25%; }
.tab_menu.set04:after { width: 25%;}
.tab_menu.set04.on2:after {left:25%;}
.tab_menu.set04.on3:after {left:50%;}
.tab_menu.set04.on4:after {left:75%;}

@media only screen and (max-width:767px) {
	.tab_menu { margin-bottom: 20px;}
	.tab_menu a { font-size: 16px;}
}

#tab_con>div { display: none;}
#tab_con>ul { display: none;}

/*BTN SET*/
.btn {display:inline-block; width:100%; height:40px;line-height:38px; vertical-align:middle; text-align:center; font-size:14px; color:#FFF; font-weight: 400; border-radius: 10px;}
.btn.btn-sm{font-size:13px;height:30px;line-height:28px; border-radius: 5px;}
.btn.btn-lg{font-size:16px;height:50px;line-height:48px; }
.btn.btn-in { width:110px; margin-left:10px;}
.btn.btn-block{display:block}

.btn.btn-ygrey{border:1px solid #BBB;color:#BBB;}
.btn.btn-ygrey.btn-full{background-color:#BBB; color:#FFF;}
.btn.btn-ygrey:hover { background-color:#f4f4f4; }
.btn.btn-ygrey.btn-full:hover {background-color:#AAA; border-color:#AAA; color:#FFF;}

.btn.btn-grey{border:1px solid #666;color:#666;}
.btn.btn-grey.btn-full{background-color:#666; color:#FFF;}
.btn.btn-grey:hover { background-color:#f4f4f4; }
.btn.btn-grey.btn-full:hover {background-color:#555; border-color:#555; color:#FFF;}

.btn.btn-blue{border:1px solid #1c61ff; color:#1c61ff;}
.btn.btn-blue.btn-full{background-color:#1c61ff; color:#FFF;}
.btn.btn-blue:hover {  background-color:#f4f4f4; }
.btn.btn-blue.btn-full:hover {background-color:#0052da; border-color:#0052da; color:#FFF;}

.btn.btn-black{border:1px solid #222; color:#222;}
.btn.btn-black.btn-full{background-color:#222; color:#FFF;}
.btn.btn-black:hover { background-color:#f4f4f4; }
.btn.btn-black.btn-full:hover {background-color:#111; border-color:#111; color:#FFF;}

.btn.btn-red{border:1px solid #ed1c24; color:#ed1c24;}
.btn.btn-red.btn-full{background-color:#ed1c24; color:#FFF;}
.btn.btn-red:hover {  background-color:#f4f4f4; }
.btn.btn-red.btn-full:hover {background-color:#b40007; border-color:#b40007; color:#FFF;}

.btn.btn-white{border:1px solid #FFF; color:#FFF;}
.btn.btn-white.btn-full{background-color:#FFF; color:#222;}
.btn.btn-white:hover {  background-color:#f4f4f4; }
.btn.btn-white.btn-full:hover {background-color:#f4f4f4; }

div.btn-set {position:relative;overflow:hidden; text-align:center;}
div.btn-set .btn { margin-left:10px;}
div.btn-set .btn:first-child { margin-left:0px;}
div.btn-set .btn.left { float:left; margin-left:0px; margin-right:10px;}
div.btn-set .btn.right { float:right;}
div.btn-set .btn.right:first-child { margin-left:10px;}
div.btn-set .btn.disabled { background-color:#999; color:#FFF; cursor: default;}
div.btn-set .btn.disabled:hover {background-color:#999; color:#FFF;}

ul.btn-set {position:relative;overflow:hidden; text-align:center;}
ul.btn-set>li {float: left; padding: 0px 10px;}
ul.btn-set>li:first-child { padding-left: 0px;}
ul.btn-set>li:last-child { padding-right: 0px;}


ul.btn-set.set02>li { width: 50%;}
ul.btn-set.set03>li { width: 33.3%;}
ul.btn-set.set04>li { width: 25%;}
ul.btn-set.set05>li { width: 20%;}
ul.btn-set.set06>li { width: 16.6%;}
ul.btn-set.set07>li { width: 14.2%;}
ul.btn-set.set08>li { width: 12.5%;}

.sub_content ul.btn-set.set02 { width: 520px;}

@media only screen and (max-width:1024px) {
	.sub_content ul.btn-set.set02 { width: 100%;}
}

/*INPUT SET*/
.id-set {position:relative;overflow:hidden}
.id-set li {width:100%; float:left; }
.id-set li:nth-child(1) { width:70%; }
.id-set li:nth-child(2) { width:30%; padding-left:10px; }

.email-set {position:relative;overflow:hidden;}
.email-set li { width:100%; float:left; }
.email-set li:nth-child(1) { width:46%}
.email-set li:nth-child(2) { width:8%; font-size: 16px; line-height:40px; color: #FFF; text-align:center; }
.email-set li:nth-child(3) { width:46%}
.email-set li:nth-child(4) { width: 100%; margin-top: 20px;}

.email-a-set {position:relative;overflow:hidden;}
.email-a-set li { width:100%; float:left; }
.email-a-set li:nth-child(1) { width:46%}
.email-a-set li:nth-child(2) { width:8%; font-size: 16px; line-height:40px; color: #FFF; text-align:center; }
.email-a-set li:nth-child(3) { width:46%}
.email-a-set li:nth-child(4) { width:70%; margin-top: 20px;}
.email-a-set li:nth-child(5) { width:30%; padding-left:10px; margin-top: 20px;}

.email-ok-set {position:relative;overflow:hidden; margin-top: 20px;}
.email-ok-set li {width:100%; float:left; }
.email-ok-set li:nth-child(1) { width:70%; }
.email-ok-set li:nth-child(2) { width:30%; padding-left:10px; }

/*SEARCH BOX*/
.search_box { width: 100%; background-color: #333;}
.search_box:hover { background-color: #444;}
.search_box a { display: block; width: 100%; max-width: 1080px; padding: 20px 40px; background-image:url("../image/common/icon_search.png"); background-repeat: no-repeat; background-position: 94% 50%; background-size: 30px;}
.search_box a span { position: relative; font-size: 18px; line-height: 20px; color: #FFF; font-weight:400; padding-right: 15px; margin-right: 15px; }
.search_box a span::before { position: absolute; top: 50%; transform: translateY(-50%); right: -2px; width: 4px; height: 4px; background-color: #FFF; border-radius: 50%; content: "";}
.search_box a span:last-child { padding: 0px; margin: 0px;}
.search_box a span:last-child::before { display: none;}

@media only screen and (max-width:1024px) {
	.search_box a { padding: 20px 30px ;}
	.search_box a span { font-size: 17px; padding-right: 13px; margin-right: 13px; }
}

@media only screen and (max-width:767px) {
	.search_box a { padding: 15px 15px; background-position: 95% 50%;}
	.search_box a span { font-size: 16px; padding-right: 10px; margin-right: 10px; }
}

/*SEARCH TREE BOX*/
.search_tree_view {width: 100%; background-color: #333;}
.search_tree_view ul { position: relative; display: flex; flex-wrap: wrap; width: 100%; max-width: 1080px; padding-left: 40px; padding-right: 100px;}
.search_tree_view ul li:nth-child(1) { width: 30%; padding-right: 10px;}
.search_tree_view ul li:nth-child(2) { width: 70%;}
.search_tree_view ul li:nth-child(3) { position: absolute; top: 0px; right: 40px; width: 60px; height: 60px;}
.search_tree_view .select { background-color: rgba(0,0,0,0.0); border: 0px; color: #888; font-size: 18px; height: 60px; line-height: 60px;}
.search_tree_view .select option { color: #222;}
.search_tree_view .inp-txt { background-color: #333; border: 0px; color: #FFF; font-size: 18px; height: 60px; line-height: 60px;}
.search_tree_view a { display: block; width: 60px; height: 60px; background-image:url("../image/common/icon_search.png"); background-repeat: no-repeat; background-size: 30px; background-position: center center;}
.search_tree_view a:hover { background-color: #444;}

@media only screen and (max-width:1024px) {
	.search_tree_view ul { padding-left: 30px; padding-right: 90px;}
	.search_tree_view ul li:nth-child(3) { right: 30px; }
	.search_tree_view .select { font-size: 17px;}
	.search_tree_view .inp-txt { font-size: 17px;}
}

@media only screen and (max-width:767px) {
	.search_tree_view ul { padding-left: 15px; padding-right: 65px;}
	.search_tree_view ul li:nth-child(3) { right: 15px; width: 50px; height: 50px; }
	.search_tree_view .select { font-size: 16px; height: 50px; line-height: 50px;}
	.search_tree_view .inp-txt { font-size: 16px; height: 50px; line-height: 50px;}
	.search_tree_view a { width: 50px; height: 50px; }
}


/* Layer_POPUP */
.layer_pop_wrapper { opacity: 0; position: fixed; left: 0px; top: 0px; width:100%; height:100%; background-color:rgba(0,0,0,0.65); z-index: 100; visibility: hidden; transition:all 0.3s  ease-in-out; -webkit-transition:all 0.3s ease -in-out;}
.layer_pop_wrapper.active { opacity: 1; visibility: visible; z-index: 100; }
.layer_pop_wrapper.active .layer_popup .pop_title .close {opacity: 1; transform:rotate(0deg);}
.layer_popup { position: relative; display: inline-flex; flex-direction: column; min-width: 600px; max-width: 1100px; min-height: 100px; max-height: 80%; left: 50%; top: 50%; background-color:#FFF; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); padding:30px 40px 40px; border-radius:15px;}
.layer_popup .pop_title { position: relative; width: 100%; }
.layer_popup .pop_title h2 {width: 100%; font-size: 22px; line-height: 30px; padding: 10px 60px 20px 0px; text-align: left; border-bottom:solid 1px #222; word-break: keep-all; box-sizing: border-box; }
.layer_popup .pop_title .close { position: absolute; top: 0px; right: 0px; display: block; width: 50px; height: 50px; background-image:url("../image/common/icon_pop_close.png"); background-repeat: no-repeat; background-position: top center; opacity: 0; transform:rotate(45deg); transition:all 0.3s  ease-in-out; -webkit-transition:all 0.3s ease -in-out; z-index: 10;}
.layer_popup .pop_title.bb_none h2 {border-bottom:none;}
.layer_popup .pop_content { height: calc(100% - 70px); overflow-y: auto; padding: 20px 0px;}

@media only screen and (max-width:767px) {
	.layer_popup { width: 92%; min-width: 92%; padding:15px 15px 20px; border-radius:10px;}

	.layer_popup .pop_title h2 {font-size: 18px; line-height: 20px; padding: 10px 50px 15px 0px; }
	.layer_popup .pop_title .close { width: 40px; height: 40px; background-size: 40px 80px;}
	.layer_popup .pop_title.bb_none h2 {border-bottom:none;}
	.layer_popup .pop_content { padding: 15px 0px;}
}

/* search_popup */
.search_popup>a.close{ position: fixed; left: 0px; top: 0px; width:100%; height:100%; z-index: 1;}
.search_popup.active .layer_popup .close {opacity: 1; transform:rotate(0deg);}
.search_popup .layer_popup { z-index: 10; max-width: 600px; min-width: 600px;}
.search_popup .layer_popup .close { position: absolute; top: 10px; right: 10px; display: block; width: 50px; height: 50px; background-image:url("../image/common/icon_pop_close.png"); background-repeat: no-repeat; background-position: top center; opacity: 0; transform:rotate(45deg); transition:all 0.3s  ease-in-out; -webkit-transition:all 0.3s ease -in-out; z-index: 10;}
.search_popup .layer_popup h2 { font-size:20px; line-height: 20px; color: #1c61ff; font-weight:500; margin-bottom: 20px; }

.search_radio { display: flex; flex-wrap: wrap; margin-bottom: 30px;}
.search_radio.set02 input[type="radio"].radio_tab + label{ width: 50%;}
.search_radio.set03 input[type="radio"].radio_tab + label{ width: 33.3%;}
.search_radio.set03 input[type="radio"].radio_tab + label:last-of-type{ width: 33.4%;}
.search_radio.set04 input[type="radio"].radio_tab + label{ width: 25%;}
.search_radio.set05 input[type="radio"].radio_tab + label{ width: 20%;}
.search_radio.set06 input[type="radio"].radio_tab + label{ width: 16.6%;}

input[type="radio"].radio_tab + label { float: left; display: inline-block; width: 100%; height: 40px; font-size: 14px; line-height: 20px; cursor: pointer; color: #222; text-align: center; background-color: #DDD; border-right: 1px solid #FFF; padding: 10px 0px; box-sizing: border-box;}
input[type="radio"].radio_tab:checked + label { color: #FFF; background-color: #333;}
input[type="radio"].radio_tab + label:last-child { border-right: 0px;}

.search_calendar_type.active { visibility: visible; height: auto; margin-top: 15px; opacity: 1;}
.search_calendar_type { visibility: hidden; display: flex; opacity: 0; flex-wrap: wrap; background-color: #DDD; width: 100%; height: 0px; overflow: hidden; transition:all 0.3s  ease-in-out; -webkit-transition:all 0.3s ease -in-out; }
.search_calendar_type li:nth-child(1), .search_calendar_type li:nth-child(3) { width: 46%;}
.search_calendar_type li:nth-child(2) { width: 8%; font-size: 14px; line-height: 40px; color: #666; text-align: center;}
.search_calendar_type li:nth-child(4) {position: absolute; top: 0px; right: 0px; width: 40px;}
.search_calendar_type .inp-txt { background-color: #DDD; border-radius: 0px; border: 0px;}
.search_calendar_type .inp-txt:focus { color: #1c61ff;}

@media only screen and (max-width:767px) {
	.search_popup.active .layer_popup .close {opacity: 0; transform:rotate(0deg); visibility: hidden;}
	.search_popup.active .layer_popup { opacity: 1; bottom: 0px; }
	.search_popup .layer_popup { position: absolute; top: auto; left: 0px; width: 100%; max-width: 100%; min-width: 100%; border-radius: 20px 20px 0px 0px; opacity: 0; bottom: -100%; transition:all 0.3s  ease-in-out; -webkit-transition:all 0.3s ease -in-out; transform:translate(0%, 0%); -webkit-transform:translate(0%, 0%);}
	.search_popup .layer_popup h2 { font-size:16px; margin-bottom: 15px; }

	input[type="radio"].radio_tab + label { font-size: 13px;}
}
.search_select_type { display: flex; flex-wrap: wrap; background-color: #DDD; width: 100%; margin-bottom:30px}
.search_select_type li { width: 70%;}
.search_select_type li:nth-child(1) { width: 30%;}
.search_select_type li .select { background-color: rgba(0,0,0,0.0); border: 0px; }
.search_select_type li .select option { color: #222;}
.search_select_type li .inp-txt { background-color: #333; border: 0px; color: #222; background-color: #DDD; }


/* 약관 */
.terms>div {margin-bottom:60px; }
.terms>div.box_grey {width: 100%; padding:30px; border: 1px solid #ddd; }
.terms>div.box_grey>h2 {margin-bottom: 0; }
.terms>div.box_grey>a { display: block; text-align: left; }
.terms>div a { font-size:16px; line-height: 20px; color: #1c61ff; font-weight:500; }
.terms>div>h2 {font-size:20px; line-height: 30px; color: #000; text-align: left; font-weight:500; margin-bottom: 30px; }
.terms>div>h3 {font-size:16px; line-height: 25px; color: #666; text-align: left; font-weight:400; margin-bottom:15px; word-break: keep-all; }
.terms>div>h4 {font-size:16px; line-height: 25px; color: #000; text-align: left; font-weight:400; margin-bottom:15px; }
.terms>div>p {font-size:16px; line-height: 25px; color: #666; text-align: left; font-weight:400;   margin-bottom:15px; word-break:keep-all; }
.terms>div ol {padding-left:15px; margin-bottom:20px; }
.terms>div ol>li {font-size:16px; line-height:25px; color: #666; text-align: left; font-weight:400; word-break:keep-all; list-style:decimal; margin-bottom: 15px;}
.terms>div ul {padding-left:15px; margin-bottom:20px; }
.terms>div ul>li {font-size:16px; line-height:25px; color: #666; text-align: left; font-weight:400; word-break:keep-all; list-style: lower-alpha; margin-bottom: 15px;}
.terms>div ul.disc>li {list-style: disc;}
.terms>div ul.l_roman>li {list-style: lower-roman;}
.terms>div ul.u_roman>li {list-style: upper-roman;}
.terms>div>.view_table01 {margin: 30px 0 20px; }
.terms>div>.view_table01 th, .terms>div>.view_table01 td {font-size: 16px; line-height: 25px; color: #666; text-align: center; padding: 15px 0; border-bottom: 1px solid #ddd; }
.terms>div>.view_table01 th {font-size: 16px; color: #333; font-weight: 500; background-color: #f4f4f4; border-top: 1px solid #ddd; }
.terms>div>.view_table01 td { font-size: 14px; border-right: 1px solid #ddd; }
.terms>div>.view_table01 td:last-child {border-right: 0; }

@media only screen and (max-width:767px) {
	.terms>div {margin-bottom:30px; }
	.terms>div.box_grey {padding:20px 15px; }
	.terms>div a { font-size:12px; line-height: 20px; color: #1c61ff; font-weight:500; }
	.terms>div>h2 {font-size:15px; line-height: 20px; margin-bottom: 15px; }
	.terms>div>h3 {font-size:12px; line-height: 20px; }
	.terms>div>h4 {font-size:12px; line-height: 20px; }
	.terms>div>p {font-size:12px; line-height: 20px; }
	.terms>div ol>li {font-size:12px; line-height:20px;}
	.terms>div ul>li {font-size:12px; line-height:20px;}
	.terms>div>.view_table01 {margin: 20px 0 10px; }
	.terms>div>.view_table01 th, .terms>div>.view_table01 td {font-size: 12px; line-height: 20px;}
	.terms>div>.view_table01 th {font-size: 12px; }
	.terms>div>.view_table01 td { font-size: 12px; }
}


/*CONTENT*/
.main_wrapper .content { position: relative; padding-left: 320px;}
.content { width: 100%; }
.sub_content { width: 100%; padding: 40px; max-width: 1080px;}

@media only screen and (max-width:1024px) {
	.main_wrapper .content { padding: 0px 0px 0px;}
	.sub_content { padding: 30px;}
}

@media only screen and (max-width:767px) {
	.sub_content { padding: 20px 15px;}
}

/*MAIN*/
.content.main { display: flex; flex-wrap: wrap; width: 100%; min-height: 100%; }
.content.main>div { width: 50%;}
.content.main .main_content1 { position: relative; border-right: 1px solid #333; overflow: hidden;}
.content.main .main_content2 { padding: 40px;}
.content.sub { width: 100%; }

@media only screen and (max-width:1400px) {
	.content.main { display: block; flex-wrap: nowrap;}
	.content.main>div { width: 100%;}
}
@media only screen and (max-width:1024px) {
	.content.main { padding-top: 70px;}
	.content.main .main_content2 { padding: 40px 40px 80px;}
	.content.sub { padding-top: 70px; padding-bottom: 70px;}
}
@media only screen and (max-width:767px) {
	.content.main { padding-top: 60px;}
	.content.main .main_content2 { padding: 20px 15px 60px;}
	.content.sub { padding-top: 60px;}
}

/*SUB*/
.sub .sub_title { width: 100%; padding: 40px 40px; border-bottom: 1px solid #333;}
.sub .sub_title>h2 {font-size: 40px; line-height: 40px; color: #FFF; font-weight: 500; text-align: left;}

@media only screen and (max-width:1024px) {
	.sub .sub_title { padding: 30px 30px;}
	.sub .sub_title>h2 {font-size: 36px;}
}
@media only screen and (max-width:767px) {
	.sub .sub_title { padding: 20px 15px;}
	.sub .sub_title>h2 {font-size: 28px;}
}

/*SUB MENU*/
.sub_menu { width: 100%; max-width: 1080px; padding: 30px 40px;}
.sub_menu>div {position: relative; display: flex; width: 100%; background-color: #666; border-radius: 25px; overflow: hidden; }
.sub_menu a { display: block; width:100%; height: 50px; font-size: 18px; color: #FFF; line-height: 50px; text-align: center; border-radius: 25px;}
.sub_menu a.active { color: #FFF; background-color:#1c61ff ;}
.sub_menu.set02 a { width: 50%;}
.sub_menu.set03 a { width: 33.3%;}
.sub_menu.set03 a:last-child { width: 33.4%;}
.sub_menu.set04 a { width: 25%;}

@media only screen and (max-width:1024px) {
	.sub_menu { padding: 25px 30px;}
	.sub_menu a { font-size: 17px; }
}
@media only screen and (max-width:767px) {
	.sub_menu { padding: 20px 15px;}
	.sub_menu a { font-size: 16px; }
}

/*TABLE LIST*/
.table_list_box { width: 100%; }
.table_list_box>h2 {font-size:20px; line-height: 20px; color: #1c61ff; font-weight:500; margin-bottom: 40px; }
.table_title { width: 100%; background-color: #111; border-bottom:1px solid #333; padding: 10px 20px; background-image:url("../image/common/arrow_select02.png"); background-repeat:no-repeat; background-position:98% 50%; background-size: 22px; }
.table_title h2 { font-size:20px; line-height: 30px; color: #FFF; text-align: left; }
.table_th { display: flex; flex-wrap: wrap; width: 100%; background-color: #111;}
.table_th p { width: 100%; font-size:16px; line-height: 20px; color: #888; font-weight:500; word-break: keep-all; padding: 20px 5px; text-align: center; }
.table_th.set02 p, .table_list.set02 p { width: 50%;}
.table_th.set03 p, .table_list.set03 p { width: 33.3%;}
.table_th.set04 p, .table_list.set04 p { width: 25%;}
.table_th.set05 p, .table_list.set05 p { width: 20%;}
.table_th.set06 p, .table_list.set06 p { width: 16.6%;}
.table_th.set07 p, .table_list.set07 p { width: 14.4%;}
.table_th.set08 p, .table_list.set08 p { width: 12.5%;}
.table_list p span { display: none; position: absolute; left: 0px; top: 50%; transform: translateY(-50%); width: 30%; font-size:13px; line-height: 20px; color: #888; font-weight:400; text-align: left; word-break: break-all; }

.table_list { width: 100%; margin-bottom: 40px; border-left: 1px solid #333; border-right: 1px solid #333;}
.table_list li { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; width: 100%; border-bottom: 1px solid #333; }
.table_list li p { position: relative; font-size:15px; line-height: 20px; color: #FFF; font-weight:400; word-break: break-all; text-align: center; padding: 15px 5px; }
.table_list li p.total_p { color: #1c61ff;}
.table_list li.total_li, .table_list li.total_pay, .table_list li.order_pay { background-color: #333; padding: 5px 0px;}
.table_list>li.no_data {width: 100%; text-align: center; padding: 120px 0px; font-size: 18px; color: #FFF; }

.table_list.set04 li.total_pay .title_pay { width: 50%;}
.table_list.set05 li.total_pay .title_pay { width: 60%;}
.table_list.set06 li.total_pay .title_pay { width: 66.4%;}
.table_list.set07 li.total_pay .title_pay { width: 72%;}
.table_list.set08 li. .title_pay { width: 75%;}

.order_pay p span { display: block; position: relative; width: 100%; left: auto; top: auto; text-align: center;}
.table_list .order_pay.set02 p { width: 50%;}
.table_list .order_pay.set03 p { width: 33.3%;}
.table_list .order_pay.set04 p { width: 25%;}
.table_list .order_pay.set05 p { width: 20%;}
.table_list .order_pay.set06 p { width: 16.6%;}
.table_list .order_pay.set07 p { width: 14.4%;}
.table_list .order_pay.set08 p { width: 14.4%;}

@media only screen and (max-width:1024px) {
	.table_list_box>h2 { margin-bottom: 30px; }
	.table_title h2 { font-size:18px; line-height: 25px; }
	.table_list { margin-bottom: 30px;}
}
@media only screen and (max-width:767px) {
	.table_list_box>h2 { font-size: 16px; margin-bottom: 20px; }
	.table_title { margin-bottom: 15px;}
	.table_title h2 { font-size:16px; line-height: 20px; }
	.table_th { display: none;}
	.table_list { margin-bottom: 20px; border-left: 0px; border-right: 0px; }
	.table_list p span { display: block;}
	.table_list li { padding-bottom: 12px; margin-bottom: 15px;}
	.table_list li p { padding: 2px 0px 2px 30%; line-height: 20px; text-align: right;}
	.table_list li p.data { text-align: left; font-size: 17px; padding-left: 0px;}
	.table_list li p.total_p { font-size: 16px; }
	.table_list li p.title_li, .table_list li p.title_pay { text-align: left; font-size: 17px; padding-left: 0px;} 
	.table_list.set02 p,.table_list.set03 p,.table_list.set04 p,.table_list.set05 p,.table_list.set06 p,.table_list.set07 p,.table_list.set08 p { width: 100%;}
	.table_list.set04 li.total_pay .title_pay, .table_list.set05 li.total_pay .title_pay, .table_list.set06 li.total_pay .title_pay, .table_list.set07 li.total_pay .title_pay, .table_list.set08 li.total_pay .title_pay { width: 100%;}
	.table_list .order_pay.set02 p,	.table_list .order_pay.set03 p,	.table_list .order_pay.set04 p,	.table_list .order_pay.set05 p,	.table_list .order_pay.set06 p,	.table_list .order_pay.set07 p,	.table_list .order_pay.set08 p { width: 100%;}
	.table_list li.total_li, .table_list li.total_pay, .table_list li.order_pay { padding: 15px 15px; border-radius: 10px;}
	.table_list>li.no_data {padding: 60px 0px; font-size: 16px;}
	.order_pay p span { display: inline-block; position: absolute; width: auto; left: 0px; top: 50%; text-align: :left;}

}

.board_list { width: 100%; margin-bottom: 40px; }
.board_list li { position: relative; width:100%; padding-bottom: 30px; margin-bottom: 30px; border-bottom: 1px solid #333; cursor: pointer; background-image:url("../image/common/icon_arrow_w.png"); background-repeat:no-repeat; background-position:98% 35%; background-size: 40px 40px; padding-right: 5%; }
.board_list li:hover {background-image:url("../image/common/icon_arrow_w_on.png");}
.board_list li:hover h2 { color: #DDD;}
.board_list li h2 {display: block; width: 100%; font-size: 22px; line-height: 30px; color: #FFF; font-weight: 500; word-break: keep-all; margin-bottom: 10px;}
.board_list li p {display: inline-block; font-size: 16px; line-height: 20px; color: #888; font-weight: 400; margin-right: 30px;}
.board_list li p.data { position: relative;}
.board_list li p.data::before { position: absolute; top: 5px; right: -17px; width: 1px; height: 14px; background-color: #888; content: "";}
.board_list li p.true { color: #1c61ff;}
.board_list li p.false { color: #ed1c24;}
.board_list li p.category { margin-bottom: 5px;}
.board_list li p:last-child { margin-right: 0px;}
.board_list>li.no_data {width: 100%; text-align: center; padding: 120px 0px; font-size: 18px; color: #FFF; background-image: none; cursor: default;}

.board_title { width: 100%; margin-bottom: 40px; }
.board_title li { position: relative; width:100%; padding-bottom: 30px; margin-bottom: 30px; border-bottom: 1px solid #333; }
.board_title li h2 {display: block; width: 100%; font-size: 22px; line-height: 30px; color: #FFF; font-weight: 500; word-break: keep-all; margin-bottom: 10px;}
.board_title li p {display: inline-block; font-size: 16px; line-height: 20px; color: #888; font-weight: 400; margin-right: 30px;}
.board_title li p.data { position: relative;}
.board_title li p.data::before { position: absolute; top: 5px; right: -17px; width: 1px; height: 14px; background-color: #888; content: "";}
.board_title li p.true { color: #1c61ff;}
.board_title li p.false { color: #ed1c24;}
.board_title li p:last-child { margin-right: 0px;}

@media only screen and (max-width:1024px) {
	.board_list { margin-bottom: 30px; }
	.board_list li { padding-bottom: 20px; margin-bottom: 20px; }
	.board_list li h2 {font-size: 20px; line-height: 25px; margin-bottom: 5px;}
	.board_list li p {font-size: 15px; margin-right: 26px;}
	.board_list li p:last-child { margin-right: 0px;}
	.board_list li p.data::before { right: -14px; }

	.board_title { margin-bottom: 30px; }
	.board_title li { padding-bottom: 20px; margin-bottom: 20px; }
	.board_title li h2 {font-size: 20px; line-height: 25px; margin-bottom: 5px;}
	.board_title li p {font-size: 15px; margin-right: 26px;}
	.board_title li p:last-child { margin-right: 0px;}
	.board_title li p.data::before { right: -14px; }
}
@media only screen and (max-width:767px) {
	.board_list { margin-bottom: 20px; }
	.board_list li { padding-bottom: 15px; margin-bottom: 15px; }
	.board_list li h2 {font-size: 18px; line-height: 20px; margin-bottom: 5px;}
	.board_list li p {font-size: 14px; margin-right: 20px;}
	.board_list li p:last-child { margin-right: 0px;}
	.board_list li p.data::before { right: -11px; }
	.board_list>li.no_data {padding: 60px 0px; font-size: 16px;}

	.board_title { margin-bottom: 20px; }
	.board_title li { padding-bottom: 15px; margin-bottom: 15px; }
	.board_title li h2 {font-size: 18px; line-height: 20px; margin-bottom: 5px;}
	.board_title li p {font-size: 14px; margin-right: 20px;}
	.board_title li p:last-child { margin-right: 0px;}
	.board_title li p.data::before { right: -11px; }
}

/*CALEDER*/
.inp-txt.calendar_datepicker { padding-right:40px;  background-image:url("../image/common/icon_calender.png"); background-repeat:no-repeat; background-position:95% 50%; background-size: 22px 22px; }
.inp-txt.calendar_datepicker:focus { background-image:url("../image/common/icon_calender_on.png");}

body .ui-datepicker{border-radius:0; border:1px solid #222; padding:0; background:#fff; margin-left: -1px;}
body .ui-datepicker .ui-datepicker-title{position: relative;padding:3px 0 0;box-sizing: border-box;height: 50px;}
body .ui-datepicker .ui-datepicker-title:before { position:absolute; left:86px; top:16px; width:1px; height:15px; background-color:#CCC; content:""; }
body .ui-datepicker select.ui-datepicker-month {border:0; width:55px; padding:0; }
body .ui-datepicker select.ui-datepicker-year{border:0; width:60px; padding:0; margin-right:15px; }

body .ui-datepicker .ui-datepicker-header{background:#fff; border:0; padding:0}
body .ui-datepicker .ui-datepicker-next{right:2px !important; top:11px !important; border-radius: 0px;}
body .ui-datepicker .ui-datepicker-prev{left:2px !important; top:11px !important; border-radius: 0px;}
body .ui-datepicker .ui-datepicker-next-hover{right:20px; top:11px}
body .ui-datepicker .ui-datepicker-prev-hover{left:20px; top:11}

body .ui-datepicker .ui-widget-header .ui-icon-circle-triangle-e{background:url("../image/common/btn_sh_r.png") no-repeat 50%; cursor:pointer; border:0; right:0}
body .ui-datepicker .ui-widget-header .ui-icon-circle-triangle-w{background:url("../image/common/btn_sh_l.png") no-repeat 50%; cursor:pointer; border:0;right:0}

body .ui-datepicker .ui-datepicker-prev span,
body .ui-datepicker .ui-datepicker-next span{width:100%; position:static; height:100%; margin:0;}
body .ui-datepicker .ui-widget-header .ui-icon-circle-triangle-e:hover,
body .ui-datepicker .ui-widget-header .ui-icon-circle-triangle-w:hover{right:0}

body .ui-datepicker .ui-widget-header .ui-datepicker-next-hover,
body .ui-datepicker .ui-widget-header .ui-datepicker-prev-hover{ border-radius:0px;}
body .ui-datepicker .ui-icon{width:22px; height:22px}
body .ui-datepicker thead th{background:#f4f4f4;}
body .ui-datepicker thead th:first-child { color:#e30028;}
body .ui-datepicker thead th:last-child { color:#333;}
body .ui-datepicker td{position:relative; }
body .ui-datepicker .ui-state-default{position:relative; z-index:1; border:0; color:#222; background:transparent; text-align:center; font-size: 13px;}
body .ui-datepicker .ui-state-default.ui-priority-secondary { color:#AAA;}

body .ui-datepicker .ui-datepicker-current-day:after{content:""; display:block; position:absolute; top:0; left:50%; margin-left:-12px; width:24px; height:24px; border-radius:50%; background:#000}
body .ui-datepicker .ui-datepicker-current-day .ui-state-default{color:#fff}
.ui-datepicker-buttonpane {display:none}

/*제품솔팅*/
.shopping_sorting { position: relative; width: 100%;}
.shopping_sorting>h2 {font-size:20px; line-height: 20px; color: #1c61ff; font-weight:500; margin-bottom: 40px; }
.shopping_sorting .select { position: absolute; top: -10px; right: 0px; background-color: rgba(0, 0, 0, 0); border: 0px; color: #FFF; font-size: 16px; width: auto; padding-right: 40px; background-image:url(../image/common/arrow_select02.png);}
.shopping_sorting .select:focus {background-image:url(../image/common/arrow_select02.png); }
.shopping_sorting .select option { color: #222;}

@media only screen and (max-width:1024px) {
	.shopping_sorting>h2 { margin-bottom: 30px;}
	.shopping_sorting .select { font-size: 15px; }
}
@media only screen and (max-width:767px) {
	.shopping_sorting>h2 { margin-bottom: 20px; font-size: 16px;}
	.shopping_sorting .select { font-size: 14px; }
}

/*제품 리스트*/
.product_list { width: 100%; display: flex; flex-wrap: wrap; }
.product_list li { position: relative; width: 48%; margin-right: 4%; background-color: #FFF; border-radius: 10px; margin-bottom: 40px; padding: 40px; overflow: hidden;}
.product_list li:nth-child(2n) { margin-right: 0px;}
.product_list li.no_data {width: 100%; text-align: center; padding: 120px 0px; margin: 0px; font-size: 18px; color: #FFF; background-color: rgba(0, 0, 0, 0); }

.product_list li .product_title { position: relative; width: 100%; padding-bottom: 30px; margin-bottom: 30px; border-bottom: 1px solid #DDD;}
.product_list li .product_title h2 {font-size:22px; line-height: 30px; color: #000; font-weight:600; margin-bottom: 10px; word-break: keep-all; }
.product_list li .product_title p {font-size:14px; line-height: 20px; color: #888; font-weight:400; word-break: keep-all;}
.product_list li .product_title .img_product { overflow: hidden; margin-bottom: 30px; border-radius: 10px;}
.product_list li .product_title .img_product img { width: 100%;}

.product_list li .product_pay { margin-bottom: 30px;}
.product_list li .product_pay p { position: relative; font-size:20px; line-height: 30px; color: #000; font-weight:500; text-align: right; padding-left: 50%; }
.product_list li .product_pay p span { position: absolute; left: 0px; top: 50%; transform: translateY(-50%); font-size:16px; line-height: 20px; color: #888;  }

.product_list li .pay_btn { position: absolute; left: 0px; right: 0px; bottom: 0px; display: block; width: 100%; font-size:20px; line-height: 30px; color: #FFF; font-weight:500; text-align: left; background-color: #1c61ff; padding: 15px 40px; }
.product_list li .pay_btn:hover { background-color: #0052da;}

.product_list li .pay_box { position: relative; width: 100%; border: 1px solid #222; padding-left: 150px; overflow: hidden; border-radius: 10px;}
.product_list li .pay_box a:nth-child(1), .product_list li .pay_box input:nth-child(2), .product_list li .pay_box a:nth-child(3) {position: absolute; top: 0px; width: 50px; height: 50px;}
.product_list li .pay_box a:nth-child(1) { left: 0px;}
.product_list li .pay_box input:nth-child(2) { left: 50px; padding: 0px; font-size: 16px; text-align: center; border: 0px; }
.product_list li .pay_box input:focus { border: 0px;}
.product_list li .pay_box a:nth-child(3) { left: 100px; }
.product_list li .pay_box a:nth-child(1),.product_list li .pay_box a:nth-child(3) { background-image:url("../image/common/icon_paybtn.png"); background-size: 100px; transition:all 0ms ease-in-out;-o-transition:all 0ms ease-in-out;-ms-transition:all 0ms ease-in-out;-moz-transition:all 0ms ease-in-out;-webkit-transition:all 0ms ease-in-out }
.product_list li .pay_box a:nth-child(1) { background-position: 0px 0px;}
.product_list li .pay_box a:nth-child(3) { background-position: -50px 0px;}
.product_list li .pay_box a:nth-child(1):hover { background-position: 0px -50px;}
.product_list li .pay_box a:nth-child(3):hover { background-position: -50px -50px;}
.product_list li .pay_box_btn {display: block; width: 100%; font-size:18px; line-height: 30px; color: #FFF; font-weight:500; text-align: center; background-color: #222; padding: 10px 0px;}
.product_list li .pay_box_btn:hover { background-color: #333;}

.product_list.type01 li, .product_list.type03 li, .product_list.type05 li { padding-bottom: 60px;}
.product_list.type01 .pay_box, .product_list.type01 .img_product { display: none;}
.product_list.type02 .pay_btn, .product_list.type02 .img_product { display: none;}
.product_list.type03 .pay_box{ display: none;}
.product_list.type03 .product_title, .product_list.type04 .product_title { padding-left: 100px; min-height: 100px;}
.product_list.type03 .img_product, .product_list.type04 .img_product { position: absolute; left: 0px; top: 0px; width: 80px; height: 80px;}
.product_list.type04 .pay_btn{ display: none;}
.product_list.type05 .pay_box{ display: none;}
.product_list.type06 .pay_btn{ display: none;}

@media only screen and (max-width:1200px) {
	.product_list li { margin-bottom: 30px; padding: 30px; }
	.product_list li .product_pay p { font-size:18px; line-height: 25px;}
	.product_list li .product_pay p span { font-size:15px;}
	.product_list li .product_title { padding-bottom: 20px; margin-bottom: 20px; }
	.product_list li .product_title h2 {font-size:20px; line-height: 25px; }
	.product_list li .product_title p {font-size:13px; line-height: 20px; }
	.product_list li .pay_btn { padding: 15px 30px; }
	.product_list li .pay_box { padding-left: 120px; }
	.product_list li .pay_box a:nth-child(1), .product_list li .pay_box input:nth-child(2), .product_list li .pay_box a:nth-child(3) {width: 40px; height: 40px;}
	.product_list li .pay_box input:nth-child(2) { left: 40px; font-size: 15px;}
	.product_list li .pay_box a:nth-child(3) { left: 80px; }
	.product_list li .pay_box a:nth-child(1),.product_list li .pay_box a:nth-child(3) { background-size: 80px;}
	.product_list li .pay_box a:nth-child(1) { background-position: 0px 0px;}
	.product_list li .pay_box a:nth-child(3) { background-position: -40px 0px;}
	.product_list li .pay_box a:nth-child(1):hover { background-position: 0px -40px;}
	.product_list li .pay_box a:nth-child(3):hover { background-position: -40px -40px;}
	.product_list li .pay_box_btn {font-size:16px; padding: 5px 0px;}
	.product_list.type05 li .product_title .img_product, .product_list.type06 li .product_title .img_product { margin-bottom: 20px;}
}
@media only screen and (max-width:1024px) {
	.product_list li { margin-bottom: 25px; padding: 20px; }
	.product_list li .product_pay { margin-bottom: 25px;}
	.product_list li .product_pay p { font-size:16px; line-height: 20px;}
	.product_list li .product_pay p span { font-size:14px;}
	.product_list li .product_title { padding-bottom: 15px; margin-bottom: 15px; }
	.product_list li .pay_btn { padding: 10px 20px; font-size: 18px; }
	.product_list.type01 li, .product_list.type03 li, .product_list.type05 li { padding-bottom: 50px;}
	.product_list.type03 .product_title, .product_list.type04 .product_title { padding-left: 75px; min-height: 80px;}
	.product_list.type03 .img_product, .product_list.type04 .img_product { width: 60px; height: 60px;}
	.product_list.type05 li .product_title .img_product, .product_list.type06 li .product_title .img_product { margin-bottom: 15px;}
}
@media only screen and (max-width:767px) {
	.product_list li { margin-bottom: 20px; padding: 15px; width: 100%; margin-right: 0px; }
	.product_list li .product_pay { margin-bottom: 15px;}
	.product_list li .product_pay p { font-size:15px; }
	.product_list li .product_pay p span { font-size:13px;}
	.product_list li .product_title { padding-bottom: 10px; margin-bottom: 10px; }
	.product_list li .product_title h2 {font-size:18px; line-height: 20px; margin-bottom: 5px; }
	.product_list li .product_title p {font-size:12px; line-height: 20px; }
	.product_list li .pay_btn { padding: 10px 20px; font-size: 16px; }
	.product_list.type03 .product_title, .product_list.type04 .product_title { min-height: 70px;}
	.product_list.type05 li .product_title .img_product, .product_list.type06 li .product_title .img_product { margin-bottom: 10px;}
}

/* ERROR PAGE (404/500/Inspection/Maintainance) */
.wrapper_error { width: 100%; height: 100%; margin: 0 auto; overflow: hidden; }
.wrapper_error .error_box { position: relative; top: 50%; transform: translateY(-50%);  -webkit-transform:translateY(-50%);  max-width: 1400px; width: 100%;  margin: 0 auto; padding: 0px 40px; }
.wrapper_error .error_box>div { position: relative; padding-bottom: 60px; margin-bottom: 60px;}
.wrapper_error .error_box>div:before { position: absolute; left: 0px; bottom: 0px; width:200%; height: 1px; background-color: #333; content: ""; }
.wrapper_error .error_box h2 { font-size: 100px; line-height: 100px; color: #FFF; margin-bottom: 60px; font-weight: 500;}
.wrapper_error .error_box h3 { font-size: 40px; line-height: 40px; color: #AAA; margin-bottom: 30px; font-weight: 400;}
.wrapper_error .error_box p { font-size: 18px; line-height: 25px; color: #888; font-weight: 300;}
.wrapper_error .error_box h4 { font-size: 30px; line-height: 40px; color: #1c61ff; font-weight: 100;}
.wrapper_error .error_box h4 span { display: block; font-size: 25px; line-height: 30px; margin-bottom: 20px; font-weight: 400;}
.wrapper_error .error_box .btn { width: 300px;}

@media only screen and (max-width:767px) {
	.wrapper_error .error_box { padding: 0px 30px; }
	.wrapper_error .error_box>div { padding-bottom: 40px; margin-bottom: 40px;}
	.wrapper_error .error_box h2 { font-size: 50px; line-height: 60px; margin-bottom: 30px; }
	.wrapper_error .error_box h3 { font-size: 20px; line-height: 25px; margin-bottom: 20px; }
	.wrapper_error .error_box p { font-size: 14px; line-height: 20px; }
	.wrapper_error .error_box h4 { font-size: 18px; line-height: 20px; }
	.wrapper_error .error_box h4 span { font-size: 14px; line-height: 20px; margin-bottom: 10px; }
	.wrapper_error .error_box .btn { width: 200px;}
}


