/* BASIC css start */
#mainWrap { margin:0 0px; /* max-width:1919px; */ min-width: 1200px; }


/* ¸ÞÀÎ ½½¶óÀÌµå ¹è³Ê */
#mainSlider {position:relative;z-index:10;min-width:1200px;}
#mainSlider .swiper-container { width: 100%; height: 100%; margin-bottom:1%; }
#mainSlider .swiper-slide { text-align: center; font-size: 18px; background: #fff; }
#mainSlider .swiper-slide img { width: 100%; display: block; height: auto;}
#mainSlider .swiper-button-next,
#mainSlider .swiper-button-prev { opacity:0; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; }
#mainSlider .swiper-container:hover .swiper-button-next,
#mainSlider .swiper-container:hover .swiper-button-prev { opacity:1; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; }
#mainSlider .swiper-button-next { right:50px; background:url('/design/zooyork77/deetong/arrow_right.png') 0 0 no-repeat; width: 28px; height: 60px;}
#mainSlider .swiper-button-prev { left:50px; background:url('/design/zooyork77/deetong/arrow_left.png') 0 0 no-repeat; width: 28px; height: 60px;}
#mainSlider .swiper-pagination-bullets { bottom:46px;}
#mainSlider .swiper-pagination-bullet { display:none; width:22px; height:2px; background:#fff; opacity:1; border-radius:0px !important; margin:0 0 0 0 !important;}
#mainSlider .swiper-pagination-bullet-active { background:#737373;}
/* ¸ÞÀÎ ½½¶óÀÌµå ¹è³Ê */


/* ´õºíÀ̽´ ¹è³Ê */
#mainWrap .main_bn01 { width:80%; margin:0 auto; }
#mainWrap .main_bn01 img { width:100%; }
#mainWrap .main_bn01 img:hover{opacity: 0.9;
transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-webkit-transition: all 0.5s ease;
-o-transition: all 0.5s ease;}
/* ´õºíÀ̽´ ¹è³Ê */


/* Çà ¹è³Ê */
#mainWrap .main_bn02 { margin:0 auto; width:80%; overflow:hidden; background-color:#f1f1f1; margin-top:1%; display: grid; grid-template-columns: 2fr 1fr; grid-column: 1 / 7; grid-row: 2 / 3;}
#mainWrap .main_bn02 li { float:left; position:relative; }
#mainWrap .main_bn02 img { width:100% }
#mainWrap .main_bn02 .text1 { font-family: Roboto; position:absolute; left:0; top:40%; width:100%; margin-top:-8px; font-size: 2.3vw; line-height:9vw;; color:#000; font-weight:700; text-align:center }
#mainWrap .main_bn02 .text2 { font-family: Roboto; position:absolute; left:0; width:100%; bottom:5%; font-size: 1vw; line-height:3.5vw;; color:#000; font-weight:700; text-align:center }
#mainWrap .main_bn02 li img:hover{opacity: 0.9;
transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-webkit-transition: all 0.5s ease;
-o-transition: all 0.5s ease;}
/*Çà ¹è³Ê */




/* Å¥·¹ÀÌÆà ¹è³Ê */
#mainWrap .main_bn03 { width:80%; margin:0 auto; overflow:hidden; margin-bottom:50px; margin-top:1%;}
#mainWrap .main_bn03 .box01 li .curate { font-family:'Roboto'; color:#7c7c7c; display: inline-block; text-align: left; font-size: 0.8vw; line-height:2.3vw; font-weight:500; text-decoration:underline; }
#mainWrap .main_bn03 .box01 li .contents_q { width: 91%; display: inline-block; text-align: left; line-height: 1.5vw; font-size: 1vw; font-weight: 600; }
#mainWrap .main_bn03 .box01 li .contents_b { width: 91%; display: inline-block; text-align: left; font-size: 0.8vw; line-height: 1.4vw; margin-top: 10px;}
#mainWrap .main_bn03 .box01 li .tx a {font-family: Roboto; width:90%; display:inline-block; text-align:left; height:auto; line-height:4.5vw; font-size:0.8vw; color:#000; font-weight:500; margin:20px 0 70px 0;}
#mainWrap .main_bn03 h3 {color:#000; font-weight:500; font-family:Roboto; font-size:35px;  line-height:70px; text-align:left; padding-left:1%; margin-top:30px;}
#mainWrap .main_bn03 h1 { color:#737373; font-weight:500; font-family:Roboto; font-size:18px; line-height:20px; text-align:left; margin-top:15px; text-decoration:underline; }
#mainWrap .main_bn03 p { color:#000; font-weight:700; font-family:Roboto; font-size:18px; height:70px; line-height:40px; text-align:left; margin-bottom:100px; }
#mainWrap .main_bn03 span { color:#000; font-weight:500; font-family:Roboto; font-size:18px; height:70px; line-height:40px; text-align:left; margin-bottom:100px; }
#mainWrap .main_bn03 .box01 li { width:33.333%; height:auto; float:left; text-align:left; box-sizing:border-box; overflow:hidden; }
#mainWrap .main_bn03 .box02 li { width:50%; height:auto; float:left; text-align:center;  box-sizing:border-box; overflow:hidden; }
#mainWrap .main_bn03 li:hover{opacity:1}
#mainWrap .main_bn03 li img { width:100%; height:auto; display:block; }
#mainWrap .main_bn03 li img:hover{opacity: 0.9;
transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-webkit-transition: all 0.5s ease;
-o-transition: all 0.5s ease;}
/* Å¥·¹ÀÌÆà ¹è³Ê */




/* ½½¸¯½½¶óÀÌ´õ(Å¥·¹ÀÌÆÃ) */
#mainWrap .slick-dots li button:before {display:none;}
#mainWrap .qslider {width: 85%; margin: 0 auto;}
#mainWrap .slick-slide {margin: 20px 10px 10px 0;}
#mainWrap .slick-slide img { width: 100%; }
#mainWrap .slick-prev:before,
#mainWrap .slick-next:before { color: black; }
#mainWrap .slick-slide {transition: all ease-in-out .3s; opacity: 0}
#mainWrap .slick-active { opacity: 1; }
#mainWrap .slick-current { opacity: 1; }
#mainWrap .slick-next::before { content: "¡æ"; }
#mainWrap .slick-prev:before {content: '¡ç';}  

#mainWrap .qslider .curate { font-family:'Roboto'; color:#7c7c7c; display: inline-block; text-align: left; font-size: 0.8vw; line-height:2.3vw; font-weight:500; text-decoration:underline; }
#mainWrap .qslider .contents_q { width: 91%; display: inline-block; text-align: left; line-height: 1.5vw; font-size: 1vw; font-weight: 600; }
#mainWrap .qslider .contents_b { width: 91%; display: inline-block; text-align: left; font-size: 0.8vw; line-height: 1.4vw; margin-top: 10px;}
#mainWrap .qslider .tx a {font-family: Roboto; width:90%; display:inline-block; text-align:left; line-height:4.5vw; font-size:0.8vw; color:#000; font-weight:500; margin:20px 0 25px 0;}
#mainWrap .qslider:hover{opacity:1}
#mainWrap .qslider img { width:100%; height:auto; display:block; }
#mainWrap .qslider img:hover{opacity: 0.9;
transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-webkit-transition: all 0.5s ease;
-o-transition: all 0.5s ease;}
/* ½½¸¯½½¶óÀÌ´õ(Å¥·¹ÀÌÆÃ) */





/* Àú³Î ¹è³Ê */
#mainWrap .main_bn04 .tit1 .tx1 { font-family: 'Roboto'; font-size: 2vw; line-height:2.5vw;; color:#000; font-weight:700; text-align:center }
#mainWrap .main_bn04 .tit1 .tx2 { font-family: 'Roboto'; font-size: 0.8vw; line-height:1.5vw;; color:#000; font-weight:500; text-align:center; color: #7c7c7c; margin-bottom:20px; }
#mainWrap .main_bn04 { width:80%; margin:0 auto; overflow:hidden; margin-bottom:50px; margin-top:1%;}
#mainWrap .main_bn04 h1 { color:#737373; font-weight:500; font-family:Roboto; font-size:0.8vw; line-height:1.5vw; text-align:left; margin-top:15px; text-decoration:underline; }
#mainWrap .main_bn04 p { color:#000; font-weight:700; font-family:Roboto; font-size:1vw; line-height:1.5vw; text-align:left;  }
#mainWrap .main_bn04 span { color:#000; font-weight:500; font-family:Roboto; font-size:18px; line-height:40px; text-align:left; }
#mainWrap .main_bn04 .box01 li { width:33.333%; height:auto; float:left; text-align:left; box-sizing:border-box; overflow:hidden; }
#mainWrap .main_bn04 .box02 li { width:50%; height:auto; float:left; text-align:center;  box-sizing:border-box; overflow:hidden; }
#mainWrap .main_bn04 li:hover{opacity:1}
#mainWrap .main_bn04 li img { width:100%; height:auto; display:block; }
#mainWrap .main_bn04 li img:hover{opacity: 0.9;
transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-webkit-transition: all 0.5s ease;
-o-transition: all 0.5s ease;}
/* Àú³Î ¹è³Ê */


/* Ŭ·Îµù ¹è³Ê */
#mainWrap .main_bn05 { width:80%; margin:0 auto; overflow:hidden; }
#mainWrap .main_bn05 li { float:left; width:49.5%; position:relative; }
#mainWrap .main_bn05 .text1 { position:absolute; left:25px; bottom:25px; font-size:1vw; color:#fff; font-family:'Roboto'; font-weight:700; text-align:left; }
#mainWrap .main_bn05 img { width:100%; margin-top:2%; }
#mainWrap .main_bn05 img.last { width:100%; margin-bottom:0px }
/* Ŭ·Îµù ¹è³Ê */


/* Á¦Ç°Áø¿­ ¿µ¿ª */
#mainWrap .pro_box { width:80%; margin:0 auto; }
#mainWrap .pro_box h3 { color:#000; text-align:left; margin-top:10px; margin-bottom:20px; width:99.5%}
#mainWrap .view_item { margin: 50px 0 200px; }
#mainWrap .viewbox { margin: 0 auto; border: 2px solid #000; width: 300px; text-align: center; height: 50px; font-family:Roboto; font-size:18px; line-height:50px; }
#mainWrap .viewbox:hover{ background: #f1f1f1;
-moz-transition: all 1s ease;
-webkit-transition: all 1s ease;
-o-transition: all 1s ease; }
#mainWrap .viewbox a{ font-family:Roboto; font-size:25px; }
/* Á¦Ç°Áø¿­ ¿µ¿ª */


/* ½ºÅ¸ÀϸµÇà ¹è³Ê */
#mainWrap .main_bn06 { margin:0 auto; width:80%; overflow:hidden; background-color:#f1f1f1; margin-top:1%; display: grid; grid-template-columns:1fr 2fr; grid-column: 7 / 1; grid-row: 3 / 2; margin-bottom:1%; }
#mainWrap .main_bn06 li { float:left; position:relative; }
#mainWrap .main_bn06 img { width:100% }
#mainWrap .main_bn06 .text1 { font-family: Roboto; position:absolute; left:0; top:40%; width:100%; margin-top:-8px; font-size: 2.3vw; line-height:9vw;; color:#000; font-weight:700; text-align:center }
#mainWrap .main_bn06 .text2 { font-family: Roboto; position:absolute; left:0; width:100%; bottom:5%; font-size: 1vw; line-height:3.5vw;; color:#000; font-weight:700; text-align:center }
#mainWrap .main_bn06 li img:hover{opacity: 0.9;
transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-webkit-transition: all 0.5s ease;
-o-transition: all 0.5s ease;}
/* ½ºÅ¸ÀϸµÇà ¹è³Ê */

#mainWrap .main_bn07 { width:80%; margin:0 auto; overflow:hidden; margin-bottom:1%; position:relative; }
#mainWrap .main_bn07 img {width:100%;}
#mainWrap .main_bn07 .text1 { font-family: Roboto; position:absolute; left:0; top:40%; width:100%; margin-top:-8px; font-size: 2.3vw; line-height:9vw;; color:#000; font-weight:700; text-align:center }
#mainWrap .main_bn07 .text2 { font-family: Roboto; position:absolute; left:0; width:100%; bottom:5%; font-size: 1vw; line-height:3.5vw; color:#000; font-weight:700; text-align:center }

/*½ºÅä¾î */
#mainWrap .main_bn08 { width:80%; margin:0 auto; overflow:hidden; }
#mainWrap .main_bn08 li { float:left; width:49.5%; position:relative; }
#mainWrap .main_bn08 .text1 { position:absolute; left:25px; bottom:25px; font-size:1vw; color:#fff; font-family:'Roboto'; font-weight:700; text-align:left; }
#mainWrap .main_bn08 img { width:100%; }
#mainWrap .main_bn08 img.last { width:100%; margin-bottom:0px }
/* ½ºÅä¾î */



span a:hover{ text-decoration:underline;}
.item-wrap .item-cont .item-list { float:left; width: 25%; padding: 0% 0.5% 1% 0.5%; box-sizing: border-box;}













/*¸¶Äû*/
section[data-scroll-section] { overflow: hidden; display: flex; justify-content: center; align-items: center; position: relative; }

.marquee_wrap { white-space: nowrap; font-size: calc(4.5vw); display: flex; align-items: center;  width: 100%; }

.marquee_box {  animation: marquee 500s linear infinite; font-weight: 700; }
.marquee_text { margin: 0 10vw 0 0; padding: 0; }
.marquee_text a { font-family:'Roboto'; font-weight:bold; }

@keyframes marquee {
  from { transform: translateZ(0) }
  to { transform: translate3d(-100%, 0, 0) }
}



/*¸¶Äû*/

























/* BASIC css end */