/* pc ver. */

@media screen and (min-width:1400px){
    
    body {height: 100vh !important;}

    
    header { height: 60px; }
    .search_input_box { width: 500px; }    
    .search_input_box form svg {width: 15px; height: 15px;}
    .search_btn {width: 50px;}
    .search_input {width: calc(100% - 50px); font-size: 16px;}

    header .left_box .logo_box { width: 100px; }
    header .left_box .logo_box a{ display: block; }
    header .left_box .logo_box img { width: 100px; }
    header .sns_box ul li a img {width: 30px; }

    .main {height: calc(100vh - 60px - 150px); margin-top: 60px;}
    .main .main_content {height: auto;}

    .sub_page.product { height: calc(100% - 60px); top: 60px; }
    .sub_page.product .main_content .product_wrap .menu_contents .box3 .color_box ._circle {width: 6vw; height: 6vw;}

    .text-wrap h2 a img {width: auto;}
    ._title h2 { font-size: 1.2vw; }
    
    #grid-swiper01 .swiper-slide .item_list .title_box h2 { font-size: 0.8vmax; }
    #grid-swiper01 .swiper-slide .item_list .title_box h3 { font-size: 1.4vmax; }   
    #grid-swiper01 .swiper-slide .item_list .img_box { /*height: 14vmax;*/ height: 0; padding-bottom: 45%; }
    #grid-swiper01 .swiper-slide .item_list .txt_box {/*min-height: 28vh;*/ min-height: 25vh;}
    .txt_box ul li {padding: 10px 0;}
    .txt_box ul li ._left p, .txt_box ul li ._right p, #grid-swiper01 .swiper-slide .item_list .view_box a { font-size: 0.8vmax; }
    
    .sub_page .txt_box ul li ._left p, .sub_page .txt_box ul li ._right p, .sub_page  #grid-swiper01 .swiper-slide .item_list .view_box a { font-size: 1vmax; }

    .sub_page.product .main_content .product_wrap .menu_cate { height: 3vmax; }
    .sub_page.product .main_content .product_wrap .menu_cate ul li { height: 3vmax; }
    .sub_page.product .main_content .product_wrap .menu_contents { height: calc(100% - 3vmax); }    
    .sub_page.product .main_content .product_wrap .menu_contents .box .sub_text p { font-size: 1.1vmax;}

    .sub_page.product .main_content .product_wrap .menu_contents .box2 .img_box img._icon {width: 3vmax;}
    .sub_page.product .main_content .product_wrap .menu_contents .box3:after {width: 2vw; height: 3vw;}

    .txt_box ul li ._right p._info span { font-size: 1vmax; line-height: 1; margin-right: 10px; display: inline-block; width: calc((100% - 80px) / 4); }
    .txt_box ul li ._right p._info span:last-child {margin-right: 0;}

}

@media screen and (max-width:1399px){
    #grid-swiper01 .swiper-slide .item_list .img_box { height: 0; padding-bottom: 50%; }
    .txt_box ul li p { font-size: 14px; }
}

@media screen and (max-width:1200px){
    .sub_page.product .main_content .product_wrap .menu_contents .box2 .txt_box { width: 30vw; }
    .sub_page.product .main_content .product_wrap .menu_contents .box2 .img_box { width: calc(100% - 30vw - 3vw); margin-left: 3vw; height: 45vh; }

    .txt_box ul li p {font-size: 12px;}

    #grid-swiper01 .swiper-slide { width: 35%; }
    #grid-swiper01 .swiper-slide .item_list .view_box a {padding: 10px 1vw;}
    #grid-swiper01 .swiper-slide .item_list .txt_box {min-height: 20vh;}

}



@media screen and (min-device-width : 1200px) and (max-device-width : 1399px) and (orientation : landscape) { 

    
    .txt_box ul li { padding: 8px 0; }
    .txt_box ul li p { font-size: 13px; }

    

}


/* tablet */
@media screen and (max-width:991px){
    
    #grid-swiper01 .swiper-slide { width: 35%; }
    .main .txt_box ul li ._left { width: 8vmax; }
    .main .txt_box ul li ._right { width: calc(100% - 8vmax - 10px); }

    .sub_page.product .main_content .product_wrap .menu_contents .box3 { align-items: flex-start; }    

    .sub_page.product .main_content .product_wrap .menu_contents .box3 .txt_box { width: 33.333%; }
    .sub_page.product .main_content .product_wrap .menu_contents .box3 .txt_box ul li ._right { width: calc(100% - 6vw - 3vw); margin-left: 3vw; }
    .sub_page.product .main_content .product_wrap .menu_contents .box3 .img_wrap { width: 33.333%; height: 50%;}
    .sub_page.product .main_content .product_wrap .menu_contents .box3 .color_box { width: 33.333%; }

    .footer .inner ul li p { font-size: 14px; }

    

}

@media screen and (max-width:771px){
    
    #grid-swiper01 .swiper-slide { width: 45%; }
    .footer { height: 100px; }
    .footer .inner ul li {padding: 10px 0;}
    .footer .inner ul li a img {width: 40px; top: 10px;}
/*    .footer .inner ul li:nth-child(3n) a img { width: 25px; }*/
    .footer .inner ul li:nth-child(5n) a img {width: 35px;}
    .footer .inner ul li p { font-size: 11px; bottom: 10px;}
    
}

@media screen and (min-device-width : 641px) and (max-device-width : 1199px) and (orientation : landscape) {

    ._title h2, 
    ._title ul li a,
    ._title ul li ._slash,
    ._title ul li p { font-size: 16px; }

    #grid-swiper01 .swiper-slide { width: 30%; }
    #grid-swiper01 .swiper-slide .item_list .title_box { margin-bottom: 2vmax; }
    #grid-swiper01 .swiper-slide .item_list .title_box h2 { font-size: 13px; }
    #grid-swiper01 .swiper-slide .item_list .title_box h3 {font-size: 20px; }
    #grid-swiper01 .swiper-slide .item_list .img_box { height: 25vh; }
    #grid-swiper01 .swiper-slide .item_list .txt_box { margin-top: 1vmax; }
    #grid-swiper01 .swiper-slide .item_list .view_box a { padding: 10px 0; }

    .txt_box ul li {padding: 7px 0;}
    .txt_box ul li ._left p, .txt_box ul li ._right p, #grid-swiper01 .swiper-slide .item_list .view_box a { font-size: 14px; }
    .sub_page.product .main_content .product_wrap .menu_contents .box1 .sub_text p { font-size: 14px;}

    .sub_page.product .main_content .product_wrap .menu_contents .box2 .txt_box ul li ._left p, 
    .sub_page.product .main_content .product_wrap .menu_contents .box2 .txt_box ul li ._right p { font-size: 12px; }
    .sub_page.product .main_content .product_wrap .menu_contents .box3 .txt_box ul li ._left p, 
    .sub_page.product .main_content .product_wrap .menu_contents .box3 .txt_box ul li ._right p { font-size: 12px; }

    /*.sub_page.product .main_content .product_wrap .menu_contents .box3 {height: 90%;}*/

    #grid-swiper01 .swiper-slide .item_list { padding: 3vh 1.5vw; }
    #grid-swiper01 .swiper-slide .item_list .img_box { height: 0; padding-bottom: 40%; }
    #grid-swiper01 .swiper-slide .item_list .txt_box { min-height: 22vh; }
    .txt_box ul li ._left p, .txt_box ul li ._right p, #grid-swiper01 .swiper-slide .item_list .view_box a { font-size: 11px; }


    


    
}

@media screen and (min-device-width : 641px) and (max-device-width : 1199px) and (orientation : portrait) {

    ._title h2 a,
    ._title ul li a,
    ._title ul li ._slash,
    ._title ul li p { font-size: 20px; }

    #grid-swiper01 .swiper-slide { width: 50%; }
    #grid-swiper01 .swiper-slide .item_list .title_box h2 { font-size: 14px; }
    #grid-swiper01 .swiper-slide .item_list .title_box h3 { font-size: 24px; }    
    #grid-swiper01 .swiper-slide .item_list .img_box { height: 0; padding-bottom: 55%;}
    #grid-swiper01 .swiper-slide .item_list .txt_box { min-height: 25vh; }
    #grid-swiper01 .swiper-slide .item_list .view_box { margin-top: 20px; }
    #grid-swiper01 .swiper-slide .item_list .view_box a { font-size: 17px; padding: 20px 50px; }

    .txt_box ul li { padding: 8px 0; }
    .txt_box ul li p { font-size: 18px; }
    .txt_box ul li ._right p._size { width: 4vw; }
    .txt_box ul li ._right p._info { width: calc(100% - 4vw - 1.5vw); }
    .sub_page.product .main_content .product_wrap .menu_contents .box1 .sub_text p { font-size: 18px; }

    .sub_page.product .main_content .product_wrap .menu_contents .box {flex-wrap: wrap;} 
    .sub_page.product .main_content .product_wrap .menu_contents .box .img_box { max-width: 100%; width: 100%; height: 30vh; margin-left: 0; }
    .sub_page.product .main_content .product_wrap .menu_contents .box1 .img_box img { height: 100%; }
    .sub_page.product .main_content .product_wrap .menu_contents .box .txt_box { width: 100%; margin-left: 0; }

    .sub_page.product .main_content .product_wrap .menu_contents .box2 .txt_box ul li ._left,
    .sub_page.product .main_content .product_wrap .menu_contents .box3 .txt_box ul li ._left { width: 10vmax; }
    .sub_page.product .main_content .product_wrap .menu_contents .box2 .txt_box ul li ._right,
    .sub_page.product .main_content .product_wrap .menu_contents .box3 .txt_box ul li ._right { width: calc(100% - 10vmax);}

    #grid-swiper02 .swiper-slide { min-width: 220px; }

    .sub_page.product .main_content .product_wrap .menu_contents .box3:after { content: none; }
    .sub_page.product .main_content .product_wrap .menu_contents .box3 .img_wrap { width: 100%; height: 30vh; margin-left: 0; }    
    .sub_page.product .main_content .product_wrap .menu_contents .box3 .color_box { width: 100%; display: flex; justify-content: center; margin-top: 0; margin-bottom: 0; position: relative; height: auto; overflow-y: hidden; overflow-x: auto; padding-bottom: 5vh; }    
    .sub_page.product .main_content .product_wrap .menu_contents .box3 .color_box:after { content: ''; display: block; position: absolute; width: 6vw; height: 6vw; right: initial; left: 50%; bottom: 0%; transform: translateX(-50%); background: url('../images/product/touch_icon.png'); background-size: contain; background-repeat: no-repeat; background-position: center; animation: fadeOut 1.5s infinite linear alternate; }
    .sub_page.product .main_content .product_wrap .menu_contents .box3 .color_box ._circle { width: 8vw; height: 8vw; margin: 0; margin-left: 2vw; margin-right: 2vw; }

    
}



/* mobile */

@media screen and (min-device-width : 320px) and (max-device-width : 640px) and (orientation : landscape) {

    html, body {overflow-y: auto;}
    header {height: 12vh; position: relative;}
    .main {height: 88vh; margin-top: 0;}

    #grid-swiper01 .swiper-slide {width: 30%; overflow-y: auto;}
    #grid-swiper01 .swiper-slide .item_list {padding: 3vh 1.5vw;}
    #grid-swiper01 .swiper-slide .item_list .title_box h2 { font-size: 10px; }
    #grid-swiper01 .swiper-slide .item_list .title_box h3 { font-size: 13px; }
    #grid-swiper01 .swiper-slide .item_list .img_box { height: 10vmax; }    
    #grid-swiper01 .swiper-slide .item_list .view_box { margin-top: 10px; }
    #grid-swiper01 .swiper-slide .item_list .view_box a { line-height: 1; padding: 8px 20px; font-size: 10px; }

    .txt_box ul li {padding: 5px 0 ;}
    .txt_box ul li p { font-size: 10px; }

    .sub_page.product { overflow-y: auto; height: calc(100% - 12vh); top: 0; }    
    .sub_page.product .main_content { height: 90%; }
    .sub_page.product .main_content .product_wrap .menu_cate { height: 35px; }
    .sub_page.product .main_content .product_wrap .menu_cate ul li { height: 35px; }
    .sub_page.product .main_content .product_wrap .menu_contents { height: calc(100% - 35px); }
    .sub_page.product .main_content .product_wrap .menu_contents .box .sub_text p { font-size: 11px; }

}

@media screen and (min-device-width : 320px) and (max-device-width : 640px) and (orientation : portrait) {

    
    
    .text-wrap h2 a img { width: 200px; }
    .search_input_box { width: 150px; }
    .search_btn {width: 25px; padding: 0;}
    .search_input {width: calc(100% - 25px); font-size: 10px;}

    header .sns_box ul li {margin-right: 12px;} 

    ._title { padding-top: 20px; }    
    ._title h2 a, 
    ._title ul li a,
    ._title ul li ._slash,
    ._title ul li p {font-size: 16px; }

    /* main.php */

    .main .main_content { height: auto;}    
    
    #grid-swiper01 .swiper-slide { width: 100%; margin-right: 30px;}
    #grid-swiper01 .swiper-slide .item_list { padding: 5vh 30px; }
    #grid-swiper01 .swiper-slide .item_list .title_box h2 { font-size: 13px; }
    #grid-swiper01 .swiper-slide .item_list .title_box h3 { font-size: 22px; }
    #grid-swiper01 .swiper-slide .item_list .img_box { height: 25vmax; }
    .txt_box ul li { padding: 6px 0; }
    .main .txt_box ul li ._left {width: 33%;}
    .txt_box ul li ._left p, .txt_box ul li ._right p { font-size: 14px; }
    #grid-swiper01 .swiper-slide .item_list .view_box { border-radius: 20px; margin-top: 20px; }
    #grid-swiper01 .swiper-slide .item_list .view_box a {font-size: 15px; }

    /* product.php */
    .sub_page.product { height: 100vh; }
    .sub_page.product .main_content { height: calc(100% - 7vh); }
    .sub_page.product .main_content .product_wrap {height: 70vh;}
    .sub_page.product .main_content .product_wrap .menu_cate ul li p { font-size: 11px; }
    .sub_page.product .main_content .product_wrap .menu_contents .box { flex-wrap: wrap; align-content: flex-start; }
    .sub_page.product .main_content .product_wrap .menu_contents .box .img_box { max-width: 100%; width: 100%; }
    .sub_page.product .main_content .product_wrap .menu_contents .box1 .img_box img { max-width: 70%; }
    .sub_page.product .main_content .product_wrap .menu_contents .box .txt_box { width: 100%; margin-left: 0; }
    .sub_page.product .main_content .product_wrap .menu_contents .box .txt_box h2 {margin-bottom: 1vh;}    
    .sub_page.product .main_content .product_wrap .menu_contents .box .txt_box ul li ._left {width: 25%; }    
    .sub_page.product .main_content .product_wrap .menu_contents .box .sub_text p { font-size: 14px; padding-bottom: 10px; }   

    .txt_box ul li ._right p._size { width: 30px; }
    .txt_box ul li ._right p._info { width: calc(100% - 30px); }
   
    .sub_page.product .main_content .product_wrap .menu_contents .box2 .img_box { height: 30vh; margin-left: 0; }
    .sub_page.product .main_content .product_wrap .menu_contents .box2 .img_box:after { width: 8vw; bottom: -3vh; }    

    .sub_page.product .main_content .product_wrap .menu_contents .box3 .img_wrap { width: 100%; height: 20vh; margin-left: 0; }    
    .sub_page.product .main_content .product_wrap .menu_contents .box3:after { content: none; }
    .sub_page.product .main_content .product_wrap .menu_contents .box3 .color_box { width: 100%; display: flex; justify-content: center; margin-top: 1vh; margin-bottom: 1vh; position: relative; height: 8vh; overflow-y: hidden; overflow-x: auto; }
    .sub_page.product .main_content .product_wrap .menu_contents .box3 .color_box:after { content: ''; display: block; position: absolute; width: 25px; height: 25px; right: initial; left: 50%; bottom: 0%; transform: translateX(-50%); background: url('../images/product/touch_icon.png'); background-size: contain; background-repeat: no-repeat; background-position: center; animation: fadeOut 1.5s infinite linear alternate; }
    .sub_page.product .main_content .product_wrap .menu_contents .box3 .color_box ._circle { width: 8vw; height: 8vw; margin: 0; margin-left: 2vw; margin-right: 2vw; }
        
    
    
}





@media screen and (max-width : 640px) {

    .mobile_br {display: block;}
    
    .text-wrap h2 a img { width: 200px; }
    .search_input_box { width: 150px; }
    .search_btn {width: 25px; padding: 0;}
    .search_input {width: calc(100% - 25px); font-size: 10px;}

    header .sns_box ul li {margin-right: 12px;} 

    ._title { padding-top: 20px; }    
    ._title h2 a, 
    ._title ul li a,
    ._title ul li ._slash,
    ._title ul li p {font-size: 16px; }

    /* main.php */

    .main .main_content { height: auto;}    
    
    #grid-swiper01 .swiper-slide { width: 100%; margin-right: 30px;}
    #grid-swiper01 .swiper-slide .item_list { padding: 5vh 30px; }
    #grid-swiper01 .swiper-slide .item_list .title_box h2 { font-size: 13px; }
    #grid-swiper01 .swiper-slide .item_list .title_box h3 { font-size: 22px; }
    #grid-swiper01 .swiper-slide .item_list .img_box { height: 15vmax; padding-bottom: 40%;}
    #grid-swiper01 .swiper-slide .item_list .txt_box { min-height: 20vh; }
    .txt_box ul li { padding: 6px 0; }
    .main .txt_box ul li ._left {width: 33%;}
    .txt_box ul li ._left p, .txt_box ul li ._right p { font-size: 13px; }
    #grid-swiper01 .swiper-slide .item_list .view_box { border-radius: 20px; margin-top: 20px; }
    #grid-swiper01 .swiper-slide .item_list .view_box a { font-size: 15px; padding: 15px 1vw; }

    /* product.php */
    .sub_page.product { height: 100vh; }
    .sub_page.product .main_content { height: calc(100% - 7vh); }
    .sub_page.product .main_content .product_wrap {height: 70vh;}
    .sub_page.product .main_content .product_wrap .menu_cate ul li p { font-size: 11px; }
    .sub_page.product .main_content .product_wrap .menu_contents .box { flex-wrap: wrap; align-content: flex-start; }
    .sub_page.product .main_content .product_wrap .menu_contents .box .img_box { max-width: 100%; width: 100%; margin-top: 2vh; }
    .sub_page.product .main_content .product_wrap .menu_contents .box1 .img_box img { max-width: 70%; }
    .sub_page.product .main_content .product_wrap .menu_contents .box .txt_box { width: 100%; margin-left: 0; }
    .sub_page.product .main_content .product_wrap .menu_contents .box .txt_box h2 {margin-bottom: 1vh;}    
    .sub_page.product .main_content .product_wrap .menu_contents .box .txt_box ul li ._left {width: 25%; }    
    .sub_page.product .main_content .product_wrap .menu_contents .box .sub_text p { font-size: 14px; padding-bottom: 10px; }   

    .txt_box ul li ._right p._size { width: 30px; }
    .txt_box ul li ._right p._info { width: calc(100% - 30px); }
   
    .sub_page.product .main_content .product_wrap .menu_contents .box2 .img_box { height: 35vh; margin-left: 0; }
    .sub_page.product .main_content .product_wrap .menu_contents .box2 .img_box:after { width: 8vw; bottom: -3vh; }    

    .sub_page.product .main_content .product_wrap .menu_contents .box3 .img_wrap { width: 100%; height: 20vh; margin-left: 0; margin-top: 2vh;}    
    .sub_page.product .main_content .product_wrap .menu_contents .box3:after { content: none; }
    .sub_page.product .main_content .product_wrap .menu_contents .box3 .img_box {margin-top: 0;}
    .sub_page.product .main_content .product_wrap .menu_contents .box3 .color_box { width: 100%; display: flex; justify-content: center; margin-top: 1vh; margin-bottom: 1vh; position: relative; padding-bottom: 4vh; overflow-y: hidden; overflow-x: auto; }
    .sub_page.product .main_content .product_wrap .menu_contents .box3 .color_box:after { content: ''; display: block; position: absolute; width: 25px; height: 25px; right: initial; left: 50%; bottom: 0%; transform: translateX(-50%); background: url('../images/product/touch_icon.png'); background-size: contain; background-repeat: no-repeat; background-position: center; animation: fadeOut 1.5s infinite linear alternate; }
    .sub_page.product .main_content .product_wrap .menu_contents .box3 .color_box ._circle { width: 8vw; height: 8vw; margin: 0; margin-left: 2vw; margin-right: 2vw; }
        
    /*#grid-swiper02 .swiper-slide { min-width: 160px; }*/
    #grid-swiper02 .swiper-slide { width: 50%; }
    #grid-swiper02 .swiper-scrollbar {display: none;}

    /* .sub_page.product .main_content .product_wrap .menu_contents .box2 .img_box img._icon {bottom: 10px;} */

    .product_popup .inner { width: 300px; height: 50vh; }
    
}
