/* BASIC css start */
#footer  {margin-top:0 !important}

.swiper .swiper-slide img { width:100%;  border-radius: 0 0 60px 0;}
.swiper .swiper-pagination {bottom: 20px !important;}
.swiper .swiper-pagination-bullet { background:rgba(255,255,255,0.5); border-radius: 100%; width: 8px; height: 8px; opacity:1}
.swiper .swiper-pagination-bullet-active { background:#000; margin-top: 0 !important }

.visual_box {position:relative;  }
.visualSwiper {}
.visualSwiper .swiper-slide {position:relative; }
.visualSwiper .swiper-slide  a {display:inline-block; width:100%}
.visualSwiper .swiper-slide  a img {width:100%}
.visualSwiper .swiper-button-prev, .visualSwiper .swiper-button-next {position: absolute; margin: 0; top: 50%; transform: translateY(-50%); z-index: 10; width: 64px; height: 64px; display:none;  }
.visualSwiper .swiper-button-prev { left: 10px; background: url("/design/medicopet/img/icon_prev.svg") no-repeat center/24px auto;}
.visualSwiper .swiper-button-next {right: 10px; background: url("/design/medicopet/img/icon_next.svg") no-repeat center/24px auto;}
.visualSwiper .swiper-pagination {bottom: 10px !important;}

.visualBtn {position: static;right:16px;bottom: -90px;background: #f38383;width:160px;height:160px;border-radius: 100%;color: #fff;font-weight: 400;line-height: 1.3;box-shadow: 2px 1px 25px rgba(0, 0, 0, 0.2);z-index: 500;display: block;margin:40px auto 20px;}
.visualBtn a:hover::before { content: ''; display: block; position: absolute; width: 170px; height: 170px; background: #f38383; border-radius: 100%; animation: moveAction 1.5s ease 0s infinite; left: -5px; top: -5px; }
.visualBtn a:hover::after { content: ''; display: block; position: absolute; width: 180px; height: 180px; background: #f38383; border-radius: 100%; animation: moveAction02 1.5s ease 0s infinite; left: -10px; top: -10px; }
.visualBtn a {display: flex;align-items: center;justify-content: center;flex-direction: column;color:#fff;width: 100%;height: 100%;line-height:1;box-sizing: border-box;padding: 35px 20px 23px;font-size:16px;position: relative;}
.visualBtn a span {display: flex;align-items: center;justify-content: center;flex-direction: column;z-index:1 }
.visualBtn a img {margin-bottom:10px;}



.section {position:relative; margin-bottom:64px }
.sect_tt {text-align:center; margin-bottom:32px; padding:0 4% }
.sect_tt .tt {font-size:24px; font-weight:bold; }
.sect_tt .des {font-size: 14px; color: #313232; margin-top:20px; line-height:1.5; word-wrap:break-word; word-break:keep-all; }

.section .swiper .item {margin-bottom:0}
.section .swiper .swiper-slide {width:50%}
.section .swiper .swiper-pagination {position:static;width:60% !important;display:flex;align-items: center;justify-content: center;box-sizing: border-box;margin: 0 auto;}
.section .swiper .swiper-pagination-bullet{cursor: pointer;height:2px !important;border-radius:0;opacity:1;background:#f0f0f0;margin:0 !important; margin-top:32px !important; width: 100%;transition: all ease 0.5s;}
.section .swiper .swiper-pagination-bullet-active{background:#000 !important;width: 100%;} 

.section .swiper-button-prev, .section .swiper-button-next {width:32px; height:32px; background-repeat:no-repeat; background-size:100% auto; background-position:center }
.section .swiper-button-prev {left:16px; background-image: url("/design/medicopet/img/icon_prev.svg") }
.section .swiper-button-next  {right:16px; background-image: url("/design/medicopet/img/icon_next.svg")}



.tab_box {display:flex;align-items: center;justify-content: center;overflow-x: auto;padding: 0 10px 32px;box-sizing: border-box;}
.tab_box::-webkit-scrollbar {display: none;}
.tab_box a {box-sizing:border-box;display:flex;justify-content: center;align-items: center;height: 38px;border-radius:30px;padding: 0px 12px;border:1px solid #E0E0E0;margin-right:6px;color: #666;font-size: 12px;line-height: 1;}
.tab_box a:last-child {margin-right:0}
.tab_box a.active {background: #202020; color:#fff; }

.tab_con_box {}
.tab_con {display:none; }
.tab_con.active {display:block;; }

/*.eventSwiper .swiper-button-prev, .eventSwiper .swiper-button-next {margin:0; transform:translate(0%, -50%);}
.eventSwiper .swiper-slide  a {display:inline-block; width:100%; }*/


#EVENT  {position:relative; width:100%; height:300px; background:center top no-repeat fixed; background-size:cover auto; }
/*#EVENT .swiper-slide {position:relative; display:block; }
#EVENT .img img {width: 100%;}*/



.prod_list.grid_row .item {width:100%;margin:0;border-bottom:1px solid #E0E0E0;box-sizing:border-box;display:flex;justify-content: flex-start;align-items: stretch;}
.prod_list.grid_row .item .preview_box {display:none; }
.prod_list.grid_row .item .thumb_box {width: 120px;}
.prod_list.grid_row .item .info_box {width:calc(100% - 120px);box-sizing:border-box;padding: 0;}
.prod_list.grid_row .item .info_box a {display:flex;justify-content: center;flex-direction: column;height: 100%;padding: 0 16px;}
.prod_list.grid_row .item .info_box .name {height:auto; margin:0 }
.prod_list.grid_row .item .info_box .des {display:none; }



#BRAND {text-align:center; padding:40px 0 140px; }
#BRAND .txt_box {z-index: 1;position: relative;}
#BRAND .txt_box .img {display:inline-block;padding-bottom: 140px;position:relative;}
#BRAND .txt_box .img:after {content: '';position: absolute;left: 50%;bottom: 36px;transform: translate(-50%, 0px);width: 1px;height: 80px;background-color: #ccc;}
#BRAND .txt_box .img img {width: 60vw; }
#BRAND .txt_box .txt {font-size: 14px;line-height: 1.5;color:#666;}
#BRAND .txt_box .tt {font-size: 30px;color: #313232;margin-bottom: 20px;font-weight:bold;}
#BRAND .txt_box .point {font-size: 20px;font-weight:600;color: #bc1e2d;border-bottom: 1px solid;}
#BRAND .txt_box .btn {margin-top: 40px;display:inline-block;padding:0px;border-radius: 50px;background: #f38383;color:#fff;box-sizing:border-box;width: 170px;height: 46px;line-height: 46px;font-size: 14px;position:relative;}
#BRAND .txt_box .btn span {display: flex;align-items: center;justify-content: center;z-index:1;position: relative;}
#BRAND .txt_box .btn:hover::before { content: ''; display: block; position: absolute; width: 180px;height: 56px; background: #f38383; border-radius: 50px; animation: moveAction 1.5s ease 0s infinite; left: -5px; top: -5px; }
#BRAND .txt_box .btn:hover::after { content: ''; display: block; position: absolute; width: 190px;height: 66px; background: #f38383; border-radius: 50px; animation: moveAction02 1.5s ease 0s infinite; left: -10px; top: -10px; }

#BRAND .img_box span { position:absolute; width: 30vw;   }
#BRAND .img_box span img {opacity: .3;}
#BRAND .img_box .img_l {left: 0;top: 182px;}
#BRAND .img_box .img_c {top: 353px;right: 0;}   
#BRAND .img_box .img_r {top: 455px;left: 50%;width: 40vw;transform: translate(-50%, 0););}






#QNA .chk_box {margin:0px 0 10px }
#QNA .chk_lb {margin-bottom:7px;display: inline-block;}

#QNA .sect_con {padding:0 16px; box-sizing:border-box; }
#QNA .table_box .table {width: 100%;table-layout: inherit;}
#QNA .table_box .table tbody {width:100%; }
#QNA .table_box .table tr {border-bottom: 1px solid #f0f0f0;}                       
#QNA .table_box .table th {text-align:left;vertical-align: top;padding-top: 22px;}
#QNA .table_box .table td {position: relative; padding:10px; height:auto; box-sizing:border-box; padding-right:0; }
#QNA .table_box .table td input {height:42px; border:1px solid #e0e0e0; padding:0 10px; width:100%;  box-sizing:border-box }
#QNA .textarea_box textarea {height: 240px;padding:10px;font-size: 12px; width:100%;  box-sizing:border-box; border:1px solid #e0e0e0;}
#QNA .btn_box {text-align:center; }
#QNA .btn_box .btn {border:none;margin-top:10px;display: inline-block;padding: 0px;border-radius: 50px;background: #f38383;color: #fff;box-sizing: border-box;width: 170px;height: 46px;line-height: 46px;font-size: 14px;position: relative;}
#QNA .btn_box .btn span {display: flex;align-items: center;justify-content: center;z-index:1;position: relative;}
#QNA .btn_box .btn:hover::before { content: ''; display: block; position: absolute; width: 180px;height: 56px; background: #f38383; border-radius: 50px; animation: moveAction 1.5s ease 0s infinite; left: -5px; top: -5px; }
#QNA .btn_box .btn:hover::after { content: ''; display: block; position: absolute; width: 190px;height: 66px; background: #f38383; border-radius: 50px; animation: moveAction02 1.5s ease 0s infinite; left: -10px; top: -10px; }

#QNA .agree_inquire_box {margin: 16px 0 10px;}
#QNA .agree_inquire_area {height:220px; overflow:auto; margin-bottom:20px; border:1px solid #e0e0e0; padding:16px;   }
#QNA .agree_inquire_area .sec {margin-bottom:10px; }
#QNA .agree_inquire_area .sec:last-child {margin-bottom:0}
#QNA .agree_inquire_area p {font-size:12px; word-wrap: break-word; word-break: keep-all; }
#QNA .agree_inquire_box .chk_box {text-align:right; }




#BANNER {margin:0}
#BANNER .zoonin_box {font-size:0}
#BANNER .zoonin_box > div {position:relative; }
#BANNER a {position:relative; display:inline-block;width:100%;box-sizing: border-box;margin-bottom: 5px;padding: 0; position:relative;}
#BANNER .txt {position:absolute;top:0;left:0;width:100%;z-index:1;display: flex;align-items: center;justify-content: center;height: 100%;text-align: center;flex-direction: column;}
#BANNER .txt h2 {font-size: 16px;font-weight:bold;margin-bottom: 6px;color: #000;display:flex;align-items: center;justify-content: center;}
#BANNER .txt h2 .icon {width: 38px;margin-right: 6px;}
#BANNER .txt > span {color: #000;text-decoration: underline;text-underline-position: under;font-size: 12px;font-weight: 500;}
#BANNER .zoonin02 .txt {padding-top: 10%;}
#BANNER .zoonin02 .txt h2, #BANNER .zoonin02 .txt > span {color:#fff;   }




input[type="radio"] {position:relative;display:inline-block;margin-right: 6px;}
.avba {display:flex;font-size:14px;}

@keyframes moveAction {
    75%,100% {
        transform: scale(1.1);
        opacity: 0;
    }
}

@keyframes moveAction02 {
    75%,100% {
        transform: scale(1.2);
        opacity: 0;
    }
}

/* BASIC css end */

