/*button{outline:none; }*/

/* 시스템팝업 */
.main_layer_pop { position: fixed; left: 0; right: 0; top: 0; bottom: 0; text-align: center; background-color: rgba(0, 0, 0, 0.5); z-index: 999999; overflow-Y:auto;}
#addPopArea {display:none !important;}
.main_layer_pop:before { content: ""; display: inline-block; height: 100%; vertical-align: middle; }
.pop-layer { display: inline-block; vertical-align: middle; height: auto; background-color: #fff; z-index: 10; }
.pop-layer img {max-width:100%;height:auto;}
.pop-layer .button-area { background-color:#333; padding:13px; overflow:hidden; color:#fff; width:100%; box-sizing:border-box;} 
.pop-layer .button-area label { vertical-align:top; cursor: pointer; } 
.pop-layer .button-area .checkArea, 
.pop-layer .button-area .close-button {float:left; display:table-cell; width:50%; text-align:center; position:relative;} 
.pop-layer .button-area .checkArea:after { content:""; background-color:rgba(255,255,255,0.5); width:1px; height:15px; position:absolute; right:0; top:50%; transform:translateY(-50%); opacity:.5; } 
.pop-layer .button-area .close-button .pop-close { background:transparent; width:100%; vertical-align: middle; display:block; }
.pop-layer .button-area .close-button .pop-close2 { background:transparent; width:100%; vertical-align: middle; display:block;   font-size:20px; color:#fff;
	 font-weight:400;}
.pop-layer .button-area .checkArea .checkbox { border:0; background:transparent url(/hwagae/main/images/icon/checkbox_m.png) no-repeat 0 0; background-size:
cover; width:15px; height:15px; display:inline-block; margin:0 0.5vw 0 0; vertical-align:middle; -webkit-appearance:none; -webkit-border-radius:0; outline:none; }

.main_layer_pop .pc {height:100%;}
.main_layer_pop .mobile {display:none; height:100%;}
.main_layer_pop img {vertical-align:top;}



.checkArea label,
.checkArea input[type="checkbox"] + span,
.checkArea input[type="checkbox"] + span::before,
{
    display: inline-block;
    vertical-align: top;
}
 
.checkArea label *
{
    cursor: pointer;
}
 
.checkArea input[type="checkbox"]
{
    opacity: 0;
    position: absolute;
}
 
.checkArea input[type="checkbox"] + span
{
    font-size:20px; color:#fff;
	 font-weight:400;
	 vertical-align:top;
}

 

 
.checkArea input[type="checkbox"] + span::before
{
    content: "";
    width: 23px;
    height: 23px;
    margin: 4px 5px 0 0;
	vertical-align:top;
     display:inline-block;
    background:url(/hwagae/main/images/common/checkbox_off.png) no-repeat 0 0;
}
 
.checkArea input[type="checkbox"]:checked + span::before
{
    background:url(/hwagae/main/images/common/checkbox.png) no-repeat 0 0;
}
 
.checkArea input[type="checkbox"]:disabled + span
{
    cursor: default;
     
    -moz-opacity: .4;
    -webkit-opacity: .4;
    opacity: .4;
}
/* //시스템팝업 */



/* 띠배너 */
.wrap_pop_top {position:relative; top:0; left:0; width:100%;height:100px; }
.wrap_pop_top_box {position:relative; width:100%; background:#1eb2f0; height:100px; text-align:center;}
.wrap_pop_top_box > div {text-align:Center; width:1200px; position:absolute; left:50%; margin-left:-600px; top:50%; transform:translateY(-50%);  z-index:1; }
.wrap_pop_top_box.wrap_pop_top_box_img > div {width:700px; margin-left:-350px;}
.wrap_pop_top_box_img > div img {vertical-align:top;}


.wrap_pop_top_box > div p {color:#fff; font-size:26px; font-weight:500; }
.wrap_pop_top_box > div p strong {font-weight:500;}
.wrap_pop_top_box > div p span {display:block; font-size:18px; font-weight:300;}

.wrap_pop_top .arrow {position:absolute;top:50%; transform:translateY(-50%); left:50%; margin-left:-600px; z-index:9999; }
.wrap_pop_top button.arrow.prev  {position:absolute;top:50%; transform:translateY(-50%); left:50%; margin-left:-600px; z-index:2; width:30px; height:30px; border-radius:100%; border:0; background:none; background:#fff; font-size:0; line-height:0; text-indent:-999999px;cursor:pointer;}
.wrap_pop_top button.arrow.prev::before {position:absolute; content:''; width:8px; height:8px; border-top:1px solid #333; border-left:1px solid #333; left:59%; top:38%; transform:rotate(-45deg) translate(-50%,-50%);}
.wrap_pop_top button.arrow.next {position:absolute;top:50%; transform:translateY(-50%); left:50%; margin-left:-516px; z-index:2; width:30px; height:30px; border-radius:100%; border:0; background:none; background:#fff; font-size:0; line-height:0; text-indent:-999999px;cursor:pointer;}
.wrap_pop_top button.arrow.next::before {position:absolute; content:''; width:8px; height:8px; border-top:1px solid #333; border-left:1px solid #333; right:59%; top:38%; transform:rotate(135deg) translate(-50%,-50%);}
.wrap_pop_top p.arrow {position:absolute;top:50%;  left:50%; margin-left:-570px; width:54px; text-align:Center; color:rgba(255,255,255,0.5); letter-spacing:2px; line-height:30px;}
.wrap_pop_top p.arrow strong {color:#fff; font-weight:400;}
.wrap_pop_top .bt {position:Absolute; top:50%; transform:translateY(-50%); right:50%; margin-right:-600px; z-index:2;}


.wrap_pop_top .bt label {margin-right:28px;  display:inline-block; vertical-align:top;}
.wrap_pop_top .bt label,
.wrap_pop_top .bt input[type="checkbox"] + span,
.wrap_pop_top .bt input[type="checkbox"] + span::before,
{
    display: inline-block;
    vertical-align: top;
}
 
.wrap_pop_top .bt label *
{
    cursor: pointer;
}
 
.wrap_pop_top .bt input[type="checkbox"]
{
    opacity: 0;
    position: absolute;
}
 
.wrap_pop_top .bt input[type="checkbox"] + span
{
    font-size:16px; color:#fff;
	 font-weight:400;
	 vertical-align:top;
}

 

 
.wrap_pop_top .bt input[type="checkbox"] + span::before
{
    content: "";
    width: 18px;
    height: 26px;
    margin: 4px 7px 0 0;
	vertical-align:top;
     display:inline-block;
    background:url(/hwagae/main/images/common/pop_banner_checkbox_off.png) no-repeat 0 0;
	background-size:100% auto!important;
}
 
.wrap_pop_top .bt input[type="checkbox"]:checked + span::before
{
    background:url(/hwagae/main/images/common/pop_banner_checkbox_on.png) no-repeat 0 0;
}
 
.wrap_pop_top .bt input[type="checkbox"]:disabled + span
{
    cursor: default;
     
    -moz-opacity: .4;
    -webkit-opacity: .4;
    opacity: .4;
}


.wrap_pop_top .bt button {position:relative; background:none; width:27px; height:27px; border:0; font-size:0; line-height:0; cursor:pointer; vertical-align:top;}
.wrap_pop_top .bt button::after {width:35px; top:50%; left:-3px; height:1px; background:#fff; position:absolute; transform:rotate(45deg); content:'';}
.wrap_pop_top .bt button::before {width:35px; top:50%; left:-3px; height:1px; background:#fff; position:absolute; content:''; transform:rotate(135deg);}

/* //띠배너 */


@media screen and (max-width:1260px){
/* 띠배너 */
.wrap_pop_top_box > div {width:80%; margin:0; transform:translate(-50%,-50%);}
.wrap_pop_top_box.wrap_pop_top_box_img > div {width:100%; text-align:Center; margin:0; transform:none; top:0; left:0;}

.wrap_pop_top button.arrow.prev  {left:30px; margin-left:0;}
.wrap_pop_top button.arrow.next {left:114px; margin-left:0;}
.wrap_pop_top p.arrow {left:60px;  margin-left:0;}



.wrap_pop_top .bt {right:30px; margin:0;}
/* // 띠배너 */
}


@media screen and (max-width:767px){
/* 시스템팝업 */
/*	.pop-layer  {width:90%;}	*/
.pop-layer .button-area {padding:2vw;}
.checkArea input[type="checkbox"] + span::before {background-size:auto 100%!important; width:4vw; height:4vw; margin:1vw 2vw 0 0;}
.checkArea input[type="checkbox"] + span,.pop-layer .button-area .close-button .pop-close2 {font-size:3.6vw;}
.pop-layer .button-area .checkArea:after {height:4vw;}

.main_layer_pop .pc {display:none;}
.main_layer_pop .mobile {display:block; max-height:74vh; overflow-Y:auto;}
.main_layer_pop .mobile img {width:100%; vertical-align:top;}

.pop-layer {position:fixed; width:80%; top:50%; left:50%; transform:translate(-50%,-50%);}
/* //시스템팝업 */

/* 띠배너 */

.wrap_pop_top,.wrap_pop_top_box {height:24vw;  /*  background:none !important; */  text-align:center; }
.wrap_pop_top_box img {max-height:18vw;}
.wrap_pop_top p.arrow {display:none;}
.wrap_pop_top button.arrow.prev {left:2vw; top:42%; width:5vw; height:5vw;}
.wrap_pop_top button.arrow.next {left:Auto; right:2vw; top:42%; width:5vw; height:5vw;}
.wrap_pop_top button.arrow.prev::before,.wrap_pop_top button.arrow.next::before {width:1vw; height:1vw;}
.wrap_pop_top button.arrow.prev::before {left:60%; top:37%;}
.wrap_pop_top button.arrow.next::before {right:60%; top:37%;}

.wrap_pop_top_box > div {width:100%; transform:none; top:4vw; left:0; }
.wrap_pop_top_box_img > div img {width:100%; margin-top:3.5vw;}


.wrap_pop_top_box > div p span {font-size:3.6vw;}
.wrap_pop_top_box > div p {font-size:4.6vw;}

.wrap_pop_top .bt {right:1vw; bottom:1vw; top:auto; transform:none;}
.wrap_pop_top .bt input[type="checkbox"] + span::before {width:2.5vw; height:2.5vw; margin:1vw 0.8vw 0 0;}
.wrap_pop_top .bt input[type="checkbox"] + span {font-size:3vw;}
.wrap_pop_top .bt label {margin-right:4vw; margin-top:1vw;}
.wrap_pop_top .bt button {width:5vw; height:5vw;}
.wrap_pop_top .bt button::before,.wrap_pop_top .bt button::after {width:5vw;}
/* //띠배너 */
}