@import url( "http://fonts.googleapis.com/earlyaccess/notosanskr.css" );
/*------------------------------------------------
* default definition
------------------------------------------------*/
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,
big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,
dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,
canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,
time,mark,audio,video{
	margin:0;
	padding:0;
	border:0;
	text-decoration:none;
	box-sizing:border-box;
}
html,body {height:100%;font-size:13px;color:#111;font-weight:300;font-family: 'Roboto', sans-serif;line-height:24px;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
ul,ol,li{list-style:none}
hr,legend {display:none;}
table {border-collapse:collapse; table-layout:fixed;}
.layout {width:100%;height:100%;padding:0px auto;}


/*------------------------------------------------
* default font
------------------------------------------------*/

/* @font-face{font-family:NotoSansKR-Bold;src:url('/font/NotoSansKR-Bold.eot');src:local(¡Ø), url('/font/NotoSansKR-Bold.woff') format('woff');} */






/*------------------------------------------------
* Form
/*------------------------------------------------*/
input, textarea {box-sizing:border-box;}

input[type="text"]			{height:35px;line-height:30px;font-family: 'Roboto', sans-serif;padding:0 10px;}
input[type="email"]			{height:50px;line-height:50px;font-family: 'Roboto', sans-serif;padding:0px 10px;margin-bottom: 20px;margin-top:20px;}
input[type="text"]:hover	{}
input[type="password"]		{height:35px;line-height:30px;font-family: 'Roboto', sans-serif;padding:0 10px;}
input[type="file"]			{}
input[type="image"]			{border:none;}
input[type="radio"]			{border:none; background:transparent ;}
input[type="checkbox"]		{border:none; background:transparent ; width:18pt; height:18pt; }
input[type="submit"]		{border:1px solid #ccc; background:transparent ;}
textarea {width:500px; height:150px;resize:none; }

select {
	height: 35px;

	font-size:13px !important;
	border: 1px solid #d7d7d7;
	background:url('../img/select_arrow.png') no-repeat;
	background-position:right 15px;
	background-color:#fff;
	box-sizing: border-box;
	display:inline-block;
	-moz-appearance: none;
	appearance: none;
	-webkit-appearance: none;
	padding:0 0 0 10px;
	color: #000;
	text-overflow:ellipsis;overflow:hidden;white-space:pre;
}
select::-ms-expand{display: none;}

.w50 {width:50px;}
.w150 {width:150px;}
.w200 {width:200px;}
.w300 {width:300px;}
.w500 {width:500px;}
.w600 {width:600px;}

.h50 {height:50px;}
.h100 {height:100px;}
.h200 {height:200px;}
.h300 {height:300px;}
.h400 {height:400px;}
.h500 {height:500px;}


.space50{height:50px;}

/*------------------------------------------------
* Link
/*------------------------------------------------*/
a:link { text-decoration:none;}
a:visited { text-decoration:none;}
a:hover {color:#333;  text-decoration:none;}
a:active {color:#333; text-decoration:none;}


/*------------------------------------------------
* button
/*------------------------------------------------*/
button {    appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none; position:relative;border:0;background:transparent;cursor:pointer;border:1px solid #011035;border-radius:3px;height:30px;padding:0 10px;font-size:12px;box-sizing:border-box;}
button span {position:relative;top:1px;}

/* ´ñ±Û µî·Ï */
.btn-comment-submit {border-radius:30px;width:100px;height:35px;background-image:url('../img/btn_comment_reg.png');background-position:center center;background-repeat:no-repeat;transition: all .2s ease-out;}
.btn-comment-submit:hover {border:1px solid #555;}
.btn-comment-submit span {display:none;}

/* ´ñ±Û »èÁ¦ È®ÀÎ */
.btn-comment-delete {border-radius:30px;width:100px;height:35px;background-image:url('../img/btn_comment_del.png');background-position:center center;background-repeat:no-repeat;transition: all .2s ease-out;}
.btn-comment-delete:hover {border:1px solid #555;}
.btn-comment-delete span {display:none;}

/* ´ñ±Û »èÁ¦ */
.btn-comment-del {border:none;width:10px;height:10px;background-image:url('../img/icon_bg.png');background-position:-68px -212px;margin-left:5px;}
.btn-comment-del span {display:none;}

/* Æ˾÷ ´Ý±â */
.btn-popup-close {border:0;width:37px;height:37px;background-image:url('../img/icon_bg.png');background-position:-70px -282px;background-repeat:no-repeat;transition: all .2s ease-out;}
.btn-popup-close:hover {transform: rotate(90deg);}
.btn-popup-close span {display:none;}
.popup .btn-popup-close {position:absolute;right:-37px;top:-37px;}

@media only screen and (max-width: 768px) {
  .popup .btn-popup-close {position:absolute;right:0px;top:-37px;}
}


/* Æ˾÷ ´Ý±â */
.btn-popup-close2 {border:0;width:41px;height:45px;background-image:url('../img/icon_bg.png');background-position:-66px -275px;background-repeat:no-repeat;transition: all .2s ease-out;}
.btn-popup-close2:hover {transform: rotate(90deg);}
.btn-popup-close2 span {display:none;}
.popup .btn-popup-close2 {position:absolute;right:0px;top:-6px;}


/* °Ë»ö¹öÆ° */
.btn-search-submit {border:0;width:16px;height:16px;background-image:url('../img/icon_bg.png');background-position:-140px -213px;background-repeat:no-repeat;}
.btn-search-submit span {display:none;}

/* ÆÄÆ®ºÎºÐ ÅõÇ¥Çϱâ */
.btn-part-submit {position:relative;border:0;width:690px;height:137px;background-image:url('../img/part_btn_bg.png');background-repeat:no-repeat;background-color:#011035;background-position:center bottom;}
.btn-part-submit span {position:absolute;display:block;text-indent:-9999px;width:71px;height:79px;left:20px;top:28px;background-image:url('../img/part_btn_arrow.png');background-repeat:no-repeat;}
@media only screen and (max-width: 768px) {
  .btn-part-submit span {display: none;}
}

/* ·Î±×ÀÎ */

.topimg{
  margin:0px auto;
  text-align: center;
}


.login-goods{display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
}

.form-box-0{
  display: flex;
  align-items: center;
  padding-bottom: 20px;
}

.form-box-0 span{
  padding:0px 20px;
  font-size: 14px;
  font-weight: 500;
  line-height:1.5;
}



@media only screen and (max-width: 967px) {
  .login-goods{display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
  }

  .form-box-0{
    display: flex;
    align-items: center;
  }

  .form-box-0 span{
    padding:0px 20px;

    line-height:1.5;
  }

}

/* ÅõÇ¥½ÃÀÛ */
.btn-poll-start {border-radius:30px;width:260px;height:40px;background-position:center center;background-repeat:no-repeat;transition: all .2s ease-out;}
.btn-poll-start:hover {border:1px solid #555;}
.btn-poll-start span {font-size:13px;font-weight:600;top:-1px;color:#011035;}

/* ¹ÌÂü¿©ÅõÆ÷ */
.btn-survey-continue {border-radius:30px;width:260px;height:60px;background-color:#011035;background-position:center center;background-repeat:no-repeat;transition: all .2s ease-out;}
.btn-survey-continue:hover {border:1px solid #555;}
.btn-survey-continue span {font-size:18px;font-weight:600;top:-1px;color:#fff;}

/* ÅõÇ¥Á¾·á */
.btn-survey-end {border-radius:30px;width:260px;height:60px;background-color:#011035;background-position:center center;background-repeat:no-repeat;transition: all .2s ease-out;}
.btn-survey-end:hover {border:1px solid #555;}
.btn-survey-end span {font-size:18px;font-weight:600;top:-1px;color:#fff;}

/* ÅõÇ¥Á¾·á - ´ñ±ÛÀÔ·Â */
.btn-survey-comment {border-radius:30px;width:260px;height:60px;background-color:#011035;background-position:center center;background-repeat:no-repeat;transition: all .2s ease-out;}
.btn-survey-comment:hover {border:1px solid #555;}
.btn-survey-comment span {font-size:18px;font-weight:600;top:-1px;color:#fff;}

/* ºê·£µå ¸¸Á·µµ - Æ˾÷ */
.btn-brnad-range {border-radius:30px;width:100px;height:60px;background-position:center center;background-repeat:no-repeat;transition: all .2s ease-out;color:#000;}
.btn-brnad-range:hover {border:1px solid #555;}
.btn-brnad-range span {font-size:17px;font-weight:600;top:-1px;}


/* ºê·£µå ¸¸Á·µµ - Æ˾÷´Ý±â */
.btn-brnad-close {border-radius:30px;width:100px;height:60px;background:#fff;background-position:center center;background-repeat:no-repeat;transition: all .2s ease-out;}
.btn-brnad-close:hover {border:1px solid #555;}
.btn-brnad-close span {font-size:17px;font-weight:600;top:-1px;}


@media screen and (max-width: 768px) {

/* ÅõÇ¥½ÃÀÛ */
.btn-poll-start {border-radius:30px;width:fit-content;height:40px;background-position:center center;background-repeat:no-repeat;transition: all .2s ease-out;}
.btn-poll-start:hover {border:1px solid #555;}
.btn-poll-start span {font-size:13px;font-weight:600;top:-1px;color:#011035;}

/* ¹ÌÂü¿©ÅõÆ÷ */
.btn-survey-continue {border-radius:30px;width:fit-content;height:60px;background-color:#011035;background-position:center center;background-repeat:no-repeat;transition: all .2s ease-out;padding: 0px 20px;}
.btn-survey-continue:hover {border:1px solid #555;}
.btn-survey-continue span {font-size:14px;font-weight:600;top:-1px;color:#fff;}

/* ÅõÇ¥Á¾·á */
.btn-survey-end {border-radius:30px;width:fit-content;height:60px;background-color:#011035;background-position:center center;background-repeat:no-repeat;transition: all .2s ease-out;padding: 0px 20px;}
.btn-survey-end:hover {border:1px solid #555;}
.btn-survey-end span {font-size:14px;font-weight:600;top:-1px;color:#fff;}

/* ÅõÇ¥Á¾·á - ´ñ±ÛÀÔ·Â */
.btn-survey-comment {border-radius:30px;width:fit-content;height:60px;background-color:#011035;background-position:center center;background-repeat:no-repeat;transition: all .2s ease-out;padding: 0px 20px;}
.btn-survey-comment:hover {border:1px solid #555;}
.btn-survey-comment span {font-size:15px;font-weight:600;top:-1px;color:#fff;}

/* ºê·£µå ¸¸Á·µµ - Æ˾÷ */
.btn-brnad-range {border-radius:30px;width:100px;height:60px;background-position:center center;background-repeat:no-repeat;transition: all .2s ease-out;color:#000;}
.btn-brnad-range:hover {border:1px solid #555;}
.btn-brnad-range span {font-size:15px;font-weight:600;top:-1px;}


/* ºê·£µå ¸¸Á·µµ - Æ˾÷´Ý±â */
.btn-brnad-close {border-radius:30px;width:100px;height:60px;background:#fff;background-position:center center;background-repeat:no-repeat;transition: all .2s ease-out;}
.btn-brnad-close:hover {border:1px solid #555;}
.btn-brnad-close span {font-size:15px;font-weight:600;top:-1px;}




}



.cycle-slideshow img{position:absolute;width:900px;margin-left:0px;}

.titimg {position:absolute;top:50px;right:50px;display:none;}
.titimg img{text-align:right;}



#ipbox {
  position:absolute;
  width:100%;
  height:400px;
  text-align: center;
  color:#000000;
  padding:0px;
}
#ipbox #box{
position:relative;
display:block;
width:700px;
  top:50%;

 margin:0px auto;
 vertical-align:middle;
font-family: "Noto Sans KR", sans-serif;
font-weight:400;
font-size: 12pt;
 text-align: center;
 border:5px solid red;
 padding:50px;
}

/*------------------------------------------------
* layerPopup
/*------------------------------------------------*/
.layerBg {position:fixed;left:0;top:0;width:100%;height:100%;background:#000;display:none;
	opacity: 0.95; /* Standard: FF gt 1.5, Opera, Safari */
	filter: alpha(opacity=95); /* IE lt 8 */
	-ms-filter: "alpha(opacity=90)"; /* IE 8 */
	-khtml-opacity: 0.95; /* Safari 1.x */
	-moz-opacity: 0.95; /* FF lt 1.5, Netscape */
	z-index:5000;
}

.layerBg2 {position:fixed;left:0;top:0;width:100%;height:100%;background:#fff;display:none;
	opacity: 0.45; /* Standard: FF gt 1.5, Opera, Safari */
	filter: alpha(opacity=45); /* IE lt 8 */
	-ms-filter: "alpha(opacity=40)"; /* IE 8 */
	-khtml-opacity: 0.45; /* Safari 1.x */
	-moz-opacity: 0.45; /* FF lt 1.5, Netscape */
	z-index:10000;
}

/*------------------------------------------------
* Outline & Design
------------------------------------------------*/
.header {height:200px;text-align:center;background-color:#000;}
.header h1 {position:relative;width:1050px;left:50%;margin-left:-70px;top:50px;width:150px;height:150px;background:url("../img/slogo.png") no-repeat;}
.header h1 a {display:block;width:100%;height:100%;}
.header h1 span {display:none;}

.header h2 {position:absolute;left:50%;top:120px;height:600px;margin-left:-500px;}
.header h2 span {display:none;}

.header h3 {position:absolute;width:900px;left:50%;top:180px;margin-left:-450px;height:135px;}
.header h3 a {display:block;}
.header h3 span {display:none;}

.header h4 {position:absolute;width:786px;left:50%;top:585px;margin-left:-393px;height:135px;display:none;}
.header h4 a {display:block;width:100%;height:100%;}
.header h4 span {display:none;}

.gnb {position:relative;height:80px;text-align:center;background-color:#363636;width:100%;}








.gnb ul li {padding-right: 20px;
  color: #fff;
  display: inline-block;
  margin-top: 30px;
  font-weight: 700;
}
.gnb ul li a:link {color:#fff;
  -o-transition:color .5s ease-out, background 1s ease-in;
  -ms-transition:color .5s ease-out, background 1s ease-in;
  -moz-transition:color .5s ease-out, background 1s ease-in;
  -webkit-transition:color .5s ease-out, background 1s ease-in;
  /* ...and now override with proper CSS property */
  transition:color .5s ease-out, background 1s ease-in;
}
.gnb ul li a:visited {color:#fff; text-decoration:none;}
.gnb ul li a:hover {color:red;}
.gnb ul li a:active {color:#fff; text-decoration:none;}



@media only screen and (max-width: 768px) {
  .gnb {position:relative;width:100%;height:70px;text-align:center;background-color:#363636;}
  .gnb ul {position:relative;display:inline-block;font-size:13px;color:#8b8b8b;font-weight:500;top:26px;}
  .gnb ul li {margin:0px;padding-right:5px;}
  }


.timer {height:195px;text-align:center;background:url("../img/timer_bg.jpg") no-repeat center;background-size:100% 100%;padding-top:35px;}
.timer_txt {color:#fff;font-size:20px;font-weight:700;letter-spacing:-1px;text-shadow: 2px 2px 2px black;}
#note {color:#fff;font-size:12px;font-weight:400;margin-top:-20px;}
.category {width:100%;text-align:center;background-color:#f1f1f1;}
a.innerborder, a.innerborder img {
        float: left;
        overflow:hidden;
}
a.innerborder:hover {
        border:4px solid #d2ae59;
}
a.innerborder:hover img {
        margin: -4px;
}





.footer {width:967px;margin:0 auto;padding:50px 0 30px; display: flex;
  flex-direction: column;
  align-content: center;
  align-items: center;}

  @media only screen and (max-width: 768px) {
    .comment-area {width:100%;margin:0 auto;padding:45px 0 25px;}
    .footer {width:100%;margin:0 auto;padding:50px 0 30px; display: flex;
      flex-direction: column;
      align-content: center;
      align-items: center;}
}




.footer:after {content:"";display:block;clear:both;}


.footer_evt {width:967px;margin:0 auto;padding:50px 0 30px;}
.footer_evt:after {content:"";display:block;clear:both;}
@media only screen and (max-width: 768px) {
  .footer_evt {width:100%;margin:0 auto;padding:0px 0 30px;}
}

#sbt {position:relative;top:50px;margin-bottom:50px;text-align:center;color:#ffd303;}

@media only screen and (max-width: 768px) {
#sbt {position:relative;width:100%;top:15px;margin-bottom:0px;text-align:center;color:#ffd303;}
#sbt img{position:relative;width:100%;top:0px;margin-bottom:50px;text-align:center;color:#ffd303;}
}


.tit_s {
	height:60px;
	font-size:34px;font-weight:600;
	color:#011035;

  padding:0.5em;
  line-height: 1.3em;
}

@media only screen and (max-width: 768px) {
.tit_s {
	height:60px;
	font-size:20px;font-weight:600;
	color:#011035;

  padding:0.5em;
  line-height: 1.3em;
}
}


/*------------------------------------------------
* guide
------------------------------------------------*/
.guide_box {position:relative;width:968px;margin:40px auto;font-size:20px;line-height:30px;font-weight:400;}
.guidelist{display: block;padding: 20px 0px;border-top:1px solid #011035; margin-top: 10px;}
.guide_icon{font-size:40px;color:#011035;font-weight: 500;display: block;margin-bottom: 10px;margin-top: 20px;}
.guide_title{font-size:20px;color:#011035;font-weight: 500;display: block;margin-bottom: 20px;}
.guides_txt {display: block; font-size:15px;font-weight:600;margin-bottom: 5px; }
.guides_txt.sm {display: block; font-size:14px;font-weight:400;line-height: 1.5; }
.guide_img{display: block;margin-bottom: 20px;margin-top: 10px;border:1px solid #e4e4e4;}
/*------------------------------------------------
* Mail
------------------------------------------------*/


.mail_box {position:relative;width:600px;margin:40px auto;padding:50px; border:10px solid #011035;font-size:20px;line-height:30px;font-weight:400;text-align: center;}

.mail_box span{font-weight:300;}
.guide_txt {display: block; padding:20px;font-size:20px;font-weight:400; }
.guide_txt.md {display: block; padding:0px 0px 20px 0px;font-size:15px;font-weight:400;line-height: 1.5; }
.guide_txt.sm {display: block; padding:20px;font-size:14px;font-weight:400;line-height: 1.5; }
.mailfield {display: block; padding:20px;background:#f1d563;font-size:24px;font-weight:600; }

/* ¸ÞÀÏ¹ß¼Û */





.btn-mail{

    font-size:14px;
    font-weight:600;
    border:1px solid #011035;
    border-radius:30px;
    width:300px;
    height:40px;
    line-height: 1;
    padding:6px 20px;;
    color: #011035;
    background-position:center center;
    background-repeat:no-repeat;transition: all .2s ease-out;margin: 20px 0px;
}
.btn-mail:hover {background:#011035;
color: #fff;}

@media only screen and (max-width: 768px) {

  .mail_box {position:relative;width:100%;margin:40px auto;padding:50px; border:10px solid #011035;font-size:20px;line-height:30px;font-weight:400;text-align: center;}

  .mail_box span{font-weight:300;}
  .guide_txt {display: block; padding:20px;font-size:16px;font-weight:400; }
  .guide_txt.md {display: block; padding:0px 0px 20px 0px;font-size:15px;font-weight:400;line-height: 1.5; }
  .guide_txt.sm {display: block; padding:20px;font-size:14px;font-weight:400;line-height: 1.5; }
  .mailfield {display: block; padding:20px;background:#f1d563;font-size:20px;font-weight:600; }

  /* ¸ÞÀÏ¹ß¼Û */



  .btn-mail{

    font-size:14px;
    font-weight:600;
    border:1px solid #011035;
    border-radius:30px;
    width:300px;
    height:40px;
    line-height: 1;
    padding:6px 20px;;
    color: #011035;
    background-position:center center;
    background-repeat:no-repeat;transition: all .2s ease-out;margin: 20px 0px;
}
.btn-mail:hover {background:#011035;
color: #fff;}


}




.btn-cancel{


    font-size:16px;
    font-weight:500;
    border:1px solid #011035;
    border-radius:30px;
    width:300px;
    height:40px;
    line-height: 1;
    padding:6px 20px;;
    color: #011035;
    background-position:center center;
    background-repeat:no-repeat;transition: all .2s ease-out;margin:20px;
}
.btn-cancel:hover {background:#011035;
color: #fff;}



.btn-mailmod {
    border: 1px solid #011035;
    padding: 5px 10px;

    font-size:13px;
    font-weight:500;
    border-radius:30px;
    width:300px;
    height:40px;
    color: #011035;
    background-position:center center;
    background-repeat:no-repeat;transition: all .2s ease-out;margin:20px;
}
.btn-mailmod:hover {background:#011035;
color: #fff;}





/*------------------------------------------------
* Start Page
------------------------------------------------*/
div.start_form {width:600px; margin:0 auto; border:10px #e0b875 solid; padding:35px 0 35px 0px; text-align:center;}
	p.st_1,
	p.st_2 {width:600px; margin:0 auto;}

	p.st_1 {padding-top:10px 0 10px -20px;}
	p.st_2 {padding-top:35px; text-align:center;}

.sinput {border:2px solid #A9A9A9; line-height:16px; font-size:10pt;}


.survey-area {width:100%;padding:35px 0 0px 0;}

/*------------------------------------------------
* part
------------------------------------------------*/
.category-box {position:relative;width:967px;margin:0 auto;padding-bottom:25px;}

@media only screen and (max-width: 768px) {
  .category-box {position:relative;width:100%;margin:0 auto;padding-bottom:25px;}
}


.category-box h1 {padding:35px 0 25px 0; text-align:left;font-size:20px;}
@media only screen and (max-width: 768px) {
  .category-box h1 {padding:55px 0 10px 0; text-align:center;font-size:15px;}
}

/* category-search-box */
.category-search-box {position:absolute;right:0;top:30px;}

@media only screen and (max-width: 768px) {
  .category-search-box {position:absolute;right:15px;top:0px;}
}

.category-search-form {width:210px;border:1px solid #d7d7d7;background-color:#fff;}
.category-search-box .search_txt{position:absolute;background-color:#fff;font-size:12px;margin-left:-200px;margin-top:10px;}

.category-search-box .search_select{position:absolute;background-color:#fff;font-size:12px;margin-left:-160px;margin-top:0px;width:150px;}
.category-search-box .search_select select{width:150px;height:37px;}

.category-search-form input[type="text"] {width:172px;border:0;color:#000;}
.category-search-form .btn-search-submit {position:absolute;right:10px;top:9px;}

/* category-brand-box */
.category-brand-box {position:relative;}
.category-brand-box table {width:100%;}
.category-brand-box table tr td {width:137px;height:137px;border:1px solid #d9d9d9;background-color:#fff;}
.category-brand-box table tr td div {position:relative;width:100%;height:100%;border:0;overflow:hidden;cursor:pointer;transition: all .2s ease-in-out;}
.category-brand-box table tr td div.on {border:7px solid #d2ae59 !important;box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.2);}
.category-brand-box table tr td div:hover {border:1px solid #d2ae59;box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.2);}
.category-brand-box table tr td div .category-part-bg {display:block;width:100%;height:100%;background-repeat:no-repeat;background-position:center;transition: all .1s ease-in-out;}
.category-brand-box table tr td div:hover .category-part-bg {margin-top:-5px;}
.category-brand-box table tr td div .category-part-check {position:absolute;display:block;margin-top:0px;left:0;top:-500px;}
.category-brand-box .btn-part-submit {position:relative;width:100%;right:0;bottom:0;z-index:500;transition: all .1s ease-in-out;}
.category-brand-box .btn-part-submit span {transition: all .1s ease-in-out;}
.category-brand-box .btn-part-submit:hover {box-shadow:inset 7px 7px 7px 0px rgba(0, 0, 0, 0.1);}
.category-brand-box .btn-part-submit:hover span {left:150px;}


/*------------------------------------------------
* Á¶»çÆäÀÌÁö
------------------------------------------------*/
.survey-box {position:relative;width:967px;margin:0 auto;padding-bottom:25px;}
.survey-box h1 {position:relative;text-align:left;font-size:16px;}

.survey-form {width:100%;}
.survey-form table {width:100%;}

.survey-form-box {border-top:1px solid #ccc;padding-bottom:0px;margin-top:30px;}

.survey-box .btn-area {text-align:center;margin-top: 50px;}
.survey-box .btn-survey-end {margin-left:10px;}

.tbl_item3 { height:130px; text-align:left; color:#ed1c24; font-size:24px; font-weight:bold;padding:35px 0 0 0;}
.tbl_item3 p{text-align:left; color:#acacac; font-size:12px; font-weight:bold;}
.tbl_item3 p span{color:#ed1c24;}
.tbl_item3 span {color:#252525;}
.tbl_item4		{vertical-align:top;}

div.poll_list {position:relative; width:214px;}
div.poll_list p{}
	p.poll_2 {position:relative;width:214px;height:214px;border:7px;padding:0px; text-align:center; background:#fff; z-index:20;text-align:center;transition: all .2s ease-out;overflow:hidden;border:1px solid #e4e4e4;}
	p.poll_2:hover {box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.2);}
	p.poll_2.on {border:7px solid #d2ae59 !important;padding:0px;box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.2);}

	p.poll_2 img {width:200px; height:200px;transition: all .3s ease-out;margin-top:6px;}
	p.poll_2:hover img {transform: scale(1.1);}
	p.poll_2.on img {transform: scale(0.9);}

	p.poll_4 {width:214px;font-size:14px;color:#000000; padding:10px 0px 0px 0px; text-align:center; min-height:15px;}
	p.poll_1 {width:214px;font-weight:bold; font-size:18px; color:#000000; padding:3px 0px 40px 0px; text-align:center; min-height:15px;}
	p.poll_3 {position:absolute;width:1px;height:1px;overflow:hidden;}




  @media only screen and (max-width: 768px) {

    .survey-box {position:relative;width:100%;margin:0 auto;padding-bottom:25px;}
    .survey-box h1 {position:relative;text-align:left;font-size:15px;padding:15px;word-break: keep-all;}

    .survey-form {width:100%;padding:15px;}
    .survey-form table {width:100%;}

    .survey-form-box {border-top:1px solid #ccc;padding-bottom:0px;margin-top:0px;}

    .survey-box .btn-area {text-align:center;margin-top: 50px;}
    .survey-box .btn-survey-end {margin-left:5px;}

    .tbl_item3 { height:130px; text-align:left; color:#ed1c24; font-size:20px; font-weight:bold;padding:35px 0 0 0;}
    .tbl_item3 p{text-align:left; color:#acacac; font-size:13px; font-weight:bold;}
    .tbl_item3 p span{color:#ed1c24;}
    .tbl_item3 span {color:#252525;}
    .tbl_item4		{vertical-align:top;}

    div.poll_list {position:relative; width:100%;}
    div.poll_list p{width:95% !important;}
    div.poll_list p img{width:100% !important;}
    p.poll_2 {position:relative;width:214px;height:auto;border:7px;padding:0px; text-align:center; background:#fff; z-index:20;text-align:center;transition: all .2s ease-out;overflow:hidden;border:1px solid #e4e4e4;}
    p.poll_2:hover {box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.2);}
    p.poll_2.on {border:7px solid #d2ae59 !important;padding:0px;box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.2);}

    p.poll_2 img {width:200px; height:auto;transition: all .3s ease-out;margin-top:6px;}
    p.poll_2:hover img {transform: scale(1.1);}
    p.poll_2.on img {transform: scale(0.9);}

    p.poll_4 {width:214px;font-size:14px;color:#000000; padding:10px 0px 0px 0px; text-align:center; min-height:15px;}
    p.poll_1 {width:214px;font-weight:bold; font-size:14px; color:#000000; padding:3px 0px 15px 0px; text-align:center; min-height:15px;}
    p.poll_3 {position:absolute;width:1px;height:1px;overflow:hidden;}


  }


.no-survey {width:100%;text-align:center;padding:100px 0;font-size:25px;}
.no-survey p {padding:50px;border-top:1px solid #ebebeb;border-bottom:1px solid #ebebeb;}

/* Á¶»çÇÑ µ¥ÀÌŸ */
.survey-form-box.checked_part div.poll_list .dim_checked {position:absolute;left:0;top:0;width:214px;height:214px;z-index:100;}
.survey-form-box.checked_part div.poll_list .dim_checked>div {position:absolute;left:0;top:0;width:100%;height:100%;background:#fff;opacity:0.4;}
.survey-form-box.checked_part div.poll_list .dim_checked.checked_brand {border:5px solid #acacac;}

.survey-form-box.checked_part .tbl_item3 {color:#bababa !important;}
.survey-form-box.checked_part .tbl_item3 span {color:#8b8b8b !important;}
.survey-form-box.checked_part .tbl_item3 {color:#b7b7b7 !important;}
.survey-form-box.checked_part p.poll_1,
.survey-form-box.checked_part p.poll_4 {color:#b7b7b7;}
.survey-form-box.checked_part p.poll_2 img {
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
	opacity:0.4;
}


/*------------------------------------------------
* ·Î±×ÀÎ ÆäÀÌÁö
------------------------------------------------*/
/* ·Î±×ÀÎ */
.login-page-area {position:fixed;width:620px;height:535px;left:50%;top:50%;margin:-280px 0 0 -310px;background-color:#fff;z-index:9999;padding:25px 35px;display:none;}
.login-page-area h1 {padding:30px 0 45px 0px;font-weight:700;letter-spacing:-1px;text-align:center;font-size:24px;}
.login-page-area h1 span{color:#011035;}
.login-page-area .login-chk-form {padding-left:40px;}
.login-page-area dt {width:100px;padding-right:0 !important;font-weight:600;}
.login-page-area .input-box-name {width:135px;}
.login-page-area .input-box-email {width:110px;ime-mode:disabled;}
.login-page-area .btn-area {text-align:center;}
.login-page-area .select-email {width:110px;margin-left:5px;}
.login-page-area .input-box-email2 {display:none;width:125px;}
.login-page-area .login-text {position:relative;left:-20px;padding:25px 0 35px 0;font-size:12px;font-weight: 500;}
.login-page-area .btn-area {position:relative;left:-20px;}

/* ·Î±×ÀÎ - Ãß°¡Á¤º¸ */
.login-add-area {position:fixed;width:700px;left:50%;top:45%;margin:-390px 0 0 -350px;background-color:#fff;z-index:9999;padding:25px 35px;display:none;}
.login-add-area h1 {padding:20px 0 20px 0;letter-spacing:-1px;text-align:center;font-size:24px; }
.login-add-area h1 span{color:#011035;}
.login-add-area .add-txt {text-align:center;padding:0 0 20px 0;font-size:13px;}

.login-add-area .tag-add-txt {padding:20px 0px 20px 0px;font-size:11px;width:100%;margin:0px auto;}

.login-add-area .form-box-1 {}
.login-add-area .form-box-1 dt {width:130px;text-align:right;font-size: 12px;font-weight:600;}
.login-add-area .form-box-1 dd {padding-left:10px;font-size: 14px;font-weight:600;}
.login-add-area select {width:190px;}
.login-add-area input[type="radio"] {position:relative;margin:0 5px 0 10px;top:2px;}
.login-add-area .btn-area {text-align:center;padding-top:15px;}
.login-add-area .input-box-hp {ime-mode:disabled;}
.login-add-area .login-add-name-txt,
.login-add-area .login-add-email-txt {padding-top:3px;}



@media only screen and (max-width: 768px) {

  .login-page-area {position:absolute;width:100%;height:auto;left:0%;top:15%;margin:0px auto ;background-color:#fff;z-index:9999;padding:25px 15px 40px;display:none;}
  .login-page-area h1 {padding:30px 0 10px 0px;font-weight:700;letter-spacing:-1px;text-align:center;font-size:20px;}
  .login-page-area h1 span{color:#011035;}
  .login-page-area .login-chk-form {padding:30px;}
  .login-page-area dt {width:100px;padding-right:0 !important;font-weight:600;}
  .login-page-area .input-box-name {width:135px;}
  .login-page-area .input-box-email {width:110px;ime-mode:disabled;}
  .login-page-area .btn-area {text-align:center;}
  .login-page-area .select-email {width:110px;margin-left:5px;}
  .login-page-area .input-box-email2 {display:none;width:125px;}
  .login-page-area .login-text {position:relative;left:0px;padding:25px 0 35px 0;font-size:12px;font-weight: 500;}
  .login-page-area .btn-area {position:relative;left:0px;}

  /* ·Î±×ÀÎ - Ãß°¡Á¤º¸ */
  .login-add-area {position:absolute;width:100%;left:0%;top:15%;margin:0px 0 0 0px;background-color:#fff;z-index:9999;padding:25px 35px;display:none;}
  .login-add-area h1 {padding:20px 0 20px 0;letter-spacing:-1px;text-align:center;font-size:20px; }
  .login-add-area h1 span{color:#011035;}
  .login-add-area .add-txt {text-align:center;padding:0 0 20px 0;font-size:13px;}

  .login-add-area .tag-add-txt {padding:20px 0px 20px 0px;font-size:11px;width:100%;margin:0px auto;}

  .login-add-area .form-box-1 {}
  .login-add-area .form-box-1 dt {width:130px;text-align:left;font-size: 12px;font-weight:600;}
  .login-add-area .form-box-1 dd {padding-left:0px;font-size: 14px;font-weight:600;}
  .login-add-area select {width:190px;}
  .login-add-area input[type="radio"] {position:relative;margin:0 5px 0 10px;top:2px;}
  .login-add-area .btn-area {text-align:center;padding-top:15px;}
  .login-add-area .input-box-hp {ime-mode:disabled;}
  .login-add-area .login-add-name-txt,
  .login-add-area .login-add-email-txt {padding-top:3px;}



}


/*------------------------------------------------
* Á¶»ç°á°ú(´ñ±Û)
------------------------------------------------*/
/* survey-comment-result */
.survey-comment-result {position:relative;width:967px;margin:0 auto;}
.survey-result {text-align:center;font-weight:bold;padding:0px 0 0px;}


/* survey-comment-area */
.survey-comment-area {position:relative;width:100%;background-color:#fff;padding:40px 0 60px 0;}
.survey-comment-area_last {position:relative;width:100%;  text-align:center;background-color:#fff;padding:20px 0 20px 0;background-repeat: no-repeat;
    background-position: center;
}

.survey-comment-box {position:relative;width:967px;margin:0 auto;}
.survey-comment-box p{font-size:20px;line-height:32px;font-weight:600;margin-bottom:0px;}
.survey-comment-box h1 {padding-bottom:0px;margin-top:0px;}

.survey-comment-form-box {border:1px solid #d3d3d3;padding:25px;margin-top:0px;}
.survey-comment-form-box .survey-comment-text {font-size:13px;padding:0px 55px 0 0;}

.survey-comment-form-box .btn-survey-comment {position:absolute;left:50%;bottom:-80px;margin-left:-125px;}



@media only screen and (max-width: 768px) {
/* survey-comment-result */
.survey-comment-result {position:relative;width:100%;margin:0 auto;}
.survey-result {text-align:center;font-weight:bold;padding:0px 0 0px;}


/* survey-comment-area */
.survey-comment-area {position:relative;width:100%;background-color:#fff;padding:40px 0 60px 0;}
.survey-comment-area_last {position:relative;width:100%;  text-align:center;background-color:#fff;padding:20px 15px 20px;background-repeat: no-repeat;
    background-position: center;
}

.survey-comment-box {position:relative;width:100%;margin:0 auto;}
.survey-comment-box p{font-size:16px;line-height:25px;font-weight:600;margin-bottom:0px;}
.survey-comment-box h1 {padding-bottom:0px;margin-top:0px;}

.survey-comment-form-box {border:1px solid #d3d3d3;padding:25px;margin-top:0px;}
.survey-comment-form-box .survey-comment-text {font-size:13px;padding:0px 55px 0 0;}

.survey-comment-form-box .btn-survey-comment {position:absolute;left:50%;bottom:-80px;margin-left:-125px;}

}




/*------------------------------------------------
* ±âŸ
------------------------------------------------*/

/* ÅõÇ¥°á°ú */
.poll_rst {width:760px; margin:0 auto; border:10px #e0b875 solid; padding:30px;}

.poll_rst table{width:740px; margin:0 auto; }
.poll_rst table td {padding:3px 0; color:#fff;}

	p.poll_btn_2 {width:740px; margin:0 auto; text-align:center; padding:20px 0 0 0;}
	p.poll_btn_3 {width:740px; margin:0 auto; text-align:center; }
	p.poll_btn_3 * {vertical-align:middle;}

/* TEXT */
.h2_txt {width:840px; margin:0 auto;}
.h3_txt {width:740px; margin:0 auto; padding:0 0 10px 0;}
.h4_txt {text-align:center; font-size:10pt; font-weight:bold; color:#fff; line-height:18px;}


/* ¸¸Á·µµ Á¶»ç Æ˾÷ ·¹À̾î */
#pollLayer {position:absolute; width:0; min-height:0; top:0; left:0; z-index:99;}
#pollCont {position:relative; width:840px; height:637px; top:0px; left:0px; background:#1b0c05;}


/* ¿À¸¥ÂÊ Ä«¿îÆ® */
div.rCount {position:absolute; left:0; top:0; width:0; height:0; }
div.rCount p {width:73px; font-size:18px; font-weight:bold; text-align:center;}
	p.rCount_1 {position:absolute; left:0; top:8px;  color:#fff;}
	p.rCount_2 {position:absolute; left:0; top:58px; color:#cec779;}

/* ½ºÅ©·Ñ ¹è³Ê */
#scrollbanner {position:relative; width:915px; height:0px; margin:0px auto;}
#scrollbannercont {position:absolute; width:75px; height:100px; top:100px; left:870px;}

#content {margin:-60px auto;}
/*------------------------------------------------
* À̺¥Æ® ´ñ±Û
------------------------------------------------*/
.comment-area {}

.comment-event {width:100%;height:774px;background-color:#555;text-align:center;color:#fff;font-weight:bold;font-size:30px;padding-top:0px;}
.comment-event2 {width:100%;height:1050px;background-color:#555;text-align:center;color:#fff;font-weight:bold;font-size:30px;padding-top:0px;}

.comment-form {padding-top:35px;}
.comment-form h1 {padding-bottom:15px;}
.comment-form-box {border:1px solid #d3d3d3;padding:25px;}

.form-box-1 dl {padding-bottom:10px;}
.form-box-1 dl:after {content:"";display:block;clear:both;}
.form-box-1 dl dt {float:left;padding:5px 15px 0 0;}
.form-box-1 dl dd {float:left;padding:0px 20px 0 0;}
.form-box-1 input[type="text"] {margin-right:5px;}
	.input-box-name {width:155px;ime-mode:active;}
	.input-box-hp {width:70px;ime-mode:disabled;float:left;width:100%;}
	.input-select-hp {float:left;width:70px;margin-right:5px;}
	.input-box-textarea {width:100%;height:105px;padding:10px;overflow:auto;}

  @media only screen and (max-width: 768px) {
    .form-box-1 dl {padding-bottom:10px;}
    .form-box-1 dl:after {content:"";display:block;clear:both;}
    .form-box-1 dl dt {float:none;padding:10px 15px 0 0;}
    .form-box-1 dl dd {float:left;padding:10px 20px 0 0;}
    .form-box-1 input[type="text"] {margin-right:5px;}
      .input-box-name {width:155px;ime-mode:active;}
      .input-box-hp {width:70px;ime-mode:disabled;float:left;width:100%;}
      .input-select-hp {float:left;width:70px;margin-right:5px;}
      .input-box-textarea {width:100%;height:105px;padding:10px;overflow:auto;}



  }




.form-box-2 {padding-bottom:20px;}
.form-box-2:after {content:"";display:block;clear:both;}
.form-box-2 dl {float:left;}
.form-box-2 dl:after {content:"";display:block;clear:both;}
.form-box-2 dl dt {float:left;padding:5px 15px 0 0;}
.form-box-2 dl dd {float:left;}

.form-box-3 {}
.form-box-3:after {content:"";display:block;clear:both;}
.form-box-3 dl {float:left;}
.form-box-3 dl:after {content:"";display:block;clear:both;}
.form-box-3 dl dt {float:left;padding:5px 15px 0 0;}
.form-box-3 dl dd {float:left;}
.form-box-3 button {float:right;}
	.block-code {padding:3px 15px 0 0;font-weight:bold;font-size:18px;min-width:90px;}
	.block-code span {color:red;}
	.block-txt {padding:5px 35px 0 10px;}
	.input-box-block {width:105px;ime-mode:disabled;}
	.input-box-password {width:120px;}


.comment-list {width:100%;padding-top:30px;}
.comment-list dl {width:100%;border-bottom:1px solid #ebebeb;padding:15px 0;}
.comment-list dl:after {content:"";display:block;clear:both;}
.comment-list dl:first-child {border-top:1px solid #ebebeb;}
.comment-list dl dt {float:left;width:90px;font-weight:bold;}
.comment-list dl dd {float:left;text-align:left;width:830px;}

.no-data {width:100%;text-align:center;border-top:1px solid #ebebeb;border-bottom:1px solid #ebebeb;padding:15px 0;}

.cmt_tit {position:relative;height:10px;right:0px;top:20px;margin-top:0px;font-weight:600;font-size:12px;text-align:left;}
.cmt_tit img{top:20px;}
.cmt_tit span{color: red;font-size:12px;}
.cmt_count {position:relative;height:20px;right:0px;top:0px;margin-top:30px;font-weight:600;}
.cmt_count span{color: red;}

/* ´ñ±Û»èÁ¦ Æ˾÷*/
.comment-del-area {position:fixed;width:590px;height:245px;left:50%;top:50%;margin:-124px 0 0 -300px;background-color:#fff;z-index:9999;padding:25px 35px;display:none;}
.comment-del-area h1 {padding-bottom:35px;}
.comment-del-area dt {width:55px;padding-right:0 !important;}
.comment-del-area .input-box-name {width:135px;}
.comment-del-area .btn-area {text-align:center;}


/* footer */
.footer h1 {text-indent:-9999px;width:304px;height:40px;background-image:url('../img/icon_bg.png');background-position:-46px -66px;float:left;}
.footer .r_cont {display: flex;
  flex-direction: column;
  align-items: center;}
.footer .r_cont:after {content:"";display:block;clear:both;}

.footer .address {font-size:12px;padding:10px 10px 20px 0;}

@media only screen and (max-width: 768px) {
  .footer .address {font-size:12px;padding:10px 10px 20px 0;text-align: center;}
}

.footer .link {float:left;}
.footer .link:after {content:"";display:block;clear:both;}
.footer .link li {float:left;width:30px;height:30px;background-image:url('../img/icon_bg.png');margin-left:5px;}
.footer .link li a {display:block;width:100%;height:100%;text-indent:-9999px;}
.footer .link .link_1 {background-position:-71px -142px;}
.footer .link .link_2 {background-position:-142px -142px;}
.footer .link .link_3 {background-position:-213px -142px;}

/* ³Ñ¹ö¸µ */
.page_num {width:100%;text-align:center;padding:20px 0;}
.page_num * {vertical-align:middle;}
.page_num>span,
.page_num>a {display:inline-block;margin:0 2px;height:26px;padding:0px 7px 0 7px;border:1px solid #fff;text-decoration:none;}
.page_num>span {border:1px solid #555;font-weight:normal;color:#111;font-weight:bold;}
.page_num a:hover {color:#555; border:1px solid #555;}

	.page_first,
	.page_pre,
	.page_next,
	.page_last {text-indent:-9999px;width:24px;padding:0 !important;border:1px solid #fff !important;}

	.page_num [class^="page_"] {background-image:url('../img/icon_bg.png');}
	.page_first {background-position:-348px -62px;}
	.page_pre {background-position:-417px -62px;}
	.page_next {background-position:-487px -62px;}
	.page_last {background-position:-560px -62px;}

	span.page_first,
	span.page_pre,
	span.page_next,
	span.page_last {opacity:.3;}


/* range */
.survey_content_area {position:relative;box-sizing:border-box;padding:25px;background: #d8f0fb;border: 1px solid rgba(112, 215, 230, 0.57);margin-bottom:20px;transition:background 0.3s;}
.survey_content_area.on {background:rgba(157, 221, 251, 0.57);border: 1px solid rgba(112, 215, 230, 0.57);}
.survey_content_area.on1 {background:rgba(157, 221, 251, 0.14);border: 1px solid rgba(112, 215, 230, 0.14);}
.survey_content_area.on2 {background:rgba(157, 221, 251, 0.28);border: 1px solid rgba(112, 215, 230, 0.28);}
.survey_content_area.on3 {background:rgba(157, 221, 251, 0.42);border: 1px solid rgba(112, 215, 230, 0.42);}
.survey_content_area.on4 {background:rgba(157, 221, 251, 0.58);border: 1px solid rgba(112, 215, 230, 0.58);}
.survey_content_area.on5 {background:rgba(157, 221, 251, 0.71);border: 1px solid rgba(112, 215, 230, 0.71);}
.survey_content_area.on6 {background:rgba(157, 221, 251, 0.85);border: 1px solid rgba(112, 215, 230, 0.85);}
.survey_content_area.on7 {background:rgba(157, 221, 251, 1);border: 1px solid rgba(112, 215, 230, 0.85);}
.survey_content_area>p {font-size:20px;color:#333;font-weight:bold;padding:0 0 20px 0;}
.survey_content_area>p span {color:#ed1c24;}
.survey_content_area>ul {width:100%;}
.survey_content_area>ul:after {content:"";display:block;clear:both;}
.survey_content_area>ul li {font-size:14px;color:#000;font-weight:bold;float:right;}
.survey_content_area>ul li:first-child {float:left;}
.survey_content_area .range_point {text-align:center;font-size:30px;color:#000;font-weight:bold;padding:0 0 20px 0;}


.survey_content_area .dim_checked_part {position:absolute;left:0;top:0;width:100%;height:100%;z-index:100;}
.survey_content_area .dim_checked_part>div {position:absolute;left:0;top:0;width:100%;height:100%;background:#fff;opacity:0.6;}


.survey-form-box div.poll_list .dim_content_checked.checked_content_brand {position:absolute;left:0;top:0;width:214px;height:214px;z-index:100;border:5px solid #acacac;}
.survey-form-box div.poll_list .dim_content_checked.checked_content_brand + .poll_2 img {opacity:0.4;}
.survey-form-box div.poll_list .dim_content_checked.checked_content_brand>div {position:absolute;left:0;top:0;width:100%;height:100%;background:#e9e9e9;opacity:0.6;}


@media screen and (max-width: 768px) {

  .survey-form-box div.poll_list .dim_content_checked.checked_content_brand {position:absolute;left:0;top:0;width:95%;height:98px;z-index:100;border:5px solid #acacac;}
  .survey-form-box div.poll_list .dim_content_checked.checked_content_brand + .poll_2 img {opacity:0.4;}
  .survey-form-box div.poll_list .dim_content_checked.checked_content_brand>div {position:absolute;left:0;top:0;width:100%;height:100%;background:#e9e9e9;opacity:0.6;}



}

	.re_box{position:relative;padding:20px 20px;margin-bottom:10px;background:#fff;}
	.re_box.off:before {content:"";display:block;position:absolute;left:0;top:0;width:100%;height:100%;background:#fff;opacity:0.6;z-index:100;}
	.re_box2{border:none;padding:20px 20px;margin-bottom:0px;background:#fff;}

	.re_tit{font-weight:400;font-size:20px;text-align:center;}

@media screen and (max-width: 768px) {

	.re_box{position:relative;padding:10px 20px;margin-bottom:10px;background:#fff;}
	.re_box.off:before {content:"";display:block;position:absolute;left:0;top:0;width:100%;height:100%;background:#fff;opacity:0.6;z-index:100;}
	.re_box2{border:none;padding:10px 20px;margin-bottom:0px;background:#fff;}


	.re_tit{font-weight:400;color:#333;font-size:20px;text-align:center;}


}
	.pop-brand-range {position:fixed;width:60%;height:100%;left:50%;top:2%;margin-left:-30%;margin-top:0%;background:transparent;z-index:9999;display:none;}

@media screen and (max-width: 768px) {
	.pop-brand-range {position:fixed;width:90%;height:100%;left:50%;top:2%;margin-left:-45%;margin-top:0%;background:transparent;z-index:9999;display:none;}
	}



	.pop-brand-range .btn-area {text-align:center;padding-top:20px;}
	.brand_range_box>p {font-size:20px;color:#333;font-weight:bold;padding:0 0 20px 0;}
	.brand_range_box>p .brand_range_tit {color:#ed1c24;}
	.brand_range_box>ul {width:100%;}
	.brand_range_box>ul:after {content:"";display:block;clear:both;}
	.brand_range_box>ul li {font-size:14px;color:#000;font-weight:bold;float:right;}
	.brand_range_box>ul li:first-child {float:left;}
	.brand_range_box .range_point {text-align:center;font-size:30px;color:#000;font-weight:bold;padding:0 0 20px 0;}
	.brand_range_box .brand_range_img {text-align:center;padding-top:10px;}
	.brand_range_box .brand_range_img img {width:150px;height:150px;background: #fff;border:5px solid #011035;}



@charset "utf-8";
a {
  color: #3c3e40;
  text-decoration: none;
}
a:active,
a:hover {
  text-decoration: underline;
}
address,
caption,
cite,
code,
dfn,
em,
var {
  font-style: normal;
  font-weight: normal;
}


table {
  border-spacing: 0;
}
fieldset,
img {
  border: 0;
}
address,
caption,
cite,
code,
dfn,
em,
strong,
th,
var {
  font-weight: normal;
  font-style: normal;
}
strong {
  font-weight: bold;
}
ol,
ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
caption,
th {
  text-align: left;
}
q:before,
q:after {
  content: '';
}
abbr,
acronym {
  border: 0;
}
.hide,
legend,
caption {
  position: absolute !important;
  width: 0;
  height: 0;
  font-size: 0;
  line-height: 0;
  overflow: hidden;
  visibility: hidden;
}
/* Custom CSS --------------------------------------- */
body {
  font-family: 'Malgun Gothic', '¸¼Àº °íµñ', Dotum, 'µ¸¿ò', arial, helvetica;
  font-size: 100%;
  color: #333;
  /*color: rgba(0,0,0,0.5);*/
}


.blindText {
  width: 0;
  height: 0;
  font-size: 0;
  overflow: hidden;
  text-indent: -9999px;
}
.line_sprite:before,
.line_sprite:after {
  background: #fff;
  content: '';
  display: block;
  width: 10px;
  height: 3px;
  position: absolute;
}
.clearfx {
  zoom: 1;
}
.clearfx:after {
  content: ".";
  display: block;
  font-size: 0;
  height: 0px;
  line-height: 0;
  clear: both;
}
.pt_0 {
  padding-top: 0px !important;
}
.pt_30 {
  padding-top: 30px !important;
}
.pt_60 {
  padding-top: 60px !important;
}
.pt_90 {
  padding-top: 90px !important;
}
.pb_30 {
  padding-bottom: 30px !important;
}
.pb_60 {
  padding-bottom: 60px !important;
}
.mt_0 {
  margin-top: 0px !important;
}
.mt_30 {
  margin-top: 30px !important;
}
.mt_60 {
  margin-top: 60px !important;
}
.left_60 {
  padding-left: 60px !important;
}
.fixed {
  position: fixed !important;
}
.m_item {
  display: none !important;
}
@media only screen and (max-width: 768px) {
  .m_item {
    display: block !important;
  }
}
.pc_item {
  display: block !important;
}
@media only screen and (max-width: 768px) {
  .pc_item {
    display: none !important;
  }
}
html {
  font-size: 16px;
}
@media only screen and (max-width: 768px) {
  html {
    font-size: 16px;
  }
}
body {
  color: #3c3e40;
  -webkit-font-smoothing: antialiased;
  word-wrap: break-word;
  word-break: break-all;
  line-height: normal;
  letter-spacing: 0px;
  font-size: 16px;
}
@media only screen and (max-width: 768px) {
  body {
    overflow: auto;
  }
}
header {
  display: block;
  position: fixed;
  width: 100%;
  height: 34px;
  padding: 0px;
  z-index: 999;
  background: #222;
}
header .logo {
  position: relative;
  height: 100%;
  margin: 10px 0 0 15px;
  float: left;
  font-size: 0;
  line-height: 0;
}

header .sns_share {
  float: right;
  position: relative;
  margin: 5px 14px;
  height: 25px;
}
header .sns_share li {
  display: inline-block;
  position: relative;
  margin-right: 3px;
  width: 25px;
  height: 25px;
}
@media only screen and (max-width: 768px) {
  header .sns_share li {
    margin-right: 4px;
  }
}
header .sns_share li:last-child {
  margin-right: 0;
}
header .sns_share li a {
  display: inline-block;
  overflow: hidden;
  width: 25px;
  height: 25px;
  text-indent: -99999px;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}


header.white {
  background: #fff;
}
header.gradient {
  background: rgba(0, 0, 0, 0);
  background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 100%);
  background: -webkit-gradient(linear, left bottom, left top, color-stop(0, rgba(0, 0, 0, 0.8)), color-stop(1, rgba(0, 0, 0, 0)));
  background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 100%);
  background: -o-linear-gradient(top, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 100%);
  background: -ms-linear-gradient(top, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 100%);
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 100%);
}


#contentArea .section {
  position: relative;
  width: 100%;
  z-index: 1;
}
#contentArea .center_wrap {
  width: 1024px;
  margin: 0 auto;
  text-align: left;
}
@media only screen and (max-width: 1024px) {
#contentArea .center_wrap {
    width: 100%;
  }
}
#contentArea .other_cont .center_wrap {
  text-align: center;
}
.bg {
  display: none;
  position: fixed;
  top: 0;
  background: rgba(0, 0, 0, 0.7);
  width: 100%;
  height: 100%;
  z-index: 100;
}
.byline {
  position: relative;
  width: 100%;
  max-width: 1024px;
  border: 1px solid #ebebeb;
  background: #f8f8f8;
  margin: 20px auto 20px;
}
@media only screen and (max-width: 768px) {
  .byline {
    max-width: 100%;
    border-left: none;
    border-right: none;
  }
}
.byline .publish {
  font-size: 11px;
  color: #bebebe;
  position: absolute;
  top: -24px;
  right: 4px;
}
.byline .inner_cont ul {
  overflow: hidden;
  margin: 0 auto;
  padding: 20px;
}
.byline .inner_cont li {
  display: inline-block;
  padding: 10px 15px;
  margin-left: 10px;
  background: url(https://images.joins.com/newsroom/dataDate/dot.png) 5px 18px no-repeat;
  color: #3c3e40;
  font-size: 13px;
  line-height: 18px;
}
.byline .inner_cont li strong {
  font-weight: normal;
}
.byline .inner_cont li span {
  padding-top: 4px;
  color: #9a9a9a;
}
@media only screen and (max-width: 768px) {
  .byline .inner_cont ul {
    padding: 20px 10px;
  }
  .byline .inner_cont li {
    display: block;
    margin-left: 10px;
    font-size: 14px;
    padding: 4px 10px;
    background: url("https://images.joins.com/newsroom/dataDate/dot.png") 0 14px no-repeat;
  }
  .byline .inner_cont li span {
    display: inline-block;
  }
}
.other_cont .center_wrap {
  padding: 10px 0 10px;
  text-align: center;
  margin: 0 auto;
  width: 100%;
  max-width: 1024px;
}
@media only screen and (max-width: 768px) {
  .other_cont .center_wrap {
    max-width: 100%;
    padding: 0 0 15px;
    overflow: hidden;
  }
}
.other_cont .center_wrap .title {
  display: inline-block;
  position: relative;
  font-size: 16px;
  line-height: 1.5;
  text-align: center;
  color: #878787;
}
.other_cont .center_wrap .title a:hover {
  font-weight: bold;
  text-decoration: none;
}
.other_cont .center_wrap .title:before {
  content: "";
  position: absolute;
  top: 50%;
  right: 110%;
  width: 100px;
  height: inherit;
  border-bottom: 1px solid #878787;
}
.other_cont .center_wrap .title:after {
  content: "";
  position: absolute;
  top: 50%;
  left: 110%;
  width: 100px;
  height: inherit;
  border-bottom: 1px solid #878787;
}
@media only screen and (max-width: 768px) {
  .other_cont .center_wrap .title {
    display: block;
    padding-left: 12px;
    font-size: 15px;
    text-align: left;
  }
  .other_cont .center_wrap .title:before {
    content: none;
  }
  .other_cont .center_wrap .title:after {
    content: none;
  }
}
.other_cont .center_wrap .rolling_cont {
  overflow: hidden;
  text-align: center;
  padding-top: 30px;
}
@media only screen and (max-width: 768px) {
  .other_cont .center_wrap .rolling_cont {
    margin: 0px 0px;
    padding-top: 20px;
    overflow: auto;
  }
}
.other_cont .center_wrap .rolling_cont .item_wrap {
  position: relative;
  overflow: hidden;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 768px) {
  .other_cont .center_wrap .rolling_cont .item_wrap {
    width: 100%;
    margin: 0 auto;
  }
}
.other_cont .center_wrap .rolling_cont .item_wrap .item {
  float: right;
  margin-bottom: 20px;
  background: #000;
  width: 49.5%;
  height: 140px;
  overflow: hidden;
  cursor: pointer;
}
.other_cont .center_wrap .rolling_cont .item_wrap .item:first-child {
  float: left;
  margin-left: 0px;
}
.other_cont .center_wrap .rolling_cont .item_wrap .item .dimd_cover {
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.4);
}
.other_cont .center_wrap .rolling_cont .item_wrap .item .dimd_cover span {
  position: relative;
  color: #fff;
  font-size: 16px;
  top: 108px;
}
.other_cont .center_wrap .rolling_cont .item_wrap .item a {
  position: relative;
  display: block;
  width: 100%;
  height: inherit;
  text-decoration: none;
}
.other_cont .center_wrap .rolling_cont .item_wrap .item a:hover img {
  -webkit-transform: rotate(0deg) scale(1.1) skew(0deg) translate(0px);
  -moz-transform: rotate(0deg) scale(1.1) skew(0deg) translate(0px);
  -ms-transform: rotate(0deg) scale(1.1) skew(0deg) translate(0px);
  -o-transform: rotate(0deg) scale(1.1) skew(0deg) translate(0px);
  transform: rotate(0deg) scale(1.1) skew(0deg) translate(0px);
}
.other_cont .center_wrap .rolling_cont .item_wrap .item a img {
  width: 100%;
  height: auto;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  -o-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}
.other_cont .center_wrap .rolling_cont .item_wrap .item a .text_wrap {
  position: absolute;
  top: 40%;
  width: 100%;
  margin: 0 auto;
}
.other_cont .center_wrap .rolling_cont .item_wrap .item a .text_wrap .title_txt {
  display: block;
  color: #fff;
  font-size: 16px;
}
@media only screen and (max-width: 1024px) {
  .other_cont .center_wrap .rolling_cont .item_wrap .item {
    margin-bottom: 4px;
    height: 120px;
  }
  .other_cont .center_wrap .rolling_cont .item_wrap .item a .text_wrap {
    top: 46%;
  }
  .other_cont .center_wrap .rolling_cont .item_wrap .item a .text_wrap .title_txt {
    font-size: 15px;
  }
}
@media only screen and (max-width: 768px) {
  .other_cont .center_wrap .rolling_cont .item_wrap .item {
    float: none;
    margin: 0 auto;
    width: 96%;
    height: 80px;
  }
  .other_cont .center_wrap .rolling_cont .item_wrap .item:first-child {
    float: none;
    margin: 0 auto 2px;
  }
  .other_cont .center_wrap .rolling_cont .item_wrap .item a .text_wrap {
    top: 40%;
  }
}


@charset "utf-8";

@import url('https://fonts.googleapis.com/earlyaccess/notosanskr.css');
::selection {
font-size:100px;
  color: #fff;
  background: #011035;
}
::-moz-selection {
  color: #fff;
  background: #3a6cd6;
}
body {
  overflow-x: hidden;
  font-size: 16px;
  letter-spacing: -0.5px;
  word-wrap: break-word;
  word-break: keep-all;
  line-height: normal;
  font-family: 'Roboto', sans-serif;
}
#contentArea section {
  padding-top: 10px;
  padding-bottom: 0px;

}
@media only screen and (max-width: 768px) {
  #contentArea section {
    padding-top: 20px;

  }
}
#contentArea section .center_wrap {
  width: 100%;
  margin: auto;
  background:transparent;
  padding: 0 30px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
@media only screen and (max-width: 768px) {
  #contentArea section .center_wrap {
    width: 100%;
    padding: 0 0px;
  }
}
#contentArea section .center_wrap.titleArea {
  padding: 30px 0 0px;
  height: 190px;
}
#contentArea section .center_wrap.titleArea h1 {
  text-align: center;
  font-size: 0;
  color: transparent !important;
  margin: 30px auto;
  width: 380px;
  height: 100px;
  opacity: 0;
  -webkit-opacity: 0;
  -moz-opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=(0));
  -webkit-transform: translateY(30px);
  -moz-transform: translateY(30px);
  -ms-transform: translateY(30px);
  -o-transform: translateY(30px);
  transform: translateY(30px);
  -webkit-transition: all 0.4s ease-out;
  -moz-transition: all 0.4s ease-out;
  -o-transition: all 0.4s ease-out;
  -ms-transition: all 0.4s ease-out;
  transition: all 0.4s ease-out;
}
#contentArea section .center_wrap.titleArea h1.active {
  opacity: 1;
  -webkit-opacity: 1;
  -moz-opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=(100));
  -webkit-transform: translateY(0px);
  -moz-transform: translateY(0px);
  -ms-transform: translateY(0px);
  -o-transform: translateY(0px);
  transform: translateY(0px);
}
@media only screen and (max-width: 768px) {
  #contentArea section .center_wrap.titleArea {
    height: 130px;
  }
  #contentArea section .center_wrap.titleArea h1 {
    margin: 10px auto;
    width: 74%;
    height: 90px;
  }
}
#contentArea section .center_wrap .sortBox {
  padding-top: 0px;
}

#contentArea section .center_wrap .sortBox .con_low{
float:left;
font-size:13px;
font-weight:600;
padding-top: 0px;
}
#contentArea section .center_wrap .sortBox .con_high{
float:right;
font-size:13px;
font-weight:600;
padding-top: 0px;
}

#contentArea section .center_wrap .sortBox.type {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
#contentArea section .center_wrap .sortBox.type #w_text {
  border: 1px solid #b9c7db;
  width: 54px;
  padding: 0 4px;
  margin: 0 4px 0 10px;
  color: #3a6cd6;
  text-align: center;
}
#contentArea section .center_wrap .sortBox.type .boxBtnWrap {
  padding-top: 12px;
  display: table;
}
#contentArea section .center_wrap .sortBox.type .boxBtnWrap .boxBtn {
  position: relative;
  width: 50%;
  height: 150px;
  padding: 4px;
  display: table-cell;
  float: none;
  text-align: center;
  line-height: 1px;
  cursor: pointer;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
#contentArea section .center_wrap .sortBox.type .boxBtnWrap .boxBtn .innerBox {
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  -ms-transition: all 0.2s ease;
  transition: all 0.2s ease;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  border: 2px solid #e6e6e6;
  width: 100%;
  height: auto;
  background: #f7f7f7;
}
#contentArea section .center_wrap .sortBox.type .boxBtnWrap .boxBtn .innerBox img {
  width: 80%;
}
#contentArea section .center_wrap .sortBox.type .boxBtnWrap .boxBtn .innerBox p {
  text-align: center;
  margin: 0px auto 6px;
}
#contentArea section .center_wrap .sortBox.type .boxBtnWrap .boxBtn:hover .innerBox {
  border: 2px solid #9fb0c5;
  background: #f8fbff;
}
#contentArea section .center_wrap .sortBox.type .boxBtnWrap .boxBtn.active .innerBox {
  border: 2px solid #3a6cd6;
  background: #fff;
}
#contentArea section .center_wrap .sortBox.type .boxBtnWrap .boxBtn.active .innerBox p {
  color: #3a6cd6;
}
#contentArea section .center_wrap p {
  margin: 6px auto;
  max-width: 720px;
  text-align: left;
  font-size: 1rem;
  line-height: 1.7rem;
  color: #888;
}




@media only screen and (max-width: 768px) {
  #contentArea section .center_wrap p {
    padding: 0 0;
    width: auto;
  }
}
#contentArea section .center_wrap .info {
  font-size: 12px;
  line-height: 17px;
  text-align: center;
  color: #9aa6b7;
}
#contentArea section .center_wrap h4 {
  display: block;
  color: #666;
  letter-spacing: 0px;
  font-size: 14px;
  text-align:center;
  padding-bottom: 10px;
}


@media only screen and (max-width: 768px) {
#contentArea section .center_wrap h4 {
  display: block;
  letter-spacing: 0px;
  font-size: 16px;
  text-align:center;
}


}

#contentArea section .center_wrap h4 span{color:#011035;}

@media only screen and (max-width: 768px) {
  #contentArea section .center_wrap h4 {
    letter-spacing: 0px;
  }
}
#contentArea section .center_wrap h4.valueText {
display:inline-block;
width:100%;

text-align:center;
color: #011035;
padding:0px 0px 10px 0px;
}
#contentArea section .center_wrap h4.valueText em.bold {
  font-weight: bold;
}

#contentArea section .center_wrap .resultPage p.info {
  color: #3a6cd6;
  text-align: center;
}

@media only screen and (max-width: 768px) {
  #contentArea section .center_wrap .resultPage .result {
    padding: 20px 10px;
  }
}
#contentArea section .center_wrap .resultPage .result.active {
  display: block;
}
#contentArea section .center_wrap .resultPage .result .lastMonth p {
  color: #333;
  font-size: 14px;
}
#contentArea section .center_wrap .resultPage .result p {
  color: #000;
  font-size: 1rem;
  text-align: center;
  display: inline;
}
#contentArea section .center_wrap .resultPage .result p.valueText {
  font-size: 1.6rem;
  font-weight: bold;
  color: #3a6cd6;
}
#contentArea section .center_wrap .resultPage .result .detail_info {
  padding: 16px 0 5px 2px;
  margin-top: 20px;
  border-top: 1px dashed #888;
}
#contentArea section .center_wrap .resultPage .result .detail_info p {
  font-size: 14px;
  line-height: 20px;
  padding-left: 4px;
  color: #333;
  display: block;
  text-align: left;
  margin: 0;
}
#contentArea section .center_wrap .resultPage .result .detail_info p em {
  color: #3a6cd6;
}
#contentArea section .center_wrap .resultPage .result .detail_info .addinfo {
  margin: 6px 0 6px 6px;
  padding-left: 10px;
}
#contentArea section .center_wrap .resultPage .result .detail_info .addinfo span {
  display: block;
  font-size: 12px;
  color: #797979;
  text-align: left;
}
#contentArea section .center_wrap .resultPage .result .detail_info .addinfo span em {
  color: #7189b8;
}
#contentArea section .center_wrap .resultPage .result .detail_info .addinfo.infoInner span {
  position: relative;
  opacity: 0.5;
  -webkit-opacity: 0.5;
  -moz-opacity: 0.5;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=(50));
}
#contentArea section .center_wrap .resultPage .result .detail_info .addinfo.infoInner span:before {
  content: '';
  display: block;
  position: absolute;
  background: #a8a8a8;
  top: 7px;
  left: -10px;
  width: 7px;
  height: 7px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  -webkit-transition: background 0.2s ease;
  -moz-transition: background 0.2s ease;
  -o-transition: background 0.2s ease;
  -ms-transition: background 0.2s ease;
  transition: background 0.2s ease;
}
#contentArea section .center_wrap .resultPage .result .detail_info .addinfo.infoInner span.active {
  opacity: 1;
  -webkit-opacity: 1;
  -moz-opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=(100));
}
#contentArea section .center_wrap .resultPage .result .detail_info .addinfo.infoInner span.active:nth-child(1):before {
  background: #ffd30f;
}
#contentArea section .center_wrap .resultPage .result .detail_info .addinfo.infoInner span.active:nth-child(2):before {
  background: #ff6600;
}
#contentArea section .center_wrap .resultPage .result .detail_info .addinfo.infoInner span.active:nth-child(3):before {
  background: #ff0800;
}
#contentArea section .center_wrap .resultPage .result .detail_info .addinfo.infoInner span.active:nth-child(4):before {
  background: #3d0000dc;
}
#contentArea section .center_wrap .resultPage .result .detail_info .addinfo.necessary {
  opacity: 0.5;
  -webkit-opacity: 0.5;
  -moz-opacity: 0.5;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=(50));
}
#contentArea section .center_wrap .resultPage .result .detail_info .addinfo.necessary.active {
  opacity: 1;
  -webkit-opacity: 1;
  -moz-opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=(100));
}
.saleBtnWrap {
  margin: 32px auto 0px;
  display: table;
  text-align: center;
  border: 1px solid #b9c7db;
  padding: 4px 12px 4px 16px;
  -webkit-border-radius: 24px;
  -moz-border-radius: 24px;
  border-radius: 24px;
  cursor: pointer;
}
.saleBtnWrap h5 {
  vertical-align: middle;
  display: table-cell;
  line-height: normal;
  font-size: 1.1rem;
  color: #848e9c;
}
.saleBtnWrap.active h5 {
  color: #3a6cd6;
}
.toggle-btn {
  margin: 4px 0 0 10px;
  width: 60px;
  height: 26px;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  border-radius: 50px;
  display: inline-block;
  position: relative;
  background: #b9c7db;
  overflow: hidden;
  cursor: pointer;
  -webkit-transition: background-color 0.3s ease-in-out;
  -moz-transition: background-color 0.3s ease-in-out;
  -o-transition: background-color 0.3s ease-in-out;
  -ms-transition: background-color 0.3s ease-in-out;
  transition: background-color 0.3s ease-in-out;
}
.toggle-btn:hover .round-btn {
  -webkit-box-shadow: 1px 1px 10px #1f7af9;
  -moz-box-shadow: 1px 1px 10px #1f7af9;
  box-shadow: 1px 1px 10px #1f7af9;
}
.toggle-btn.active {
  background: #3a6cd6;
}
.toggle-btn.active .round-btn {
  left: 36px;
}
.toggle-btn .round-btn {
  width: 20px;
  height: 20px;
  background-color: #fff;
  border-radius: 50%;
  display: inline-block;
  position: absolute;
  left: 5px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.toggle-btn .round-btn:after,
.toggle-btn .round-btn:before {
  content: 'ON';
  display: block;
  position: absolute;
  color: #fff;
  font-size: 12px;
  top: 1px;
}
.toggle-btn .round-btn:before {
  left: -25px;
}
.toggle-btn .round-btn:after {
  content: 'OFF';
  left: 24px;
  top: 0px;
}
.toggle-btn .saleBtn {
  position: absolute;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  -webkit-opacity: 0;
  -moz-opacity: 0;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=(0));
  z-index: 9;
  cursor: pointer;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}
.made-with-love {
  position: fixed;
  left: 0;
  width: 100%;
  bottom: 10px;
  text-align: center;
  font-size: 10px;
  z-index: 9999;
  font-family: arial;
  color: #fff;
}
.made-with-love i {
  font-style: normal;
  color: #F50057;
  font-size: 14px;
  position: relative;
  top: 2px;
}
.made-with-love a {
  color: #fff;
  text-decoration: none;
}
.made-with-love a:hover {
  text-decoration: underline;
}
.arr_down {
  position: relative;
  width: 100%;
  height: 50px;
  padding: 8px 0;
}
.arr_down svg {
  position: absolute;
  width: 25px;
  height: 25px;
  left: 50%;
  top: 50%;
  -webkit-animation: arrow 1.5s ease-out infinite;
  -moz-animation: arrow 1.5s ease-out infinite;
  -ms-animation: arrow 1.5s ease-out infinite;
  -o-animation: arrow 1.5s ease-out infinite;
  animation: arrow 1.5s ease-out infinite;
}
@-webkit-keyframes arrow {
  0% {
    transform: translate(-50%, -56%) scale(1.3);
  }
  70% {
    transform: translate(-50%, -50%) scale(1.3);
  }
  100% {
    transform: translate(-50%, -56%) scale(1.3);
  }
}
@-moz-keyframes arrow {
  0% {
    transform: translate(-50%, -56%) scale(1.3);
  }
  70% {
    transform: translate(-50%, -50%) scale(1.3);
  }
  100% {
    transform: translate(-50%, -56%) scale(1.3);
  }
}
@-ms-keyframes arrow {
  0% {
    transform: translate(-50%, -56%) scale(1.3);
  }
  70% {
    transform: translate(-50%, -50%) scale(1.3);
  }
  100% {
    transform: translate(-50%, -56%) scale(1.3);
  }
}
@-o-keyframes arrow {
  0% {
    transform: translate(-50%, -56%) scale(1.3);
  }
  70% {
    transform: translate(-50%, -50%) scale(1.3);
  }
  100% {
    transform: translate(-50%, -56%) scale(1.3);
  }
}
@keyframes arrow {
  0% {
    transform: translate(-50%, -56%) scale(1.3);
  }
  70% {
    transform: translate(-50%, -50%) scale(1.3);
  }
  100% {
    transform: translate(-50%, -56%) scale(1.3);
  }
}


.slidecontainer {
  width: 100%;
  padding: 30px 0px 30px;
}

@media only screen and (max-width: 991px) {
  .slidecontainer {
    width: 100%;
    padding: 20px 0px 0px;
  }

  .slidecontainer input[type=range] {

    height:60px;

  }



}



.slider {
  -webkit-appearance: none;
  width: 100%;
}
.slider:hover.slider::-webkit-slider-thumb {
  -webkit-box-shadow: 1px 1px 10px #1f7af9;
  -moz-box-shadow: 1px 1px 10px #1f7af9;
  box-shadow: 1px 1px 10px #1f7af9;
}
.slider:hover.slider::-moz-slider-thumb {
  -webkit-box-shadow: 1px 1px 10px #1f7af9;
  -moz-box-shadow: 1px 1px 10px #1f7af9;
  box-shadow: 1px 1px 10px #1f7af9;
}
.slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 30px;
  height: 30px;
  background: #fff;
  border: 4px solid #011035;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  cursor: pointer;
  -webkit-transition: all 0.2s ease-out;
  -moz-transition: all 0.2s ease-out;
  -o-transition: all 0.2s ease-out;
  -ms-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
  margin-top: -13px;
}
.slider::-moz-range-thumb {
  width: 20px;
  height: 20px;
  background: #fff;
  border: 2px solid #3a6cd6;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  cursor: pointer;
  -webkit-transition: all 0.2s ease-out;
  -moz-transition: all 0.2s ease-out;
  -o-transition: all 0.2s ease-out;
  -ms-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
  margin-top: -8px;
}
.slider::-webkit-slider-runnable-track {
  width: 100%;
  height: 3px;
  background: #b9c7db;
  border: none;
  border-radius: 3px;
}
.slider::-ms-track {
  height: 5px;
  background: transparent;
  border-color: transparent;
  border-width: 6px 0;
  color: transparent;
}
.slider::-ms-thumb {
  border: none;
  height: 16px;
  width: 16px;
  border-radius: 50%;
  background: #3a6cd6;
}
.slider::-ms-fill-lower {
  background: #3a6cd6;
  border-radius: 10px;
}
.slider::-ms-fill-upper {
  background: #b9c7db;
  border-radius: 10px;
}
#bottom {
  width: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
#bottom .link_mail {
  padding-top: 20px;
  font-size: 0.9rem;
  text-align: center;
}
#bottom .link_mail a {
  display: inline-block;
  padding: 2px 24px 2px 8px;
  background: #898891 url("https://images.joins.com/newsroom/2018/0717_restaurant/icon_link.png") 92% center no-repeat;
  background-size: 12px;
  color: #fff;
  font-size: 0.8rem;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  transition: all 0.5s ease;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}
#bottom .link_mail a:hover {
  text-decoration: none;
  background: #333 url("https://images.joins.com/newsroom/2018/0717_restaurant/icon_link.png") 92% center no-repeat;
  background-size: 12px;
}
@media only screen and (max-width: 768px) {
  #bottom .link_mail {
    padding-top: 50px;
    font-size: 0.8rem;
  }
  #bottom .link_mail a {
    font-size: 0.7rem;
  }
}
.byline_wrap {
  position: relative;
  background: #fff;
  padding: 50px 0 20px;
  z-index: 1;
}
.byline_wrap .byline {
  margin: 0 auto;
  max-width: 720px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.other_cont {
  position: relative;
  background: #fff;
  z-index: 1;
}
.other_cont .center_wrap {
  max-width: 720px;
}
.comment-wrapper {
  max-width: 720px;
}

/*------------------------------------------------
* End notice
------------------------------------------------*/
.close_notice{display: block;margin-top:20px;text-align: center;padding:30px;}
.notice_box{display: block;
    font-size: 20px;
    font-weight: 500;
    margin: 30px auto;
    border-radius: 50px;
    background: #ff3c00;
    padding: 11px;
    color: #fff;
    width: 30%;}
.close_notice .txt-boxx{display: block;}
.close_notice .txt-boxx span{display: block;color:#011035;font-size:18px;line-height: 1.3;margin-top:30px;font-weight: 600;}

@media only screen and (max-width: 768px) {
  .close_notice{display: block;margin-top:20px;text-align: center;padding:30px;}
  .notice_box{display: block;
      font-size: 16px;
      font-weight: 500;
      margin: 30px auto;
      border-radius: 50px;
      background: #ff3c00;
      padding: 11px;
      color: #fff;
      width: 30%;}
  .close_notice .txt-boxx{display: block;}
  .close_notice .txt-boxx span{display: block;color:#011035;font-size:15px;line-height: 1.3;margin-top:30px;font-weight: 600;}

}











.sideBann {
  position: absolute;
  width: 120px;
  height: 120px;
  top: 330px ;
  right: 15px;
  background-color: #33298d;
  color: #fff;
  border-radius: 20px;
  text-align: center;
}



.sideBann button {
  border:none;
  width: 120px;
  height: 120px;
  background:none;
  background-position: center center;
  background-repeat: no-repeat;
  transition: all .2s ease-out;
}

.sideBann .btn-survey-continue {


  height: 120px;

  background-position: center center;
  background-repeat: no-repeat;
  transition: all .2s ease-out;
}


.sideBann .btn-survey-continue span{

  font-family: 'Roboto', sans-serif;
  word-break: keep-all;
  text-align: left;
  font-size: 16px;

}




@media only screen and (max-width: 991px) {

  .sideBann {
   display: none;
  }



  .sideBann button {
    display: none;
  }

  .sideBann .btn-survey-continue {
    display: none;
  }




}