@charset "UTF-8";



/*서브*/
 #sub .header {background-color:#111}
#sub  footer {margin-top:7vw}

.sub_ct {padding:0 2.6vw; box-sizing:border-box; width:100%; display:block; }
.top_br {width:100%; height:5vw;   display:inline-block; background-color:#ddd;  }

 h2.guide {font-size:1.7rem; font-weight:600; color:#333; width:100%; display:inline-block; text-align:center; margin-bottom:2.6vw; line-height:1em;     }
 .shop h2.guide {font-size:2.7rem;   }

 h2.guide2 {font-size:2.7rem; font-weight:600; color:#333; width:100%; display:inline-block; text-align:center;   line-height:1em;  margin-bottom:2.6vw;     }

 h2.guide3 {font-size:1.2rem; font-weight:600; color:#333; width:100%; display:inline-block; text-align:center;  line-height:1em;     }

.guide_text {font-size:1.7rem; font-weight:400; color:#666; width:100%; display:inline-block; text-align:center; margin-bottom:1.8vw;  margin-top:-1.8vw  }


.top_empty {width:100%; height:75px; display:inline-block; }

.sub_menu_wrap {width:100%;  display:flex;   box-sizing:border-box;}
.sub_menu_wrap p.block {padding-right:4.1vw; width:140px; padding-left:2.6vw;   display:inline-block; background-color:red}

.sub_menu { margin-left:10px;  display:inline-block; margin-top:1.8vw; box-sizing:border-box; }
.sub_menu li {display:inline-block; font-size:1.3rem; padding-right:30px; line-height:1em}
.sub_menu li.ov  a {color:red !important}
 

.shop_h2 {width:100%;   font-size:1.7rem; font-weight:700; color:#111;  border-bottom:1px solid #ddd;  margin-bottom:1.6vw; padding-bottom:1.6vw;  line-height:1em; display:flex;  align-items:center;  box-sizing:border-box; }
.shop_h2 span {font-size:1rem; font-weight:400; color:#777; padding-left:50px; align-self:flex-end; line-height:1.6em}
.shop_h2 a {background-color:#111; color:#fff !important; padding:0 10px; margin-left:auto;   font-size:1.4rem; line-height:36px; font-weight:400; }

.kr {font-weight:500; letter-spacing:-3px}

.shop_h2_line {width:100%; height:1px; background-color:#ddd; display:inline-block; margin-bottom:1.8vw}



.box2 {box-sizing:border-box; }
.box2 h3 {font-size:1.7rem; line-height:1.3em; font-weight:500; color:#333; width:100%;  display:block; padding:1vw 0 0 0; box-sizing:border-box;      }
.box2 p.t {width:100%; color:#666; line-height:1.5em; font-size:1rem; font-weight:300;  box-sizing:border-box; 
overflow: hidden;
 text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3; /* 라인수 */
-webkit-box-orient: vertical;
word-wrap:break-word;  
}
.box2 p {margin-top: 0.8vw;    }

h3.s_tit  {width:100%; display:flex ; font-size:1.55rem; border-bottom:3px solid #333; margin-bottom:1.6vw; line-height:1em; color:#333; font-weight:600;    align-items:center; padding-bottom:1.6vw; }
h3.s_tit a { margin-left:auto; font-size:1.2rem; font-weight:500; color:#fff !important; padding:0 10px; line-height:36px; background-color:#333}

h3.type2 {padding-bottom:1vw; margin-bottom:1vw; border-bottom:1px solid #ddd}
h3.s_tit2  {width:100%; display:flex ; font-size:1.2rem;    line-height:1em; color:#333; font-weight:500; align-items:center; }
h3.s_tit2 a { margin-left:auto; font-size:1.2rem; font-weight:400; color:#555 !important; padding:0 10px; line-height:36px; background-color:#fff; border:1px solid #ddd; box-sizing:border-box}




.center_con {width:100%; max-width:1340px;   margin:0 auto;  }


.shop_home_bn {width:100%; line-height:0} 
.shop_home_bn img {width:100%; min-height:100% ; height:350px !important; }
.shop_home_bn_box {width:100%; line-height:1.3em; display:flex; justify-content:space-between}
.shop_home_bn_box div {width:100%; position:relative;  }
.shop_home_bn_box div h3 {font-size:1.7rem;  font-weight:500; padding-bottom:20px; color:#333;   }
.shop_home_bn_box:nth-child(1) div {width:50%; }
.shop_home_bn_box:nth-child(1) div:nth-child(1) {margin-right:14px}
 
 
 .shop_home_bn_box:nth-child(2) div:nth-child(1) {width:20%; margin:14px 14px 0 0}
 .shop_home_bn_box:nth-child(2) div:nth-child(2) {width:30%;  margin:14px 14px 0 0 }
 .shop_home_bn_box:nth-child(2) div:nth-child(3) {width:30%;  margin:14px 14px 0 0}
 .shop_home_bn_box:nth-child(2) div:nth-child(4) {width:20%;  margin:14px 0 0 0 }

 .shop_home_bn_box:nth-child(3) div {width:16.666%;   margin:14px 14px 0 0  }
 .shop_home_bn_box:nth-child(3) div:last-child {margin-right:0}

.shop_home_bn_box div div {font-size:1.1rem;  font-weight:300; color:#666; position:absolute; left:0; top:0; box-sizing:border-box; padding:30px 15px;   width:100% !important;  display:inline-block; margin:0 !important }



.shop_slide_br  {width:100%; height:5vw; display:inline-block; background-color:#f1f1f1}

ul.product_list {width:100%; display:flex; flex-wrap:wrap;   }
ul.product_list li {width:22.5%;  box-sizing:border-box;   line-height:0;   display:inline-block;  margin-right:3.3%; }
ul.product_list li:nth-child(4n) {margin-right:0%}
ul.product_list li:nth-child(n+5) {margin-top:2vw}

ul.product_list li img.b_img  {width:100%}
ul.product_list li h3 {font-size:1.2rem;  line-height:1.3em; font-weight:500; color:#333; width:100%;  display:block; margin-top:1vw; box-sizing:border-box;  overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2; /* 라인수 */
-webkit-box-orient: vertical;
word-wrap:break-word; 
}
ul.product_list li p {margin-top:0.8vw;  display:block; width:100%; font-size:1rem; line-height:1.3em;  }
ul.product_list li p.info_t {font-size:1rem; line-height:1.3em; font-weight:300; color:#555; width:100%; box-sizing:border-box;   color:red;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3; /* 라인수 */
-webkit-box-orient: vertical;
word-wrap:break-word; 
}
ul.product_list li p.name {font-size:1rem; color:#333}

p.color { width:100%; font-size:1rem;   line-height:1em; display:inline-block}
p.color .one {width:17px; height:17px; display:inline-block; border-radius:50%; background-color:#ddd; margin-right:3px} 

ul.product_list li p.pay {font-size:1rem; color:#666; font-weight:400;  width:100%; line-height:1.3em;   }
ul.product_list li p.pay  b {font-weight:600; color:#111; font-size:1.1rem; letter-spacing:0.5px;  font-family: 'Montserrat', sans-serif;  }
ul.product_list li p.pay span {text-decoration:line-through; color:#999; padding-left:5px; letter-spacing:0.5px; font-size:0.9rem; font-family: 'Montserrat', sans-serif;   }

 ul.product_list li .border_one {width:19px; height:19px;  border:5px solid #333;   }
ul.product_list li .total #heart {width:20px; height:17px; vertical-align:middle;  }
ul.product_list li .total #heart.red  { width:20px; height:17px;  }

  

ul.product_list li div.img {width:100%; padding-bottom:100%; overflow:hidden; position:relative;  display:inline-block;}
ul.product_list li div.img img {position:absolute; min-height:100%; width:auto;  max-width:100% }

ul.product_list li div.img_box  p {margin-top:0;  width:auto  }

 ul.product_list li div.list_in_product {width:100%; margin-top:1.6vw; display:flex; justify-content:space-between; align-items:center}
ul.product_list li div.list_in_product  img {width:35%; margin-right:5%  }
ul.product_list li div.list_in_product h3 { margin-top:0;} 
 


ul.col-3-list li {width:31.1%; margin-right:3.3% }
ul.col-3-list li:nth-child(3n) { margin-right:0}
ul.col-3-list li:nth-child(4n) {margin-right:3.3%;}
ul.col-3-list li:nth-child(n+4) {margin-top:2vw}

 
ul.col-2-list li {width:48%;  margin-right:4% }
ul.col-2-list li:nth-child(2n) {margin-right:0}
ul.col-2-list li:nth-child(4n) {margin-right:0}
ul.col-2-list li:nth-child(n+3) {margin-top:2vw}





/*슬라이드배너들*/
 

.event_box {width:100%; display:flex;  justify-content:space-between;  line-height:0 }
.event_box div.b_img  {width:67.2%;   margin-right:2.3vw; }
.event_box div.b_img img {width:100%}
.event_box div.text  {width:32.8%;  font-size:1.2rem; padding-top:6.3vw; position:relative;}
.event_box div.text h3 {font-size:1.7rem; line-height:1.3em; font-weight:500; color:#333; width:100%;  display:block; box-sizing:border-box;    }

.event_box div.text p.t {width:100%; color:#666; line-height:1.5em; font-size:1.3rem; font-weight:300; padding-top:2.1vw; padding-bottom:7.3vw; box-sizing:border-box;   }

 
.event_box div.product_box {width:100%;   position:absolute; bottom:0;  display:flex; flex-wrap:wrap; border-top:1px solid #ddd ;  border-bottom:1px solid #ddd}
.event_box div.product_box div {width:100%; display:flex; align-items:center;  box-sizing:border-box;  border-bottom:1px solid #ddd;   position:relative }


.event_box2 {width:100%; line-height:0; position:relative; border-top:1px solid #ddd; border-bottom:1px solid #ddd; box-sizing:border-box; min-height:530px;  }
.event_box2 div.b_img  {width:100%; }
.event_box2 div.b_img img {width:100%; min-height:530px; }
.event_box2 div.text  {width:45vw; border:1px solid red;  position:absolute; padding:0 0 0 0;  transform: translate(0, -50%); box-sizing:border-box; right:6vw; top:50%;   }
.event_box2 div.text h3 {font-size:2.7rem; line-height:1.3em; font-weight:500; color:#111; width:100%;  display:block; box-sizing:border-box;    }

.event_box2 div.text p.t {width:100%; color:#111; line-height:1.5em; font-size:1.3rem; font-weight:300; padding-top:1.8vw;  box-sizing:border-box; }
.event_box2 div.text p.date {width:100%; color:#111; line-height:1.5em; font-size:1rem; font-weight:600;   box-sizing:border-box; position:absolute; bottom:10.41vw ; letter-spacing:4px; }
.event_box2 div.text p.total {padding-top:1.8vw;  }
.event_box2 div.text p.writer2 {padding-top:1.8vw; text-align:right}



.event_box3 {width:100%; display:block;   }
.event_box3 ul {width:100%; display:flex; }
.event_box3 ul li {width:25%;   box-sizing:border-box; margin:0 1.25vw;  }
.event_box3 ul li:nth-child(1n) {margin-left:0}
.event_box3 ul li:nth-child(4n) {margin-right:0}
.event_box3 ul li img {width:100%}
.event_box3 ul li div.box {width:100%; display:inlne-block;  position:relative;  box-sizing:border-box; }
.event_box3 ul li div.box div { position:absolute;   top:0; width:100%; left:0;  padding:1.6vw; height:100%; box-sizing:border-box;}

.event_box3 ul li div.box h3 {font-size:1.7rem; font-weight:500; color:#333; margin-top:6.8vw; margin-bottom:1.8vw;  padding:0;    }
.event_box3 ul li div.box p {font-size:1.3rem; color:#777;  }
.event_box3 ul li div.box a { position:absolute; bottom:1.6vw; right:1.6vw; font-size:1.3rem; background-color:#333;  color:#fff; padding:0 10px}



.event_box4 {width:48.5%; line-height:0; position:relative; border-top:1px solid #ddd; border-bottom:1px solid #ddd; float:left; box-sizing:border-box; min-height:300px;  }
.event_box4:last-child {margin-left:3%}
.event_box4 div.b_img  {width:100%; }
.event_box4 div.b_img img {width:100%; min-height:530px; }
.event_box4 div.text  {width:100%; text-align:center;   position:absolute; padding:0 0 0 0;  transform: translate(0, -50%); box-sizing:border-box; right:0; top:50%;   }
.event_box4 div.text h3 {font-size:2.7rem; line-height:1.3em; font-weight:500; color:#111; width:100%;  display:block; box-sizing:border-box; padding-bottom:10px    }
.event_box4 .one_dday {width:100px; line-height:100px; border:2px solid #333; box-sizing:border-box; display:inline-block; position:absolute; right:30px; font-size:2rem; text-align:center; top:30px; font-weight:600; border-radius:50%}

/*뷰페이지*/

.view_img {width:63%; display:inline-block}
.view_img img {width:100%;}

.view_info_table  {width:33%; float:right; vertical-align:top;  display:inline-block; font-size:1rem ; box-sizing:border-box; margin-bottom:7.3vw; line-height:1.3em}
.view_info_table_wrap {width:100%; display:inline-block }
 

.view_info_table dd .label {width:70px; text-align:center; margin-bottom:5px }
.view_info_table dd.label_dd {margin-bottom:-5px}


.view_info_table h3 {width:100%;   margin-top:1vw; margin-bottom:1vw; font-size:2.0rem; font-weight:500}
.view_info_table .pay {width:100%;   margin-top:3.6vw; margin-bottom:1.8vw; font-size:2.0rem; font-weight:500; }
.view_info_table dd.pay {display:flex; justify-content:space-between}
.view_info_table .pay span {font-size:1rem; color:#555}
.view_info_table ul {width:100%}
.view_info_table ul li {width:100%; display:inline-block; margin-bottom:1.8vw; line-height:1.5em}
.view_info_table  dl {width:100%; display:block}
.view_info_table dl dt {  font-size:1.3rem; font-weight:500}
.view_info_table  dl dd   { font-size:1.1rem; font-weight:300;  line-height:1.5em}

.view_info_table  dl dd.pay { margin-top:0; margin-bottom:0;  }


.view_info_table ul li dl dt {width:30%; float:left;  }
.view_info_table ul li dl dd {width:70%;  float:left; }
.view_info_table a.btn {background-color:#333; color:#fff; width:48%; text-align:center;  display:inline-block; font-size:1.3rem; line-height:40px; margin-top:1.8vw}
.view_info_table a.btn:nth-child(1) {background-color:#fff;  border:1px solid #333; color:#333;  }



.view_info_table div.color { width:80px; font-size:1rem;   line-height:1em; display:inline-block}
.view_info_table div.color .one {width:20px; height:20px; display:inline-block; border-radius:50%; background-color:#ddd; margin-right:3px; margin-bottom:5px;}


.view_info_table .event_bn {width:100%; display:inline-block; background-color:#f3f3f3; box-sizing:border-box; padding:30px 30px; font-size:1.3rem; color:#333; font-weight:600}
.view_info_table .event_bn img {margin-top:3px;  float:right}

.view_info_table  .line {margin:1.8vw 0; background-color:#333}



.number  {width:100%; margin-bottom:1vw; border:1px solid #ddd;  box-sizing:border-box; padding:15px; font-size:0; display:flex; align-items:center; justify-content:space-between}

.number .t {font-size:1.1rem; line-height:1.3em; color:#777; width:60%; display:inline-block}
 .plus {font-size:0.9rem; color:#777; width:110px;  background-color:#f9f9f9;  text-align:center; display:inline-block;  display:flex; align-items:center; justify-content:space-between}
 .plus a {background-color:#333; color:#fff; text-align:center; width:30px; line-height:30px;  display:inline-block}
 .plus a {float:left}
 .plus a:last-child {float:right}
 
.number .close {font-size:1.1rem; color:#777; width:5%; text-align:right; display:inline-block}


.view_tab {width:100%; border-bottom:1px solid #ddd; font-size:0; display:block;  margin-bottom:1.8vw}
.view_tab li {font-size:1.3rem; line-height:50px; height:50px; display:inline-block; width:20%; background-color:#fff; box-sizing:border-box; }
.view_tab li a span {font-size:0.9rem; color:#666 !important}
.view_tab li a {display:inline-block; padding:0 23px }
.view_tab li.ov a {background-color:#333; color:#fff !important}
.view_tab li.ov a span { color:rgba(255,255,255,.7) !important}
 
 
/*이벤트 뷰*/

.event_top {width:100%; display:block;   box-sizing:border-box; line-height:0 }
.event_top img {width:100%}
.event_info_box {  }
.event_info_box  h3 {font-size:2.7rem; margin-bottom:10px}
.event_info_box span.label {margin-right:10px}
.content {width:100%; font-size:1rem; display:block; box-sizing:border-box; margin:3vw 0 }

.acodian_box {  width:100%;   box-sizing:border-box; display:inline-block; font-size: 1.05rem; line-height:1.35em; font-weight: 500; color:#666 }
.acodian_box a {cursor:pointer}
.acodian_box div {width:100%; display:flex; align-items:center; box-sizing:border-box;  border-bottom:1px solid #333; justify-content:space-between  }
.acodian_box p {padding:11px;   box-sizing:border-box;}
.acodian_box p:nth-child(1) {width:13%;  text-align: center; }
.acodian_box p:nth-child(2) {width:48%;  }
.acodian_box p:nth-child(3) {width:13%; text-align: center;}
.acodian_box p:nth-child(4) {width:13%; text-align: center;}
.acodian_box p:nth-child(5) {width:13%;  text-align: center;}

 
.acodian_box .td  p.name img {width:30px; height:30px; border-radius:50%; vertical-align:middle; margin-right:3px; margin-top:-2px}


.acodian .hide {display:none;}
.acodian .hide li {width:100%; display:inline-block; box-sizing:border-box;  background-color:#ddd;  }
.acodian .hide div.li_content {padding:11px 13px; margin-left:13%;  width:48%;  border-bottom:none; color:#333 }

.acodian .hide div.reply_div {  padding-bottom:15px}
.acodian .hide div.reply_div p {padding:0px 11px}
.acodian .hide div.reply_div div.reply_div_con  { width:48%; padding:0px 11px; box-sizing:border-box; display:flex; border-bottom:none;  justify-content:space-between }
.acodian .hide div.reply_div div.reply_div_con p {width:calc(100% - 50px); padding:0}


/*shop 문의하기*/

.reivew_reply p:nth-child(1) {width:15%; text-align:left; padding:10px 12px 7px 12px}
.reivew_reply p:nth-child(2) {width:65%;   }
.reivew_reply p:nth-child(3) {width:15%;   text-align: center;}

.reivew_reply .hide div.reply_div {  padding-bottom:0}
.reivew_reply .hide div.reply_div div.reply_div_con  {width:65%; padding:11px} 
.reivew_reply .hide div.reply_div p {padding:11px}



/*faq*/
.acodian_box_type3  {border-top:1px solid #333}
.acodian_box_type3 p:nth-child(1) {width:100px; text-align:center ; padding:12px}
.acodian_box_type3 p:nth-child(2) {width:calc(100% - 100px);  padding:12px}
.acodian_box_type3 .hide div {padding:0; margin-left:0;  width:100%;   }



/*쇼룸리스트*/

ul.showroom_list {width:100%;display:flex;   flex-wrap:wrap; line-height:0;  }
ul.showroom_list li {width:32%;  margin-right:2%; text-align:center; }
ul.showroom_list li:nth-child(3n) {margin-right:0}
ul.showroom_list li img {width:100%; }
ul.showroom_list li h3 {font-size:1.7rem; width:100%; display:inline-block; padding-top:2.1vw; color:#333;  padding-bottom:1vw; line-height:1.3em; font-weight:500}
ul.showroom_list li p {font-size:1.3rem ; line-height:1.3em; color:#666}


/*리뷰팝업*/
.review_wrap { display:flex; position:relative; width:90%; margin-left:5%;   background-color:#fff; }

.review_wrap .img {width:50%;  }
.review_wrap .img img {width:100%}
.review_box {width:48%; margin-left:2%;   position:absolute; right:0; max-height:100%; overflow-y:auto; padding:40px 40px;box-sizing:border-box; }
.review_box h3 {font-size:1.55rem;   width:100%; display:inline-block;  color:#333;  padding-bottom:1vw; line-height:1.3em; font-weight:500}
.review_box div.text {  font-size:1.2rem ; line-height:1.5em; padding:2vw 0; color:#777}
.review_box p.date { letter-spacing:0px; font-size:1rem; padding-right:20px; color:#555; font-weight:400; display:inline-block; line-height:30px}
.review_wrap .writer {position:static;  display:inline-block; }
.review_box span.label {border-radius:0; font-size:1.1rem; color:#666; line-height:25px; display:inline-block}

.review_box .re {width:100%; border-top:1px solid #333; border-bottom:1px solid #333; padding:15px 0;  margin-bottom:-1px; font-size:1.1rem; color:#666;}
.review_box .re p {width:100%; display:inline-block; padding-top:10px; font-size:1rem}
.review_box .re img.profile_img {width:27px; height:27px; border-radius:50%; vertical-align:-7px; }

/*서치탭*/
.search_tab {width:100%; display:inline-block;  margin-top:-1vw  }
.search_tab div {  display:flex; width:100%; margin-top:1vw ; align-items:center}
.search_tab h5 {width:10%; font-size:1.2rem}
.search_tab ul {width:90%;  }
.search_tab ul li {display:inline-block; margin-right:10px; border:1px solid #ddd;}
.search_tab ul li.ov {background-color:#333; border:1px solid #333}
.search_tab ul li.ov a {color:#fff; }
.search_tab ul li a {display:inline-block; font-size:1.2rem; line-height:28px; padding:0px 20px; }
.search_tab p.input {border-bottom:1px solid #333; height:30px;  }
.search_tab p.input input {border:none; height:30px; font-size:1em; color:#666}
.search_tab p.input img {width:25px; vertical-align:middle}
.search_tab p.left {width:10%; font-size:1.05rem; font-weight:400; color:#666;  }
.search_tab p.text {  font-size:1.05rem; font-weight:400; color:#666; }


.search_filter {width:100%;  display:flex; align-items:center; margin-top:1vw;  }
.search_filter p { font-size:1.3rem; margin-right:1vw}
.search_filter select { font-size:1.3rem; padding:2px 10px; margin-left:auto}
.search_filter img {vertical-align:middle; height:28px; margin-right:5px}



/*리뷰상세*/
.review_view {width:100%;   }
.review_view h3.top_tit {font-size:2.5rem; color:#333}
.review_view div.left {width: calc(100% - 350px); float:left; border-right:1px solid red; padding-right:50px; padding-top:60px; min-height:1200px; box-sizing:border-box; position:Relative}

.review_view div.left .name_box {width:100%; display:inline-block;   position:relative; font-size:1rem;}
.review_view div.left .name_box p.writer {left:0; top:0; font-size:1rem;}
.review_view div.left .name_box p.total {text-align:right; font-size:1rem;}

.review_view div.right {width:300px;  overflow:hidden; float:right; padding:0 0; box-sizing:border-box; margin-top:60px}


.review_view .view_content {width:100%; display:inline-block; margin-top:1.8vw}
.review_view .view_content div {margin-top:30px; width:100%; display:block}
.review_view .view_content .label {border-radius:20px; }

  

.recommend_list_wrap {width:100%; position:relative; height:1090px; text-align:center;}
.recommend_list_wrap .next_btn {position:absolute; bottom:0; left:50%; margin-left:-22px}

.recommend_list {height:990px;  width:100%;  margin-top:20px;  overflow:hidden;}
.recommend_list ul {  margin:0;   width:100%}
.recommend_list li {height:330px; text-align:left; background-color:#f1f1f1;  box-sizing:border-box;    }
.recommend_list li img {width:300px}


/*소파 하드소프트 단계*/


.progress_container {
 width:920px; border:1px solid red ;  display:inline-block; 
    height:110px;  left:50%; margin-left:-460px; position:relative; 

}
.progress_container .progress {
  
}

.progress_container .progress {
  width:100%; height:50px; 
  background:url('/common/img/progress_bg.jpg') no-repeat center;
  
}

.progress_container .progress-bar {
  height: 3px; 
   margin-left:3%;
   position:absolute;  
   top:37px;  
  
	
  -webkit-transition: 0.4s linear;
  -moz-transition: 0.4s linear;
  -o-transition: 0.4s linear;
  transition: 0.4s linear;
  -webkit-transition-property: width, background-color;
  -moz-transition-property: width, background-color;
  -o-transition-property: width, background-color;
  transition-property: width, background-color;
  -webkit-box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.25), inset 0 1px rgba(255, 255, 255, 0.1);
  box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.25), inset 0 1px rgba(255, 255, 255, 0.1);
}
 
#one:checked ~ .progress > .progress-bar {
  width: 0; 
  background-color: #f2b01e;
}

#two:checked ~ .progress > .progress-bar {
  width: 190px; 
  background-color: #f27011;
}

#three:checked ~ .progress > .progress-bar {
  width: 410px;
  background-color: #f63a0f; 
}

#four:checked ~ .progress > .progress-bar {
width: 635px;
  background-color: #f63a0f;
}

#five:checked ~ .progress > .progress-bar {
  width: 850px;
  background-color: red;
}

.progress_container .radio {
  display: none;
}

.progress_container .label {
  display: inline-block;
  position:absolute;
  padding: 3px 8px;
  color: #aaa;
  text-shadow: 0 1px black;
  border-radius: 3px;
  cursor: pointer; margin-top:60px;
}
.progress_container .label:nth-child(2) {left:10px;}
.progress_container .label:nth-child(4) {left:210px;}
.progress_container .label:nth-child(6) {left:430px;}
.progress_container .label:nth-child(8) {left:655px;}
.progress_container .label:nth-child(10) {left:870px;}



.progress_container .label:last-child {margin-right:0}
.progress_container .radio:checked + .label {
  color: white;
  background: rgba(0, 0, 0, 0.25);
}



 /*gudie*/

 .guide_top {width:100%; display:flex; align-items:center; height:18vw; margin-bottom:2.6vw; background-color:#ddd; padding: 0 2.6vw; box-sizing:border-box}
 .guide_top div {max-width:1340px; width:100%;   margin:0 auto; display:flex;  }
.guide_top h3 {font-size:2.7rem; line-height:1em ; letter-spacing:-2px}
.guide_top div p {font-size:1.2rem;   padding-left:40px; color:#444}


/**/

.info_box {width:100%; margin-bottom:1.6vw; display:flex; justify-content:space-between; align-items:center}
.info_box .img_box { width:48%;  }
.info_box .img_box img {width:100%}
 
.info_box img {width:48%;}

.info_box div {width:48%; }
.info_box div p {padding-bottom:1vw;  width:100%; display:inline-block; }
.info_box div p.t1 {font-size:1.7rem; color:#333; font-weight:600;  line-height:1.4em}
.info_box div p.t2 {font-size:1.2rem; color:#666; font-weight:400; }

.info_box div a.btn {background-color:#333; font-size:1.2rem; color:#fff; padding:2px 30px; margin-top:1.6vw; display:inline-block}

.info_box .writer2 {padding-top:1vw  }
.info_box span.line {margin-top:1vw}



 /*sysdesign*/

.sysdesign_info_box {width:100%; display:inline-block; background-color:#ddd; padding:3vw 0; margin-top:2.6vw}
.sysdesign_info_box div {max-width:1340px; width:100%;   margin:0 auto; display:flex}
.sysdesign_info_box h3 {font-size:2.7rem; line-height:1em;  text-align:center; letter-spacing:-2px }
.sysdesign_info_box h3 span {font-size:1.2rem; font-weight:500; width:100%; display:block; padding-top:15px;  line-height:1em; }
.sysdesign_info_box div p {font-size:1.2rem;   padding-left:40px; color:#444;   }




.clearfix_wrap {width:100%; display:flex; }
.clearfix {display:inline-block;     width: 47%;  line-height:0; font-size:0  }
.clearfix:nth-child(2n) {margin-left:6%}
.outer{
   width:100%;  padding-bottom:100%; display:inline-block; 
    /*height: 100%;
    width: 100%;*/
    background-color:#ddd;
	 box-sizing:border-box;
    overflow:hidden; position:relative
}

.clearfix h3 {font-size:2rem; line-height:1.3em; font-weight:600; color:#333}


.tt_box {position:absolute; top:0; left:0; width:100%; height:100%; box-sizing:border-box; padding:2.6vw; }
.tt_box img {position:absolute;  top:0; left:0; min-width:100%;  min-height:100%  }
.tt_box  h3 {position:relative;}
.tt_box span {width:45px; line-height:45px; text-align:Center; font-size:2rem; border:1px solid #333; display:inline-block; margin-top:30px; border-radius:50px; position:relative;}


.hover_box {
    width: 100%;
     height: 100%;
     margin-left: -100%; 
     -webkit-transition: all 0.8s ease;
    -moz-transition: all 0.8s ease;
    -o-transition: all: 0.8s ease;
    transitions: all 0.8s ease;
    background-color:#ddd;
	z-index:9999999;  position:absolute;
	 box-sizing:border-box; padding:2.6vw
}
.outer:hover > .hover_box{
    margin: 0;
}
.hover_box p {font-size:1rem; color:#555;   margin:0.8vw 0; line-height:1.5em}
.hover_box div.col-2 {display:flex; justify-content :space-between}
.hover_box div.col-2 p {width:47%; }

/*라이브*/

.live_bn {width:100%; display:flex; box-sizing:border-box; padding:7%; background-color:#ddd; align-items:center; justify-content:space-between ; margin-bottom:2vw}
.live_bn div:first-child {width:50%; text-align:center}
.live_bn h3 {font-size:2.7rem;}
.live_bn p {font-size:1.3rem; width:100%; display:inline-block; padding-bottom:2vw}
.live_bn a {width:150px; font-size:1.3rem; width:200px}