
/* 팝업 */
/* @media (min-width: 1200px) {
  #lay_pop{display: none;} */
   /* 오늘 하루 보지 않기 팝업 */
/* button {
  border: 0;
  background: none;
  cursor:pointer;
}

.main_popup {
  border: 3px solid #fff;
  top: 50%; left: 50%; transform: translate(-50%, -50%);
  position: absolute;
  z-index: 1005;
  -webkit-box-shadow: 0px 13px 40px -6px #061626;
  box-shadow: 0px 13px 40px -6px #061626;
  width: 505px;
  height: auto;
  display: none;

  &.on {
    display: block;
    background-color: #fff;
  }

  .img_wrap img {width: 500px;}
  .btn_close {
    width: 32px;
    height: 32px;
    position: absolute;
    top: 17px;
    right: 17px;
    font-size: 0;
    border: 0;
    background: none;

    &::before {
      content: "";
      width: 2px;
      height: 32px;
      background-color: rgba(255, 255, 255, 0.5);
      position: absolute;
      top: 0;
      left: 15px;
      transform: rotate(45deg);
    }
    &::after {
      content: "";
      width: 32px;
      height: 2px;
      background-color: rgba(255, 255, 255, 0.5);
      position: absolute;
      top: 15px;
      left: 0;
      transform: rotate(45deg);
    }
  }
.btn_wrap{
  display: flex;
}
.btn_click {
  width: 100%;
  height: 45px;
  background-color: #333;
  text-align: left;
  color: #fff;
  font-size: 14px;
  display: block;
  padding: 0 15px;
  span {
    display: block;
    line-height: 40px;
    vertical-align: bottom;
    opacity: 0.8;
  }
}
.btn_click span a {color: #333;}
  .btn_today_close {
    width: 50%;
    height: 30px;
    float: left;
    background-color: #fff;
    text-align: left;
    color: #333;
    font-weight: 500;
    font-size: 14px;
    display: block;
    padding: 0 15px;
    span {
      display: block;
      line-height: 30px;
      vertical-align: bottom;
      opacity: 0.8;
    }
  }
  .btn_award {
    width: 50%;
    height: 30px;
    float: right;
    background-color: #fff;
    text-align: right;
    display: block;
    padding: 0 15px;
  }
  .btn_award a {
    display: block;
    color: #333;
    font-weight: 700;
    font-size: 14px;
  }
}
}

@media (max-width: 1199px) {
    .main_popup {display: none;}
}

@media (max-width: 430px) {
  #lay_pop {
    display: block;
    position: absolute;
    z-index: 9999;
    top: 8%;
  }
  #lay_pop img {
    width: 100%;
    height: auto;
    border: 5px solid #fff;
  }
  #lay_pop button {
    width: 50%;
    height: 30px;
    background: #fff;
  }
  .btn_award {float: left; text-align: left; padding-left: 3%;}
  .btn_award a {font-size: 700;}
  .lay_close {float: right; text-align: right; padding-right: 3%;}
} */

/*메인비쥬얼*/
section:last-of-type {height: auto;}
#mainvisual {width: 100%; height: 100vh; position: relative;}
.v_contents {width: 1200px; position: absolute; top:50%;left: 50%; transform: translate(-50%,-50%); text-align: center; color: #fff; text-shadow: 0 0 10px rgba(0,0,0,.1)}
.v_slide li .v_contents>h1 {font-size:90px; font-weight:600; letter-spacing:0;}
.v_slide li .v_contents>h1 span {display:block; font-size:12px; letter-spacing:0; margin: -10px 0 70px;}
.v_contents>h1 {font-size: 50px;font-weight: 500; height: auto; position: relative; top:30px; letter-spacing: 5px;}
.v_contents>h2 {font-size: 90px; height: auto; margin: 30px 0; font-weight: 600;}
/* .v_contents>h3 {font-size: 18px; height: auto; margin: 30px 0; letter-spacing: 3px;} */
.v_slide li .v_contents>h2 {font-size: 40px; margin: 20px 0; text-align: left; padding-left: 280px;}
.v_slide li:nth-of-type(2) .v_contents>h2:first-of-type {text-shadow: 6px 6px 10px rgba(0,0,0,.6);}
.v_slide li:nth-of-type(3) .v_contents>h2:nth-of-type(2) {text-shadow: 6px 6px 10px rgba(0,0,0,.6);}
.v_slide li:nth-of-type(4) .v_contents>h2:nth-of-type(3) {text-shadow: 6px 6px 10px black;}
.v_slide li:nth-of-type(5) .v_contents>h2:nth-of-type(4) {text-shadow: 6px 6px 10px black;}
.v_slide .v_contents>h2 span {display: inline-block; font-size: 18px; vertical-align: middle; margin-left: 15px;}
/* .v_contents>h1 b {font-size: 75px; font-weight: 700; } */
/* .v_contents>a {width: 150px; height: 50px; background-color: #185AC8; border-radius: 15px;text-shadow: none; line-height: 50px; color: #fff; margin: 0 auto; font-weight: 100; letter-spacing: 2px; transition: .2s;} */
/* .v_contents>a:hover {letter-spacing: 5px;} */
.v_slide {width: 100%; height: 100%;}
.v_slide>.slick-list,.v_slide>.slick-list>.slick-track {width: 100%; height: 100%;}
.v_slide>.slick-list>.slick-track>li {width: 100%; height: 100%; background-attachment:fixed; background-position: top center; background-repeat: no-repeat;}
.v_slide .slick-arrow {position: absolute; z-index: 998; top:50%; transform: translateY(-50%)rotate(90deg); width: 150px; height: 30px; background-color: #000; color: #fff; font-size: 30px; text-align: center; opacity: .5}
.v_slide .slick-arrow:first-child {left: -60px;}
.v_slide .slick-arrow:nth-child(3) {right: -60px;}
.v_slide .slick-dots {width: 100%; height: 10px; font-size: 0;  position: absolute; z-index: 998; bottom: 50px; text-align: center;}
.v_slide .slick-dots>li {display: inline-block; margin: 5px; width: 50px; height: 3px; background-color: #fff; transition: .3s}
.v_slide .slick-dots>li.slick-active {background-color: #bcbec0;width: 100px;}
    /*호버이벤트*/
    .v_slide .slick-arrow:hover {opacity: 1; background-color: #414042;}
    /*애니메이션*/
    li.slick-active .v_contents>h1 {animation: main_move01 1s .1s both}
    li.slick-active .v_contents>h2 {animation: main_move01 1s .2s both}
    li.slick-active .v_contents>h3 {animation: main_move01 1s .3s both}
    /* li.slick-active .v_contents>a {animation: main_move01 1s 1.1s both} */
    @keyframes main_move01 {
        from {transform: translateY(50px); opacity: 0}
        to {transform: translateY(0); opacity: 1}
    }

/*뉴스*/
#brand {width: 100%; padding: 200px 0;}
.b_title {width: 1200px; height: 100px; margin: 0 auto; font-size: 33px; font-weight: 700; color: #000; text-align: center;}
.b_slide {width: 1200px;height: 600px; margin: 0 auto;}
.b_slide>.slick-list>.slick-track>li {width: 1200px; height: 450px; margin: 0 150px; padding: 15px;}
.b_text {float: left; position: relative; width: 30%; height: 100%;}
.b_text>h1 {font-size: 23px; color: #333; font-weight:500;}
.b_text>h2 {font-size: 18px; color: #5b5b5b; font-weight:500;}
.b_text>h3 {font-size: 18px; color: #808080; font-weight:300}
/* .b_text>h3>p {display: inline-block; font-weight:500; color: #58595b;} */
.b_text>h4 {font-size: 16px; color: #808080; font-weight:300; margin-top: 30px;}
.b_text>a {position: absolute; bottom: 0; left: 0;}
.b_img {float: right; width: 60%; height: 100%; background-color: #fff; overflow: hidden;}
.b_img>img {width: 100%;; transition: .3s}
.b_slide .slick-arrow {position: absolute; top:30%; width: 40px; height: 40px; color: #000; font-size: 40px; opacity: .5;z-index: 998; transition: .2s}
.b_slide .slick-arrow:hover {opacity: 1; background-color: #414042; color: #fff}
.b_slide .slick-arrow:first-child {left: -10%}
.b_slide .slick-arrow:nth-child(3) {right: -10%}
.b_slide .slick-dots {width: 100%; height: 10px; font-size: 0;  position: absolute; z-index: 997; bottom: 50px; text-align: center;}
.b_slide .slick-dots>li {display: inline-block; margin: 5px; width: 50px; height: 3px; background-color: #bcbec0; transition: .3s}
.b_slide .slick-dots>li.slick-active {background-color: #888;width: 100px;}
    /*호버이벤트*/
    .b_img>img:hover {transform: scale(1.1)}

/*사업종류*/
#product {width: 100%; position: relative;}
.p_back {position: absolute; z-index: -999; right: 0; width: 50%; height: 100%; background-color: #1B3B1C; transition: 1s}
.p_tab {width: 1200px; margin: 0 auto; padding: 100px 0;}
.p_con {width: 100%; height: 650px;}
.p_title {width: 100%; height: 150px; font-size: 33px; font-weight: 700;}
.p_img {width: 60%; height: 500px; background-color: #ddd; float: left; overflow: hidden;}
.p_img>img {height: 100%; transition: .3s}
.p_text {position: relative; width: 40%; height: 500px; float: left; padding: 20px 0 0 50px; color: #fff}
.p_text>h2 {font-size: 26px; display: inline-block; margin-bottom: 20px; position: relative;}
.p_text>h2>p {display: inline-block; margin-right: 30px; width: 50px; height: 50px; position: relative; top:4px}
.p_text>h3 {font-size: 30px; font-weight: 700; line-height: 50px}
.p_text>h4 {font-size: 18px; font-weight: 100}
.p_text>a {position: absolute; right: 0; bottom: 0; color: #fff; border-color: #fff;}
.p_img {transform: translateX(-100%); transition: 1.5s .2s; opacity: 0;}
.p_text>h2 {width: 100%; transform: translateX(50%);transition: 1s .2s; opacity: 0;}
.p_text>h3 {width: 100%; transform: translateX(50%);transition: 1s .2s; opacity: 0;}
.p_text>h4 {width: 100%; transform: translateX(50%);transition: 1s .4s; opacity: 0;}
.p_con.slick-active .p_img,
.p_con.slick-active .p_text>h2,
.p_con.slick-active .p_text>h3,
.p_con.slick-active .p_text>h4 {transform: translateX(0); opacity: 1;}
.p_tab .slick-arrow {width: 0; height: 0; overflow: hidden;}
.p_tab .slick-dots {position: absolute; top:140px; right: 0;}
.p_tab .slick-dots>li {width: 120px; height: 40px;float: left; text-align: center;font-size: 0; border: 1px solid #fff; margin: 0 2px; color: #fff; transition: .2s;overflow: hidden;}
.p_tab .slick-dots>li:before {width: 100%; height: 100%; font-size: 20px; line-height: 35px; transition: .3s;}
.p_tab .slick-dots>li:nth-child(1):before {content: "ART"}
.p_tab .slick-dots>li:nth-child(2):before {content: "FACTORY"}
.p_tab .slick-dots>li:nth-child(3):before {content: "CAFE"}
/* .p_tab .slick-dots>li:nth-child(4):before {content: "Bedding"} */
.p_tab .slick-dots>li.slick-active,.p_tab .slick-dots>li:hover {background-color: #fff; color: #000; border: 1px solid #000;}
    /*호버이벤트*/
    .p_img>img:hover {transform: scale(1.1)}
    /*스크롤이벤트*/
    .p_back {width: 0; transition: 1s}
    #product.se.on .p_back {width: 50%;}
    .p_tab .slick-dots {opacity: 0; transition: 1s}
    #product.se.on .p_tab .slick-dots {opacity: 1}

/*사업안내*/
#process {width: 100%; padding-top: 100px}
.pr {width: 1200px; text-align: center; margin: 0 auto;}
.pr>h1,.pr>h2,.pr>h3,.pr>h4 {width: 100%;}
.pr>h1 {font-size: 18px}
.pr>h2 {font-size: 30px; font-weight: 500}
.pr>h3 {font-size: 16px; font-weight: 300;}
.pr_con {width: 100%; margin-bottom: 100px;}
.pr_con>li {height: 50px; padding: 0 15px; display: inline-block; font-size: 18px; font-weight: 500; border-right: 1px solid #000;}
.pr_con>li:last-child {border: none;}
.pr_con>li>p {width: 50px; height: 50px; display: inline-block;}
.pr_con>li>p:last-child {position: relative; top:-15px; margin: 0 10px;}
.pr_con>li>p>img {width: 45px; height: 40px; display: inline-block;}


/*인증현황*/
/* #certification {width: 100%;} */
/* .ce_back {width: 100%; background-image: url(../img/back_img03.jpg); background-attachment:fixed; height: 400px; margin-top: 50px; background-position: 0 70px;} */
#co {width: 100%; height: 1200px; background-image: url(../img/back_img05.jpg); background-size: cover; background-position: center; background-attachment: fixed; /* color: #fff; */ text-align: center;}
.co {width: 100%; height: 100%; padding: 120px 0; margin: 0 auto; position: relative; background-color: rgba(255,255,255,.5);}
.co_text {position: relative; width: 1200px; height: 70px; margin: 0 auto;}
.t2 {margin-top: 100px;}
.co_text>h1 {display: inline-block; /* width: 200px; */text-align: center; font-size: 33px; font-weight: 500; line-height: 70px;margin-left: 87px;}
.co_text>ul {position: relative; width: 73%; height: 70px; display: inline-block;}
.co_text>ul>li {width: auto; height: auto;  display: inline-block; padding: 0 20px; font-size: 18px;}
.co_text>a {position: absolute; right: 20px; top: 20px; background-color: #000; color: #ddd; width: 80px;}
.co_img {width: 100%; height: 230px;}
.co_img>ul {width: 100%; height: 100%; padding: 40px 0; text-align: center;}
.co_img>ul>li {display: inline-block; width: 200px; height: 100%; text-align: center;}
.co_img>ul>li>img {height: 100%; box-shadow: 3px 3px 10px 0 rgba(0,0,0,.5); transition: .5s}
.co_img>ul>li>img:hover {transform: scale(1.2)}


/* 파트너 */
.esg_img {width: 100%;height: 380px; padding: 0 500px;}
.esg_img>ul {display: flex; flex-wrap: wrap; align-items: center; justify-content: space-around; margin-top: 50px; gap: 50px;}
.esg_img>ul>li {/* width: 33.333333%; */ margin-bottom:30px; display: flex; align-items: center;}
.esg_img>ul>li:nth-child(2)>img {/* width:200px; */ height: 51px;}

@media (max-width: 1500px) {
  .esg_img {padding: 0 310px;}
  .esg_img>ul>li>img {height: 35px;}
  .esg_img>ul>li:nth-child(2)>img {height: 48px;}
}
@media (min-width: 2100px) {
  .esg_img {padding: 0 30%;}
}
@media (min-width: 2400px) {
  .esg_img {padding: 0 33%;}
}