@charset "utf-8";
/* CSS Document */


html {font-size: 15px;}
.wrap {width: 100%;}
.headerWrap {width: 100%; height: auto; padding-bottom: 5vw; position: relative; background: #e8e8e8;}
.header {/*height: 711px;*/ min-width: 100%; min-height: 100%; width:auto; height:auto; background: url("../images/top_bg.png") no-repeat top; padding-top: 7.69vw; padding-bottom: 2vw; }
.headcopy2 { color: #FFFEB9; font-weight: 600; font-size: 2.1rem; letter-spacing: -1px; padding-bottom: 1.4%;}
.headcopy { color: #80FF2C; font-family:'Do Hyeon','NotosansKR', sans-serif; font-size: 4.2rem; } 

.header .event { padding-top: 3%; z-index: 999999;}
.header h1 img{width: 100%;}
.top_product_area {width: 312px; height: 275px; position: absolute; bottom:0; right: 4%; z-index: 999;}
.top_product_area img{width: 100%;}
.section01 {width: 100%; height: auto; background: #e8e8e8; padding:0 0 4.9vw;}
.section_title {padding-bottom: 3vw; font-family:'Do Hyeon','NotosansKR', sans-serif; font-size: 2.9rem; text-align: center;}
.txt_item2 {font-size: 1.2rem;}
.txt_dartkgray {color: #444;}
.txt_yellowgreen {color: #80FF2C;}
.txt_white {color: #fff;}

.section01_con {margin: 0 auto;}
.section01_con div {width: 100%; vertical-align: top;}
.section01_con div img {vertical-align: top;}
.section02 {width:100%; min-height: 100%; height: auto; background: url(../images/bg_section02.png) repeat-x left; padding:3vw 0 4.9vw;}
.section02_img img{width: 99%;}
.section02 .col-12 img {width: 56%;}
.section05_txt img{ padding: 4% 0 5.2%;}
.section05_btn{padding-top: 2.8%;}

.section03 {width: 100%; height: auto; padding:3vw 0 2.8vw;}
.section02_title {width: 100%; font-size: 2rem; font-weight: bold; color: #555; padding: 2vw 0 3vw;}
.sec03_subtxt {font-size: 1.6rem; padding-bottom: 0.6vw;}
.stop_img img {margin-bottom:2.8vw ; width: auto;}
.howWrap {width: 100%; height: auto;}
.how_womanbg, .how_babybg, .how_storebg, .how_parentsbg {width: 100%; height: auto; padding-bottom: 5.4vw;}
.how_womanbg {background: url("../images/how_woman_bg.png") repeat-x;}
.how_babybg {background: url("../images/how_baby_bg.png") repeat-x;}
.how_storebg {background: url("../images/how_store_bg.png") repeat-x; }
.how_parentsbg {background: url("../images/how_parents_bg.png") repeat-x; }


.how_wom {width: 100%;}
.how_wom img{width: 100%;}
.how_intro {width: 100%;}
.how_intro div {float: left; padding-right: 2vw; }
.how_intro div:last-child{padding-right: 0;}
.how_intro div  img{width: 100%;}
.woman_box { position: relative; }
.bg2 {width: 74px; height: 42px; margin: 0 auto;}
.bg2 img{width: 100%;}


.section04 {width: 100%; height: auto; background: #f5f1e7; padding:3vw 0 3.9vw;}
.section_subtitle {font-size: 1.6rem; font-weight: bold; letter-spacing: -1px; text-align: center;}
.txt_gray {color: #acacac;}
.greenbox, .navybox {background: #fff; box-shadow: 5px 5px 6px rgba(0, 0, 0, .2); }
.greenbox {border: 10px #4dac24 solid; padding: 1.1vw; max-width: 606px;}
.greenbox .product_title_green{font-size: 1.8rem; font-weight: bold; color: #4dac24; padding-bottom: 1.1vw; border-bottom: 1px solid #E7E7E7;}
.greenbox .priceBox_green, .navybox  .priceBox_navy {width: 100%; padding: 0.8vw 0; font-weight: bold; margin-top: 2%;}
.greenbox .priceBox_green {border: 2px solid #4dac24; font-size: 1.6rem; color: #4dac24;}
.prodcut_con, .prodcut_con_navy {width: 100%; padding-top: 1.2vw;}
.prodcut_con p{float:left; margin-right: 1vw;}
.navybox {border: 10px #314c75 solid;  padding: 1.1vw;max-width: 327px;}
.navybox .product_title_navy{font-size: 1.8rem; font-weight: bold; color: #314c75; padding-bottom: 4%; border-bottom: 1px solid #E7E7E7;}
.navybox .priceBox_navy {border: 2px solid #314c75; font-size: 1.6rem; color: #314c75;}
.txt_prodcut {width:auto; font-size: 1.3rem; font-weight: bold;}
.prodcut_img {padding-right: 1.3vw; padding-bottom: 1.4vw; float: right;}
.product_img_navy {padding: 0.8vw 0;}
.txt_txt02 {color: #e03f3b; padding: 0.2vw 0 0.4vw; font-weight: bold;}

.section05 {width: 100%; height: auto; padding: 2.5vw 0 4.9vw; background: url("../images/event_bg.png") no-repeat center bottom;}

.section06 {width: 100%; height: auto; padding: 1.4vw 0 0 0; background: #314C75;}
.count_num {display: inline; color: #80FF2C; padding-left:4vw;}
.count_num .txt_number {font-size: 6.2rem; font-weight: bold;}
.count_num .txt_small {font-size: 1.2rem; font-weight: bold;}

.section07 {width: 100%; height: auto; padding: 3vw 0 3.9vw; background: #E7E7E7;}
.teamBox {width: 258px; height: 363px; position: relative;}
.team01,.team02,.team03,.team04 {width: 258px; height: 306px; background: url("../images/team_picture01.png") no-repeat; position: relative; margin: 0 auto; display: block;}
.team01 {background-position: 0 0;}
.team01:hover {background-position: 0 bottom;}
.team02 {background-position: -301px 0;}
.team02:hover {background-position: -301px bottom;}
.team03 {background-position: -602px 0;}
.team03:hover {background-position: -602px bottom;}
.team04 {background-position: -900px 0;}
.team04:hover {background-position: -900px bottom;}
.team_name {width: 100%; font-size: 1rem; color: #000; font-weight: bold; position: absolute; bottom: 0;}
.team_name span {color: #acacac;}
.team05,.team06,.team07,.team08 {width: 258px; height: 306px; background: url("../images/team_picture02.png") no-repeat; position: relative; margin: 0 auto; display: block;}
.team05 {background-position: 0 0;}
.team05:hover {background-position: 0 bottom;}
.team06 {background-position: -301px 0;}
.team06:hover {background-position: -301px bottom;}
.team07 {background-position: -602px 0;}
.team07:hover {background-position: -602px bottom;}
.team08 {background-position: -900px 0;}
.team08:hover {background-position: -900px bottom;}


.section08 {width: 100%; height: auto; padding: 3vw 0 1.4vw; background: #263f67;}
.faqBox {width: 100%; font-size: 1.2rem; color: #fff; }
.faqBox img{display: inline-block; padding-right: 3px;}
.btn_faq {padding:2% 0 3.8% ;}
.mapbox {width: 100%; height: 320px; background: #acacac;}
.company_info {color: #fff;}
.txt_item {font-size: 1rem; padding-bottom: 0.3%; color:#acacac;}
.txt_call {font-size: 1.4rem; font-weight: bold;}
.txt_info {font-size: 1rem; padding-bottom: 1.8%;}
.btn_sns {padding:0.7vw 0 1.8vw 0 ; height: 46px; }
.btn_sns a.btn_facebook, .btn_sns a.btn_youtube, .btn_sns a.btn_ins { background: url("../images/btn_sns.png") no-repeat;}
.btn_sns a { display: block; float: left; width:46px; height: 46px; margin-right: 16px;}
.btn_sns a.btn_facebook {background-position: 0 0;}
.btn_sns a.btn_youtube {background-position: -59px 0;}
.btn_sns a.btn_ins {background-position:-122px 0;}
.txt_copyright {font-size: 0.8rem; color: #acacac; padding-top: 2vw;}
.pc_display_none {display: none; overflow: hidden;}
.pc_display_none2 {display: none; overflow: hidden;}

.txt_price_line {font-weight: normal; text-decoration: line-through; color: #DB6D6D; padding: 0 0 0.2vw 0; font-size: 1.4rem;}
.txt_price_small {font-size: 1.2rem; font-weight: normal;}

/* popup */
.blackWrap {width: 100%; height: 100%; background: rgba(0, 0, 0, .7); }
.popup_faqbox { max-width:55%; height: auto; position: relative; top: 40%;  margin: 0 auto; background: #fff; }
.popup_faqbox .titlebox {width: 100%; height: 72px; background: #4dac24; /*height: 82px;*/ position: relative; }
.popup_faqbox .title_txt img {margin: 0.5vw 0 0 0;}
.modal-header { background-color: #4dac24; }
.modal-title { color: #fff; padding: 1.1vw 0 0 1.8vw; font-size: 2rem; }
.modal-title span { font-weight: bold; font-size: 2.1rem; }
.close { color:#fff; opacity: 100%; font-size: 2.4rem; }
.title_txt {width: 80%; vertical-align: bottom; float: left; text-align: left; padding-left: 3vw; position: absolute; bottom: 0;}
.title_txt img {width: 80%;}
.btn_close {width: 19%; position: absolute; right: 1vw; top: 1vw; text-align: right;}
.popup_con {padding: 1.4vw 2vw; text-align: left;}
.faq_con_box {border:1px solid #ddd; margin-bottom: 2vw; border-radius: 8px; -webkit-border-radius:8px; -moz-border-radius:8px; background: url("../images/txt_q.png") no-repeat 1.5vw 1.6vw ;}
.faq_con_box p{padding-left: 3.8vw; font-weight: normal;}
.faq_con_box .question{font-size: 1.2rem; color: #4dac24; padding-top: 1.4vw;}
.faq_con_box .answer {font-size: 1.1rem; color: #222; padding-top: 0.7vw; padding-bottom: 1.3vw;}
  

  @media (min-width: 992px) {
    
  }

  @media (min-width:769px) and (max-width:992px) {
    .container {max-width: 90%;}
    .top_product_area {width: 230px; height: 193px; }
    .how_intro div {width: 50%;}
    .picture01 {width: 50%;}
    .woman_box {width: 49%;}
    .section02_title {font-size: 1.5rem;  padding: 2vw 0 3vw;}
    .section02_img img{width: 90%;}
    .prodcut_con p {margin-right: 1%;}
    .prodcut_con p.txt_small{font-size: 1.2rem}
    .prodcut_img {width:100%; padding-bottom: 1vw; float: none; text-align: center;}
    .prodcut_img img {width: 34%;}
    .product_img_navy img {width: 44%;}

    .teamBox {width: 208px; height: 306px; position: relative;}
    .team01,.team02,.team03,.team04 {width: 208px; height: 278px; background: url("../images/team_picture01.png") no-repeat; }
    .team01 {background-position: 0 0; background-size:449%; }
    .team01:hover {background-position: 0 -281px;  background-size:449%; }
    .team02 {background-position: -262px 0; background-size:449%; }
    .team02:hover {background-position: -262px -281px;  }
    .team03 {background-position: -491px 0; background-size:449%; }
    .team03:hover {background-position: -491px -281px;}
    .team04 {background-position: -708px 0; background-size:449%; }
    .team04:hover {background-position: -710px -281px;}
    .team05,.team06,.team07,.team08 {width: 208px; height: 278px; background: url("../images/team_picture01.png") no-repeat; }
    .team05 {background-position: 0 0; background-size:449%; }
    .team05:hover {background-position: 0 -281px;  background-size:449%; }
    .team06 {background-position: -262px 0; background-size:449%; }
    .team06:hover {background-position: -262px -281px;  }
    .team07 {background-position: -491px 0; background-size:449%; }
    .team07:hover {background-position: -491px -281px;}
    .team08 {background-position: -708px 0; background-size:449%; }
    .team08:hover {background-position: -710px -281px;}

    .w576_sec06_width {padding-left: 13%;}
    .w576_center {text-align: center;}
    .m_center {text-align: center;}
    .pc_display_none {display: none; overflow: hidden;}
    .section_title {padding-bottom: 3vw; font-size: 2.5rem; }
    .greenbox_992_dis_none {display: none;}
    .count_num {display: inline; color: #80FF2C; padding-left:1.3vw;}
    .pc_display_none2 {display: none; overflow: hidden;}

    /*popup*/
    .popup_faqbox { max-width:70%;}
   .title_txt img {width: 90%;}
   .faq_con_box p {padding-left: 5.4vw;}
   .faq_con_box .answer {padding-right: 1vw;}

    
   
    /* .headerWrap {height: 711px; background: url("../images/top_bg.png") no-repeat top; }
    .section01 .title {width: 40%; text-align: center; margin: 0 auto;}
    .section01 .title img{margin: 3% auto;}
    .top_product_area {width: 312px; height: 275px; position: absolute; top: 480px; right: 4%; z-index: 999;} */
    
  }

  @media (min-width:576px) and (max-width:768px){ 
    .headcopy {font-size: 3.9rem;}
    .headcopy2 {font-size: 1.9rem;}
    .top_product_area {width: 170px; height: 133px; }
    .event img {width: 80%;}
    .picture01 {width: 50%;}
    .section02_img img {width: 110%;}
    .woman_box {width: 49%;}
    .section02_title {font-size: 1.3rem;  padding: 2vw 0 3vw;}
    .w576_center {text-align: center;}
    .w768_sec01_width div img {width:90%;}
    .m_center {text-align: center;}
    .w576_sec06_width {display: block; padding-left: 0;}
    .m_display_none {display: none; overflow: hidden;}
    .pc_display_none {display: block;}
    .prodcut_con p {margin-right: 1%;}
    .section_title {padding-bottom: 3vw; font-size: 2.1rem; }
    .greenbox {border: 8px #4dac24 solid; max-width: 100%; padding: 2vw;}
    .navybox {border:8px solid #314c75; max-width: 100%; padding: 2vw; margin: 0 auto;}
    .m_navybox_padding2 {margin-top: 5vw; margin-bottom: 5vw;}
    .section05_title img {width: 100%;}
    .section05_txt img {width: 62%;}
    .section05_btn img{width: 75%;}
    .section05 {background: url("../images/eventbg_m.png") no-repeat center bottom; padding-bottom: 25vw;}
    .stop_img img {width: 37%;}
    .teamBox {margin: 0 auto;}
    .pc_display_none2 {display: none; overflow: hidden;}
    .section06 img {}

    /*popup*/
    .popup_faqbox {max-width: 90%; margin: 0 auto;}
    .titlebox {height: 62px;}
    .title_txt {vertical-align: bottom;}
    .title_txt img {width: 80%;}
    .btn_close img {width: 28%;}
    .faq_con_box {border:1px solid #ddd; margin-bottom: 2vw; background: url("../images/txt_q.png") no-repeat 1.8vw 2vw ;}
    .faq_con_box p{padding-left: 7.6vw; padding-right: 1.4vw; }
    .faq_con_box .question{font-size: 1.2rem; color: #4dac24; padding-top: 2.5vw;}
    .faq_con_box .answer {font-size: 1.1rem; color: #222; padding-top: 0.7vw; padding-bottom: 2vw;}

  }

 @media (min-width:576px){
  /*.container, .container-sm {max-width: 558px;}
   .header .event img{width: 95%;} */
	/* .headerWrap {width:100%; height: 711px; background: url("../images/top_bg.png") no-repeat top; }
	.headerWrap .copyBox img {display: block;}
  .section01 {width:100%; }
  .section01 .title {width: 90%; margin: 0 auto; }
  .section01 .title img{width: 100%; margin: 5% auto;} */

  }
  @media (min-width:320px) and (max-width:576px) {
    .headcopy {font-size: 2.6rem; margin-bottom: 2vw;}
    .headcopy2 {font-size: 1.3rem;padding-bottom:0;}
    .header h1 img{width: 100%;}
    .header .event img{width: 90%;}
    .top_product_area {width: 90px; height: 79px; right: 1%; }
    .section_title {font-size: 1.7rem; }
    .section01 {padding-top: 3vw;}
    .section02 {padding: 6vw 0 5.9vw;}
    .section02 .col-12 img {width: 70%;}
    .section02_title {font-size: 1.2rem;}
    .section03 {padding: 5vw 0 2.8vw;}
    .sec03_subtxt {font-size: 1.1rem;}
    .sec03_title {font-size: 1.2rem;}
    .stop_img img {width: 36%; margin-bottom: 5vw;}
    .how_intro div {width: 30%;}
    .section04 {padding: 7vw 0 3.9vw;}
    .section_subtitle {font-size: 1.3rem;}
    .picture01 {width: 50%;}
    .woman_box {width: 49%;}
   
    .greenbox {border: 5px #4dac24 solid; max-width: 100%;  padding: 3vw;}
    .greenbox .product_title_green {font-size: 1.5rem;padding-bottom:1.8vw}
    .prodcut_con {text-align: center; height: 100%; display: block; padding-top: 2.2vw;}
    .prodcut_con p {margin-right: 1%; float: none; font-size: 1.1rem; font-weight: normal;}
    .prodcut_con_navy {padding-top: 2vw;}
    .txt_prodcut {font-size: 1.1rem; font-weight: normal;}
    .prodcut_img {float: none; text-align: center;}
    .txt_prodcut {float: none; text-align: center; margin: 0 auto;}
    .greenbox .priceBox_green, .navybox .priceBox_navy {padding:1.2vw;}
    .greenbox .priceBox_green {font-size: 1.4rem;}
    .navybox .priceBox_navy {font-size: 1.4rem;}
    .navybox {border:5px solid #314c75; max-width: 100%; padding: 3vw; margin: 0 auto;}
    .navybox .product_title_navy {font-size: 1.5rem; padding-bottom: 1.8vw;}
    .greenbox_992_dis_none {display: none;}
    .section05_title img{width: 92%;}
    .section05_txt img{ padding: 4% 0 5.2%; width: 70%;}
    .section05_btn{padding-top: 2.8%;}
    .section05_btn img{width:88%}
    .section05_date img {width: 80%;}
    .m_padding {margin-bottom: 4%;}
    .m_center {text-align: center;}
    .m_padding_2 {padding: 2% 0 5% 0;}
    .m_sec01_img div {padding-top: 8%;}
    .m_display_none {display: none;}
    .m_display_none_2 {display: none;}
    .pc_display_none {display: block;}
    .m_navybox_padding2 {margin-top: 5vw; margin-bottom: 5vw;}
    .section05_btn img{width: 82%;}
    .section05 {background: url("../images/eventbg_m.png") no-repeat center bottom; background-size: 80%; padding: 6vw 0 32vw 0;}
    .section06 img {width: 42%; margin: 3vw 0 0 0;}
    .count_num .txt_number {font-size: 3.4rem;}
    .section07 {padding: 6vw 0 6vw;}
    .teamBox {margin: 0 auto;}
    .company_info {text-align: center;}
    .bg2 {width: 44px; height: 28px;}
    .bg2 img {width: 80%; vertical-align: top; margin: 0 auto;}
    .section02_img_m img{margin-bottom: 7vw; width:70%;}
    .how_womanbg { }
    .how_babybg{}
    .how_storebg{ }
    .how_parentsbg {}
    .how_woman_txt, .how_baby_txt, .how_store_txt, .how_parents_txt {color: #fff; font-size: 0.9rem;  margin-top: 5vw; margin-bottom: 8vw;  width: 100%; padding: 1.8vw; text-align: center; }
    .how_woman_txt{  background: #db6d6d; }
    .how_baby_txt{ background: #f3a540; }
    .how_store_txt{ background: #5ecbb2; }
    .how_parents_txt {background: #b68ae8;}
    .faqBox p {text-align: center;}
    .company_info {margin-top: 5vw;}
    .btn_sns a {display: inline-block; float: none;}
    .mapbox {margin: 3vw 0 0 0;}
    .txt_copyright {padding: 7vw 0 3vw 0;}
    .section08 {padding: 6vw 0 1.8vw;}
    .faqBox {font-weight: normal; }
    .btn_faq img {width: 78%;}

    /* popup */
    .popup_faqbox {max-width: 92%; margin: 0 auto;}
    .title_txt {vertical-align: bottom;}
    .popup_faqbox .titlebox {height: 50px;}
    .title_txt img {width: 80%;}
    .btn_close img {width: 28%;}
    .faq_con_box {border:1px solid #ddd; margin-bottom: 2vw; background: url("../images/txt_q.png") no-repeat 1.8vw 2vw ;}
    .faq_con_box p{padding-left: 10vw; padding-right: 1.4vw; }
    .faq_con_box .question{font-size: 1.1rem; color: #4dac24; padding-top: 2.5vw;}
    .faq_con_box .answer {font-size: 1rem; color: #222; padding-top: 0.7vw; padding-bottom: 2vw;}
    .modal-title { padding: 1.1vw 0 0 1.8vw; font-size: 1.7rem; }
    .modal-title span { font-size: 1.8rem; }
    .close { color:#fff; opacity: 100%; font-size: 2.4rem; }
  }