@media only screen and (max-width: 1200px) {
    /*-------------
 	general
-------------*/
    body {
        font-size: 14px;
    }
    /*----------------
 	section
----------------*/
    section .normal-content {
        width: 96%;
        padding: 50px 0px 20px 0px;
    }
    section .recorder-content {
        width: 96%;
        padding: 20px 0px 50px 0px;
    }
    section .maker-content {
        width: 96%;
        padding: 20px 0px 50px 0px;
    }
    section .to-contact-content {
        width: 96%;
        padding: 0px 0px 50px 0px;
    }
    section .electronic-caution-content{
    width: 96%;
    padding: 20px 0px 50px 0px;
    }
    section .customer-service-content{
    width: 96%;
    padding: 20px 0px 50px 0px;
}
    section .contact-form-content{
    width: 96%;
    padding: 20px 0px 20px 0px;
}
section .reprint-title-content{
    width: 96%;
    padding: 50px 0px 10px 0px;
}
section .reprint-content{
    width: 96%;
    padding: 0px 0px 20px 0px;
}
section .law-content{
    width: 96%;
    padding: 0px 0px 20px 0px;
}    
section .contact-form-message{
    width: 96%;
    padding: 20px 0px 20px 0px;
}    
    /*-------------
 	header
-------------*/
    header .header-content {
        width: 96%;
        padding: 30px 0px 20px 0px;
    }
}
@media only screen and (max-width: 960px) {
    /*----------------
 	page content title
----------------*/
    .page-content-title {
        padding: 0px 0px 40px 0px;
    }
    .page-content-title .en {
        padding: 0px 0px 40px 0px;
    }
    .page-content-title .en::after {
        bottom: 18px;
    }
    .page-content-title .ja {
        font-size: 142%;
    }
    /*----------------
 	page content sub title
----------------*/
    .page-content-subtitle {
        padding: 0px 0px 40px 0px;
    }
    .page-content-subtitle.style-product-link-cat01 {
        padding: 0px 0px 10px 0px;
    }
    .page-content-subtitle p {
        max-width: 195px;
        padding: 10px 0px 10px 0px;
        font-size: 100%;
    }
    .page-content-subtitle p.point {
        max-width: 210px;
    }
    /*-------------
 	header
-------------*/
    header .header-content {
        text-align: center;
    }
    header .header-content .logo {
        text-align: center;
    }
    header .header-content .logo .en {
        font-size: 178%;
    }
    header .header-content .logo .ja {
        font-size: 92%;
    }
    /*----------------
 	visual
----------------*/
    .visual .visual-image .img-wrap {
        height: 550px;
    }
    .visual .visual-image .img-wrap img {
        position: absolute;
        top: 50%;
        width: 1130px;
        height: 550px;
        max-width: 1130px;
    }
    .visual .visual-image .img-wrap img.camera{
        right: 0%;        
        -webkit-transform: translate(10%, -50%);
        -ms-transform: translate(10%, -50%);
        transform: translate(10%, -50%);
    } 
    .visual .visual-image .img-wrap img.products{
        right: 0%;   
        -webkit-transform: translate(10%, -50%);
        -ms-transform: translate(10%, -50%);
        transform: translate(10%, -50%);
    } 
    .visual .visual-image .img-wrap img.contact{
        right: 0%;        
        -webkit-transform: translate(10%, -50%);
        -ms-transform: translate(10%, -50%);
        transform: translate(10%, -50%);
    } 
    /*----------------
 	message
----------------*/
    .message p br {
        display: none;
    }
    /*----------------
 	products 
----------------*/
    .product-link-wrap > div:first-child {
        padding: 0px 0px 20px 0px;
    }
    .product-link-wrap > div:last-child {
        padding: 0px 0px 0px 0px;
    }
    .product-link-cat01 > div {
        flex-basis: 50%;
        max-width: 50%;
        padding: 10px 0px 10px 0px;
    }
    .product-link-cat02 > div {
        flex-basis: 50%;
        max-width: 50%;
        padding: 0px 5px 20px 5px;
    }
    /*----------------
 	product box
----------------*/
    .product-box-wrap {
        padding: 30px 0px 0px 0px;
    }
    .product-single-box {
        padding: 20px 20px 20px 20px;
        margin: 0px 0px 25px 0px;
        flex-wrap: wrap;
    }
    .product-single-box .product-img-wrap {
        flex-basis: 100%;
        max-width: 100%;
        padding: 0px 0px 15px 0px;
        text-align: center;
    }
    .product-single-box .product-img-wrap img {
        max-width: 400px;
        height: auto;
        margin: 0 auto;
    }
    .product-single-box .product-desc-wrap {
        flex-basis: 100%;
        max-width: 100%;
        padding: 0px 0px 0px 0px;
    }
    .product-single-box .product-desc-wrap .desc-title {
        font-size: 128%;
        margin: 0px 0px 5px 0px;
    }
    .product-single-box .product-desc-wrap .desc-feature ul li {
        line-height: 1.8;
    }
    .product-double-box-wrap {
        padding: 20px 0px 0px 0px;
    }
    .product-double-box {
        flex-basis: 100%;
        max-width: 100%;
        padding: 20px 20px 20px 20px;
        margin: 0px 0px 25px 0px;
    }
    .product-double-box .product-title-wrap {
        margin: 0px 0px 20px 0px;
    }
    .product-double-box .product-title-wrap .product-title {
        font-size: 128%;
        padding: 0px 5px 5px 0px;
    }
    .product-double-box .product-img-wrap {
        margin: 0px 0px 0px 0px;
        text-align: center;
    }
    .product-double-box .product-img-wrap img {
        max-width: 400px;
        height: auto;
        margin: 0 auto;
    }
    /*----------------
 	recorder box
----------------*/
    .recorder-box {
        padding: 20px 20px 40px 20px;
        flex-wrap: wrap;
    }
    .recorder-box .recorder-img-wrap {
        flex-basis: 100%;
        max-width: 100%;
        padding: 30px 0px 30px 0px;
    }
    .recorder-box .recorder-desc-wrap {
        flex-basis: 100%;
        max-width: 100%;
        padding: 0px 0px 0px 0px;
    }
    .recorder-box .recorder-desc-wrap .desc-title {
        margin: 0px 0px 20px 0px;
        text-align: center;
    }
    .recorder-box .recorder-desc-wrap .desc-title p {
        margin: 0 auto;
    }
    /*----------------
 	flow box
----------------*/
    .flow-box-wrap {
        padding: 0px 0px 0px 0px;
    }
    .flow-box {
        flex-basis: 100%;
        max-width: 100%;
        margin: 0px 0px 0px 20px;
    }
    .flow-box .flow-img-wrap {
        text-align: center;
    }
    .flow-box .flow-img-wrap img {
        max-width: 400px;
        height: auto;
        margin: 0 auto;
    }
    .arrow-box {
        flex-basis: 100%;
        max-width: 100%;
        padding: 20px 0px 20px 0px;
        margin: 0px 0px 0px 0px;
    }
    .arrow-box.sp-use {
        display: block;
    }
    .arrow-box::after {
        top: 50%;
        left: calc(50% - 3px);
        transform: translateY(-50%) translateX(-50%) rotate(135deg);
        -webkit- transform: translateY(-50%) translateX(-50%) rotate(135deg);
    }
    /*----------------
 	 point box
----------------*/
    .point-box-wrap {
        padding: 0px 0px 30px 0px;
    }
    .point-box {
        flex-basis: 100%;
        max-width: 100%;
        padding: 20px 20px 20px 20px;
        margin: 0px 0px 25px 0px;
    }
    .point-box .point-title-wrap {
        margin: 0px 0px 20px 0px;
    }
    .point-box .point-title-wrap .point-title {
        font-size: 128%;
    }
    .point-box .point-img-wrap {
        text-align: center;
    }
    .point-box .point-img-wrap img {
        max-width: 400px;
        height: auto;
        margin: 0 auto;
    }
    /*----------------
 	maker box
----------------*/
    .maker-box {
        padding: 20px 20px 40px 20px;
        flex-wrap: wrap;
    }
    .maker-box .maker-img-wrap {
        flex-basis: 100%;
        max-width: 100%;
        padding: 30px 0px 30px 0px;
    }
    .maker-box .maker-img-wrap img {
        max-width: 336px;
    }
    .maker-box .maker-desc-wrap {
        flex-basis: 100%;
        max-width: 100%;
        padding: 0px 0px 0px 0px;
    }
    .maker-box .maker-desc-wrap .desc-title {
        margin: 0px 0px 30px 0px;
        text-align: center;
    }
    .maker-box .maker-desc-wrap .desc-title p {
        max-width: 350px;
        margin: 0 auto;
    }
    .maker-box .maker-desc-wrap .desc-body .maker-name {
        text-align: center;
    }
    .maker-box .maker-desc-wrap .desc-body .maker-table .maker-table td {
        padding: 5px 10px 5px 10px;
        vertical-align: middle;
    }
    .maker-box .maker-desc-wrap .desc-body .maker-table .maker-table td.title {
        width: 80px;
        padding: 5px 0px 5px 0px;
    }
    /*----------------
 	to contact
----------------*/
    .to-contact {
        max-width: 340px;
    }
    /*-------------
 	footer
-------------*/
    footer .copyright {
        font-size: 78%;
    }
    /*-------------
 	to top
-------------*/
    #to-top {
        bottom: 5px;
        right: 5px;
        width: 50px;
        height: 50px;
    }
    #to-top.open {
        transform: translateX(-280px);
    }
    #to-top a {
        width: 50px;
        height: 50px;
        border-radius: 25px;
    }
    /*-------------
 	menu
-------------*/
    main.open {
        transform: translateX(-280px);
    }
    .menu-trigger {
        width: 30px;
        height: 25px;
        top: 10px;
        right: 10px;
    }
    .menu-trigger.active {
        transform: translateX(-280px);
    }
    .menu-trigger span {
        height: 4px;
    }
    .menu-trigger span:nth-of-type(1) {
        top: 0;
    }
    .menu-trigger.active span:nth-of-type(1) {
        transform: translateY(10px) rotate(-45deg);
    }
    .menu-trigger span:nth-of-type(2) {
        top: 10px;
    }
    .menu-trigger span:nth-of-type(3) {
        bottom: 0;
    }
    .menu-trigger.active span:nth-of-type(3) {
        transform: translateY(-11px) rotate(45deg);
    }
    nav {
        width: 280px;
        transform: translate(280px);
    }
    nav > ul > li > a {
        font-size: 100%;
        padding: 10px 20px 10px 20px;
    }
    nav > ul > li > ul > li > a {
        font-size: 100%;
        padding: 10px 30px 10px 30px;
    }
    
    
/*----------------
 	electronic
----------------*/
.electronic-tab-contents .tab_item {
    width: calc((100% - 20px)/2);
    margin: 0px 5px 20px 5px;    
}    
.electronic-tab-contents .tab_content {
    padding: 0px 5px 0px 5px;
}    
    
/*----------------
 	electronic caution box
----------------*/
.electronic-caution-box-wrap {
    padding: 0px 5px 0px 5px;
}    
.electronic-caution-box {
    padding: 40px 20px 40px 20px;
    margin: 0px 0px 0px 0px;
}
.electronic-caution-box .desc-title {
        margin: 0px 0px 30px 0px;
        text-align: center;
    }
.electronic-caution-box .desc-title p {

        margin: 0 auto;
    }
/*----------------
 	electronic table
----------------*/
.electronic-tab-contents .tab_content .electronic-table-wrap{
    padding: 30px 0px 0px 0px;
}    
.electronic-tab-contents .tab_content .electronic-table-wrap .electronic-table{
    overflow: auto;
  }    
.electronic-tab-contents .tab_content .electronic-table-wrap .electronic-table table{
    white-space: nowrap;
    /*width: 800px;*/

} 
/*----------------
 	contact form
----------------*/
.contact-req-wrap {
    padding: 0px 0px 0px 0px;
}
.contact-form-wrap .form-title {
    flex-basis: 100%;
    max-width: 100%;
    padding: 15px 0px 5px 0px;
    border-bottom: none;
}
.contact-form-wrap .form-input {
    flex-basis: 100%;
    max-width: 100%;
    padding: 5px 0px 15px 0px;
    border-bottom: 1px dotted #B9B9B9;
}    
.contact-btn-wrap input[type="submit"] {
    margin: 0px 5px 0px 5px;
}
.contact-btn-wrap input[type="reset"] {
    margin: 0px 5px 0px 5px;
}
.contact-btn-wrap input[type="button"] {
    margin: 0px 5px 0px 5px;
}    
/*----------------
 	customer service box
----------------*/
.customer-service-box {
        padding: 40px 20px 40px 20px;
}    
.customer-service-box .desc-upper-body p {
    padding: 0px 0px 0px 0px;
}    
.customer-service-box .desc-title {
    text-align:center;
}
.customer-service-box .desc-title p {
    margin: 0 auto;
}
    

/*----------------
 	reprint content
----------------*/

.reprint-content h3 {
    font-size: 126%; 
   
}
.reprint-content .base-cat-wrap{
    padding: 0px 0px 20px 0px;;  
}
.reprint-content .itemhoto {
    margin-right: 5px;
    margin-bottom: 10px;
}    

/*----------------
 	law content
----------------*/  
.base-law-wrap .law-title-wrap {
    margin: 0px 0px 20px 0px;
}    
.base-law-wrap > div:not(:first-child) {
    padding: 0px 0px 0px 0px;
}    
    
}

@media only screen and (max-width: 600px) {
    /*----------------
 	visual
----------------*/
    .visual .visual-image .img-wrap img.products{
        right: 0%;   
        -webkit-transform: translate(30%, -50%);
        -ms-transform: translate(30%, -50%);
        transform: translate(30%, -50%);
    }
    .visual .visual-image .img-wrap img.contact{
        right: 0%;   
        -webkit-transform: translate(45%, -50%);
        -ms-transform: translate(45%, -50%);
        transform: translate(45%, -50%);
    }     

}
@media only screen and (max-width: 400px) {
    /*----------------
 	product box
----------------*/
    .product-single-box .product-img-wrap img {
        max-width: 100%;
    }
    .product-double-box .product-img-wrap img {
        max-width: 100%;
    }
    /*----------------
 	flow box
----------------*/
    .flow-box .flow-img-wrap img {
        max-width: 100%;
    }
    /*----------------
 	 point box
----------------*/
    .point-box .point-img-wrap img {
        max-width: 100%;
    }
/*----------------
 	reprint content
----------------*/

.reprint-content .itemhoto {
    display: block;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 10px;
    margin-top: 0px;
}     
    
}