/* BASIC css start */
.main {overflow:hidden; position:relative;}

/* pc 메인 배너 */
.cover-dimm {position: absolute; top: 0; left: 0; height: 100%; width: 100%; background: rgba(0,0,0,0.4); z-index: 2;}

#main_bnr_swiper_pc .swiper-slide { position:relative;} 
#main_bnr_swiper_pc .swiper-slide .cont-wrap {width: 100%; height: 550px; position: relative;overflow: hidden;}
#main_bnr_swiper_pc .swiper-slide .cont-wrap video {position: absolute; bottom: 0; left: 0; object-fit: cover;width: 100%;}
#main_bnr_swiper_pc .swiper-slide .cont-wrap img { width: 100%; max-height:550px; object-fit:cover;} 
#main_bnr_swiper_pc .swiper-slide .main-txt-box {position: absolute;top: 0;left: 0; z-index: 3; display: flex; flex-direction: column; align-items: center; justify-content: center; color:#fff; width: 100%; height: 100%;} 
#main_bnr_swiper_pc .swiper-slide .main-txt-box h3 { font-size: 1vw; font-weight: 200; line-height: 1.1; margin-bottom: 0.8vw; } 
#main_bnr_swiper_pc .swiper-slide .main-txt-box h1 { font-size: 3vw; font-weight:600; line-height: 1.1; margin-bottom: 1.2vw; } 
#main_bnr_swiper_pc .swiper-slide .main-txt-box p { font-size: 0.8vw; font-weight: 200; line-height: 1.25; margin-bottom: 0.8vw; } 
#main_bnr_swiper_pc .swiper-slide .main-txt-box .line-btn { font-size: 0.8vw; font-weight: 600; line-height: 1.25; padding: 0.6vw 0.8vw; border: 1px solid #fff; background: rgba(255,255,255,0); color: #fff;}
#main_bnr_swiper_pc .swiper-slide .main-txt-box .line-btn:hover {background: rgba(255,255,255,1); color:#000;}
#main_bnr_swiper_pc .swiper-button-prev { left:30px; } 
#main_bnr_swiper_pc .swiper-button-next { right:30px; } 

#main_bnr_swiper_pc .swiper-pagination .swiper-pagination-progressbar-fill { background: #000; } 
#main_bnr_swiper_pc .btn_wrap { position: absolute; bottom: 25%; left: 44%; z-index: 2; } 
.control_btn { position:relative; } 
.control_btn .control { position:absolute; left:0; top:0; display:none; } 
.control_btn .control.on { display:block; } 
.control_btn .control a { cursor: pointer; display: flex; transition: all .1s; align-items: center; justify-content: center; width: 24px; height: 24px; background-color: #757575; } 
.control_btn .control a img { width:10px; } 
.control_btn .pause_btn.control a img { width:8px; } 




/* mo 메인 배너 */
#main_bnr_swiper_mo { position: relative; margin: 0; overflow: hidden; } 
#main_bnr_swiper_mo .swiper-slide a { display: block; } 
#main_bnr_swiper_mo .swiper-slide a img { width: 100%; } 
#main_bnr_swiper_mo .swiper-slide a .txt_wrap {position: absolute;bottom: 28px;left: 50%;transform: translateX(-50%);text-align: center;} 
#main_bnr_swiper_mo .swiper-slide a .txt_wrap p { color:#fff; } 
#main_bnr_swiper_mo .swiper-slide a .txt_wrap .txt_01 {font-size: 16px;font-weight: 600;line-height: 19.97px;margin-bottom: 10px;} 
#main_bnr_swiper_mo .swiper-slide a .txt_wrap .txt_02 {font-size: 32px;font-weight: 800;line-height: 39.94px;margin-bottom: 20px;white-space: pre;} 
#main_bnr_swiper_mo .swiper-slide a .txt_wrap .txt_03 {font-size: 16px;font-weight: 600;line-height: 19.97px;} 
#main_bnr_swiper_mo .swiper-button-prev { left: 0; } 
#main_bnr_swiper_mo .swiper-button-next { right: 0; } 


/* 아이콘 */
.ico_wrap { position: relative; padding: 32px 25px; overflow: hidden; } 
.ico_wrap ul { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px 0; } 
.ico_wrap ul li { width: 20%; text-align: center; } 
.ico_wrap ul li a { display: inline-block; } 
.ico_wrap ul li a img { max-width: 100%; margin-bottom: 6px; } 
.ico_wrap ul li a p { text-align: center; font-size: 12px; font-weight: 400; color: #494949; } 


/* 상품 롤링 */
#pd_swiper{padding: 0;}
#pd_swiper .swiper-slide {font-size:0;}
#pd_swiper .pd_bnr {position: relative;width: 49.5% !important;display:inline-block;vertical-align:top;margin-right:1.5%;}
#pd_swiper .pd_bnr img { width:100%; } 
#pd_swiper .txt_wrap {position: absolute;bottom: 25px;left: 15px;} 
#pd_swiper .txt_wrap p { color:#fff; } 
#pd_swiper .txt_wrap .txt_01 { font-size: 16px; font-weight: 400; line-height: 20px; text-align: left; margin-bottom: 10px; } 
#pd_swiper .txt_wrap .txt_02 { font-size: 22px; font-weight: 700; line-height: 20px; margin-bottom: 8px; } 
#pd_swiper .txt_wrap .txt_03 { font-size: 16px; font-weight: 400; line-height: 20px; } 
#pd_swiper .item-list { width: 24% !important; margin-right:1%; display:inline-block; position:relative; vertical-align:top;} 
#pd_swiper .item-list:last-child {margin-right:0;}}
#pd_swiper .item-list.flexed { display: inline-block; align-items: center; gap: 8px; } 
#pd_swiper .item-list.flexed .thumb {}
#pd_swiper .item-list.flexed .thumb img{}
#pd_swiper .item-list.flexed .prd-info {padding: 16px 8px 0;width: 100%;box-sizing:border-box;}
#pd_swiper .item-list.flexed .prd-info .prd-wish .my-wish-list{position:absolute; top:0; right:0;}
#pd_swiper .item-list.flexed .prd-info .prd-brand a {font-size: 16px;font-weight: bolder;margin-bottom: 8px;} 
#pd_swiper .item-list.flexed .prd-info .prd-name { margin-bottom: 10px; } 
#pd_swiper .item-list.flexed .prd-info .prd-name a { font-size: 14px; } 
#pd_swiper .item-list.flexed .prd-info .dc_per { font-size: 14px; margin-right: 9px; } 
#pd_swiper .item-list.flexed .prd-info .consumer { font-size: 14px; margin-right: 9px; } 
#pd_swiper .item-list.flexed .prd-info .normal { font-size: 14px; } 
#pd_swiper .item-list.flexed .prd-info .prd-color { display:none; } 
#pd_swiper .item-list.flexed .prd-info .prd-ico { display:none; } 
#pd_swiper .swiper-pagination { background: rgba(0, 0, 0, .3); width: 49%; top: auto; right:0; bottom:37px !important; height:4px;}
#pd_swiper .swiper-pagination .swiper-pagination-progressbar-fill { background: #000; } 
#pd_swiper .item-list.flexed .thumb a.soldout { font-size: 12px;}



/* 탭 롤링 */
.tab_cont { padding: 30px 40px !important; margin-bottom: 50px!important; max-width: 100%!important; }
#tab_swiper { margin: 0 0 25px; width: 100%; max-width:1400px;} 
#tabcont_swiper {max-width:1400px;}

#tab_swiper .swiper-slide a {display: inline-block;font-size: 15px;font-weight: 400;color: #000;padding: 12px 13.5px;white-space: pre;border: 1px solid #ddd;border-radius: 30px;line-height: 1;-webkit-transition: all .3s ease-in-out;-moz-transition: all .3s ease-in-out;-o-transition: all .3s ease-in-out;transition: all .3s ease-in-out;} 
#tab_swiper .swiper-slide.swiper-slide-thumb-active a { color: #fff; background: var(--point-color2); } 
.tab_cont .item-wrap { width: 100%; }

/* 서브 배너 롤링 */
.sub_bnr_wrap {position:relative;padding: 50px 40px; background: #FAF7F2;} 

.cont_tit {max-width:1400px; margin:0 auto;}
.sub_bnr_wrap #sub_bnr_swiper {padding:0; width: 100%;max-width:1400px;}
/*.sub_bnr_wrap #sub_bnr_swiper .swiper-slide { width: 33.3% !important; } */

.sub_bnr_wrap #sub_bnr_swiper .swiper-slide a { display: inline-block; width: 100%; height: 100%; position: relative; overflow: hidden; cursor: pointer;} 
/* .sub_bnr_wrap #sub_bnr_swiper .swiper-slide a::after {
  content: "";
  display: block;
  padding-bottom: 100%;
}
.sub_bnr_wrap #sub_bnr_swiper .swiper-slide a img { width:100%; position: absolute; object-fit: cover; } */
.sub_bnr_wrap #sub_bnr_swiper .swiper-slide a .bnr_txt {  margin: 21px 0 0 0; font-size: 16px; font-weight: 400; color: #000; } 
.sub_bnr_wrap #sub_bnr_swiper .swiper-slide a .bnr_txt p { font-size: 24px; font-weight: 700; margin-bottom: 12px; line-height: 24px; } 
body .sub_bnr_wrap #sub_bnr_swiper .swiper-pagination { background: rgba(0, 0, 0, .3); width: 88%; top: auto; left: 50%; transform: translateX(-50%); height:4px; display:none;} 
body .sub_bnr_wrap #sub_bnr_swiper .swiper-pagination .swiper-pagination-progressbar-fill { background:#000; } 
.sub_bnr_wrap .arrow_wrap { width: 100%; margin: 0 auto; position: absolute; top: calc((100% - 80px)/2); left: 50%; transform: translate(-50%, -50%); z-index: 10; } 
.sub_bnr_wrap .arrow_wrap div { width: 56px; } 
.sub_bnr_wrap .arrow_wrap .swiper-button-prev { left: 1vw !important; } 
.sub_bnr_wrap .arrow_wrap .swiper-button-next { right: 1vw !important; }
.sub_bnr_wrap .swiper-container .swiper-button-prev, .sub_bnr_wrap .swiper-container .swiper-button-next {opacity: 1; transition: none; visibility: visible;}


.square { position: relative; width: 100%; overflow: hidden;}
.square::after {content: ""; display: block; padding-bottom: 100%;}
.square img {width:101%; position: absolute; object-fit: cover; bottom:0}

.faq-wrap {width: 100%; height: 20vw; display: flex;}
.faq-img {width: 45%; height: 100%; background: url("/design/dogomedica/img/wearing.jpeg") no-repeat; background-size: cover; background-position: center 75%;}
.faq-txt {width: 55%; height: 100%; display: flex; flex-direction: column; padding-left: 80px; box-sizing:border-box; color: #fff; background: #00A93A; justify-content: center; align-items: flex-start;}
.faq-txt h3 {font-size: 2vw; font-weight: 600; margin-bottom: 0.8vw;}
.faq-txt p {font-size: 0.8vw; font-weight: 200; margin-bottom: 0.8vw;}
.faq-txt .flat-white {font-size: 0.8vw; font-weight: 600; color: #00A93A; background: #fff; padding: 0.6vw 0.8vw; display: inline-block; }

.mov-wrap {width: 100%;  background: #FAF7F2 }
.mov-cont {margin: 0 auto; max-width: 1000px; width: 100%; padding: 3vw 0 4vw;}
.mov-cont h3 {font-size: 1.6vw; font-weight: 600; color: #00A93A;margin-bottom: 0.6vw; text-align: center;}
.mov-cont p {font-size: 0.8vw; font-weight: 200; color: #808080; text-align: center; margin-bottom: 2vw;}
.mov-box {position: relative; padding-top: 56.25%;}
.mov-box iframe {position: absolute; top:0; left:0; width: 100%; height: 100%;}

.commu-wrap {width: 100%; background: #fff;}
.commu-cont {margin: 0 auto; max-width: 1400px; width: 100%; padding: 30px 40px; display: flex;}
.notice-wrap {background: #f7f7f7; padding: 40px 30px 20px; width: calc(45% - 40px); margin-right:40px;}
.info-wrap {background: url('/design/dogomedica/img/working.jpeg') no-repeat; background-size: auto 100%; padding: 40px 30px 20px; width: 55%;}
.commu-cont h1 {font-size: 24px; margin-bottom: 16px; display: flex; justify-content: space-between; align-items: flex-end;}
.commu-cont li {margin-bottom: 3px; display: flex; justify-content: space-between; font-size: 16px;}
.commu-cont li a, .commu-cont li a b {width: calc(100% - 120px); text-overflow: ellipsis; font-weight: 300!important; font-family: "Pretendard"; font-size: 16px !important; white-space: nowrap; overflow: hidden;}
.commu-cont li span {width: 100px; font-weight: 200!important; font-family: "Pretendard"; font-size: 16px!important; display: block; text-align: right; color: #666;}

.commu-cont span.more a {font-size: 12px!important; font-weight: 600!important; width: unset; text-align: right; color: #666 }


@media (max-width: 1024px) {
    #main_bnr_swiper_pc .swiper-slide a .txt_wrap .txt_01 { font-size: 24px; } 
    #main_bnr_swiper_pc .swiper-slide a .txt_wrap .txt_02 { font-size: 30px; line-height:1.5; } 
    #main_bnr_swiper_pc .swiper-slide a .txt_wrap .txt_03 { font-size: 24px; }
}

/* 태블릿 모바일 */
@media (max-width: 990px) {
    /* 헤더 */
   
   #main_bnr_swiper_pc .swiper-slide .cont-wrap video {position: absolute; top: 0; object-fit: cover; z-index: -1; height: 100%;}
   

   
   
    #header.fixed {background:#fff;}
    #header.fixed .headerTnb .tnbLeft a img,
    #header.fixed .headerBottomRight a img {display:inline-block;;}
    #header.fixed .headerTnb .tnbLeft a img.main-icon,
    #header.fixed .headerBottomRight a img.main-icon {display:none;}
    
    #main_bnr_swiper_pc .swiper-slide .cont-wrap {width: 100%; max-height: 60vh;}
    #main_bnr_swiper_pc .swiper-slide .cont-wrap img { height:60vh; object-fit:cover; } 
    
    #main_bnr_swiper_pc .swiper-slide .main-txt-box h3 { font-size: 4vw; font-weight: 200; line-height: 1.1; margin-bottom: 3vw; } 
    #main_bnr_swiper_pc .swiper-slide .main-txt-box h1 { font-size: 8vw; font-weight:600; line-height: 1.1; margin-bottom: 6vw; } 
    #main_bnr_swiper_pc .swiper-slide .main-txt-box p { font-size: 3vw; font-weight: 200; line-height: 1.25; margin-bottom: 3vw; } 
    #main_bnr_swiper_pc .swiper-slide .main-txt-box .line-btn { font-size: 3vw; font-weight: 600; line-height: 1.25; padding: 2vw 3vw; border: 1px solid #fff; background: rgba(255,255,255,0); color: #fff;}
    
    #main_bnr_swiper_pc .swiper-button-prev { left:10px; transform: scale(0.5); } 
    #main_bnr_swiper_pc .swiper-button-next { right:10px; transform: scale(0.5); } 

    /* 상품 롤링 */
    #pd_swiper {padding: 0 6px 13px;}
    #pd_swiper .pd_bnr {width: 100% !important; display:block; margin-bottom:25px;}
    #pd_swiper .item-list { width: 100% !important; margin-bottom: 12px; display:block; }
    #pd_swiper .item-list.flexed { display:flex; align-items: center; gap: 8px; }
    #pd_swiper .item-list.flexed .thumb {width:80px;flex-shrink: 1;} 
    #pd_swiper .item-list.flexed .thumb img{height:100px;}
    #pd_swiper .item-list.flexed .prd-info {position: relative;padding: 0;width: calc(100% - 80px);}
    #pd_swiper .item-list.flexed .prd-info .prd-brand a {font-size:14px;}
    #pd_swiper .swiper-pagination { background: rgba(0, 0, 0, .3); width: 88%; top: auto; left: 50%; right:auto; bottom:0 !important; transform: translateX(-50%); height:4px;}
    #pd_swiper .swiper-button-prev, 
    #pd_swiper .swiper-button-next {display:none;}
    
    /* 탭 롤링 */
    #tab_swiper { margin: 0 15px 25px; } 
    #tab_swiper .swiper-slide a {font-size:14px;}
    #tab_swiper .swiper-slide.swiper-slide-thumb-active a { font-weight: 800;}
    
    /* 서브 배너 롤링 */
    .sub_bnr_wrap {margin-bottom:62px;}
    .sub_bnr_wrap .cont_tit {margin:0 24px 10px;}
    
    
    .commu-cont li a, .commu-cont li a b {width: calc(100% - 100px);}
    
    .faq-wrap {flex-direction: column; padding: 0 40px; height:60vh; margin-bottom: 62px;}
    .faq-img {width: 100%; height: 50%; background: url("/design/dogomedica/img/wearing.jpeg") no-repeat; background-size: auto 120%; background-position: center 75%;}
    .faq-txt {width: 100%; height: 50%; display: flex; flex-direction: column; padding-left: 30px; box-sizing:border-box; color: #fff; background: #00A93A; justify-content: center; align-items: flex-start;}
    .faq-txt h3 {font-size: 6vw; font-weight: 600; margin-bottom: 2vw;}
    .faq-txt p {font-size: 2.5vw; font-weight: 200; margin-bottom: 2vw;}
    .faq-txt .flat-white {font-size: 2.5vw; font-weight: 600; color: #00A93A; background: #fff; padding: 1.5vw 2vw; display: inline-block; }
    
    .mov-wrap {padding: 50px 40px; }
    .mov-cont {margin: 0 auto; padding: 0;}
    .mov-cont h3 {font-size: 5vw; font-weight: 600; color: #00A93A;margin-bottom: 2vw; text-align: center;}
    .mov-cont p {font-size: 3vw; font-weight: 200; color: #808080; text-align: center; margin-bottom: 5vw;}
    .mov-box {position: relative; padding-top: 56.25%;}
    .mov-box iframe {position: absolute; top:0; left:0; width: 100%; height: 100%;}
    
    .commu-cont {padding: 50px 40px; flex-direction: column;}
    .notice-wrap {background: #f7f7f7; padding: 40px 30px 20px; width: 100%; margin-right:0;  }
    .info-wrap {background: url('/design/dogomedica/img/working.jpeg') no-repeat; background-size: 100% auto; padding: 40px 30px 20px; width: 100%; flex-shrink: 0; height: 226px;}
    .commu-cont h1 {font-size: 24px; margin-bottom: 16px; display: flex; justify-content: space-between; align-items: flex-end;}
    .commu-cont li {margin-bottom: 3px; display: flex; justify-content: space-between; font-size: 16px;}
    .commu-cont li a, .commu-cont li a b {width: calc(100% - 120px); text-overflow: ellipsis; font-weight: 300!important; font-family: "Pretendard"; font-size: 16px !important; white-space: nowrap; overflow: hidden;}
    .commu-cont li span {width: 100px; font-weight: 200!important; font-family: "Pretendard"; font-size: 16px!important; display: block; text-align: right; color: #666;}

    .commu-cont span.more a {font-size: 12px!important; font-weight: 600!important; width: unset; text-align: right; color: #666 }
    
}
/* BASIC css end */