@media screen and (max-width: 768px) {
    .sp{
        display: inline-block !important;
    }
    .pc{
        display: none !important;
    }

    body {
        min-width: 100%;
        position: relative;
    }

    /* Header */

    #header {
        padding: 15px 0;
        background: #f6ffcb;
    }

    #header .header_inner {
        width: 94%;
        padding: 0 3%;
        margin: 0 auto;
    }

    #header #logo {
        float: left;
    }

    #header .group_right {
        margin-top: 20px;
        float: right;
    }

    /* Navi */
    .wrapper_nav {
        height: 0px;
        position: absolute;
        top: 0px;
        height: 100%;
        width: 100%;
        background: #ccc;
        z-index: 99999;
        padding-top: 90px;
        display: none;
    }

    .wrapper_nav #btn_nav_out {
        position: absolute;
        top: 20px;
        right: 20px;
        display: inline-block;
    }

    .wrapper_nav.active{
        display: block;
    }

    #nav {
        width: 100%;
        height: 100%;
    }

    #nav ul li#Homepage a {
        background: url(/public/user/img/common/icon_01.png) 30px center no-repeat;
    }


    #nav ul>li:first-child a,
    #nav ul>li:last-child a {
        padding-left: 0px;
    }
    #nav li .submenu-1 {
        position: relative;
        width: 100%;
        display: block;
    }

    #nav li .submenu-2 {
        position: relative;
        left: 0;
        display: block;
        width: 100%;
    }

    #nav li .submenu-2 li a {
        background:#FFFF00;
    }

    #nav ul {
        width: 100%;
    }

    #nav li {
        position: relative;
        margin-top: 0px;
        width: 100%;
        border: none;
        text-align: center;
        float: none;
        background: none;
        border-bottom: 1px solid #fff
    }

    #nav li a {
        padding:5% 0;
    }

    #nav li.language a {
        background: #f6ffcb;

    }

    /* Contents */

    #home .banner_inner {
        width: 100%;
    }

    #home #contents {
        padding: 5% 0;
    }

    #contents .content_inner {
        width: 90%;
        padding: 0 5%;
        margin:0;
    }

    .product_list {
        padding: 0 5%;
        margin-top: 0px;
    }

    .product_list li {
        width: 45%;
        height: auto;
        margin-right: 9%;
    }

    .product_list li span {
        background: url(/public/user/img/home/icon_link03.gif) 90% center no-repeat;
    }

    #home .block_02 .block_left {
        width: 100%;
    }
    #home .block_02 {
        margin: 5% 0;
        padding:0 5%;
    }

    #home .block_02 .block_left li a {
        padding: 5%;
    }

    #block_partner {
        padding:0 2%;
        width: 96%;
    }

    #block_partner .popular {
        width: 100%;
    }

    #footer #pagetop_btn {
        display: none;
    }

    #footer .footer_inner {
        width: 90%;
        padding:5%;
        background-size: 100% 100%;
    }

    #footer .block_left {
        margin:0;
        width: 100%;
        float: none;
        text-align: center;
    }

    #footer .block_right {
        /*display: none;*/
    }

    #footer .block_left #logo_footer {
        margin: 0 0 2% 0;
    }

    #topic_path>ul {
        width: 90%;
        padding:5%;
    }

    .title_01{
        padding:3%;
    }

    /*topic*/
    #contents .content_inner .p_b40{
        text-align: justify;
        padding-bottom: 3% !important;
    }

    #contents {
        padding: 0 0 3% 0;
    }

    /*service*/

    .service_list {
        margin-bottom: 3%;
        border: 0px;
    }
    .service_list li {
        border: 0px;
    }

    .topic_box li {
        padding: 5%;
    }

    .topic_box li .topic_img {
        width: 30%;
        margin-bottom: 0;
    }

    .topic_box li .topic_img img {
        width: 100%;
    }

    .topic_box li .topic_content {
        width: 65%;
    }

    #content_news .title_news {
        font-size: 25px;
        line-height: 25px;
        margin-bottom: 3%;
    }

    #content_news .img_news {
        margin-bottom: 3%;
    }

    #content_news .img_news img {
        width: 100%;
        height: auto;
    }

    /*contact*/
    #tbl_contact .block_contact {
        display: inline-block;
        width: 100%;
    }

    #tbl_contact .title {
        width: 94%;
        padding: 3%;
        display: inline-block;
    }

    #tbl_contact .detail {
        width: 100%;
        display: inline-block;
        padding:3% 0;
    }

    #tbl_contact .block_contact:last-child .detail {
        text-align: center;
    }

    #tbl_contact .detail input, #tbl_contact .detail textarea, #tbl_contact .detail select {
        padding:10px 0;
        width: 100%;

    }

    #tbl_contact .detail .btn_contact01 {
        width: 100%;
    }

    #contact .box_form .btn_contact02 {
        width: 100%;
    }

    #banner_contact img {
        width: 100%;
    }

    .list_product li {
        margin-bottom: 3%;
        width: 44%;
        padding:3%;
        border: none;
    }

    .list_product li .product-inner {
        width: 94%;
        padding:3%;
    }

    .list_product li:nth-child(3n), .list_product li:last-child {
        margin: 0;
    }

    .list_product li:nth-child(2n), .list_product li:last-child {
        margin-right: 0px;
    }

    /*product detail*/
    #product_detail {
        padding:3% 0;
    }
    #product_detail .product_info {
        width: 100%;
        float: none;
        padding:0;
    }

    #product_detail .product_slider {
        float: none;
        width: 100%;
    }
    #product_detail #product_inside {
        margin-bottom: 3%;
    }

    #footer .block_social {
        margin-bottom: 3%;
    }

    #footer .block_social a img {
        width: 80%;
    }

    #footer .block_social p {
        font-size: 16px;
        font-weight: bold;
        margin-bottom: 5%;
        padding:0;
        text-align: center;
        width: 100%;
    }

    .bx-wrapper .bx-controls-direction a {
        width: 30px !important;
        height: 30px !important;
    }

    .bx-wrapper .bx-next, .bx-wrapper .bx-prev {
        background-size:30px !important;
    }

    .bx-controls-direction a {
        display: block;
    }

    .text_top {
        padding:0;
    }


    #color_tab1 {
        width: 30%;
    }

    #color_tab2 {
        width: 30%;
    }

    #color_tab3 {
        width: 30%;
    }

    .ui-tabs .ui-tabs-nav .ui-tabs-anchor {
        padding: .5em 0 !important;
        width: 100% !important;
    }

    #content_news .detail_news img {
        width: 100% !important;
        height: auto !important;
    }
}