@charset "utf-8";
@media only screen and (min-width:1200px){
.container { width: 1060px;}

#product .prod-type { margin-bottom: 30px;}
}


@media only screen and (min-width: 960px) and (max-width: 1199px) {
.container { width: 960px;}

#menu li a { padding: 0 15px;}

#product .prod-type:after { background-size: 225px auto;}

/*Pages*/
.sub-banner-shadow { padding-bottom: 30px;}

#product-catagory .prod-type a { max-height: 118px;}
#product .col-item-5.prod-type:after { background-size: 110px auto;}

/*Download*/
.login-box { left:55%;}

/*History*/
.history-img{margin-left: 13.367%;}

#product .prod-type { width: 25%; margin-bottom: 20px;}
#product span { padding: 0 10px;}

}

@media only screen and (min-width: 768px) {
#tono-menu { display: none;}
/*Paging*/
.tono-paging li { display: inline-block;}

/*Register*/
#register .reg-box { padding-right: 30px; border-right: 1px solid #d7d7d7;}
.register-form { padding: 0 0 0 20px;}

#register .quick-info { padding-top: 40px; padding-left: 20px; background-color: #fff; border-top: none; text-align: left;}
#register .quick-info a { display: block;}

/*Contact*/
.contact-form .col-2 { padding-right: 0;}

}

@media only screen and (min-width: 768px) and (max-width: 959px) {
.container { width: 900px;}
.container-fluid { min-width: 900px;}

#menu li a { padding: 0 15px;}

#files:after { background-size: 215px auto;}
#product .prod-type:after { background-size: 210px auto;}
#product .col-item-5.prod-type:after { background-size: 110px auto;}


/*Pages*/
.sub-banner-shadow { padding-bottom: 25px;}

#product-catagory .prod-type a { max-height: 109px;}

/*Document*/
.col-4.document-item { width: 50%;}
/*Download*/
.login-box { left:50%;}

/*History*/
.history-img{margin-left: 13.167%;}

#product .prod-type { width: 25%; margin-bottom: 20px;}
}

@media only screen and (min-width: 480px) and (max-width: 767px){
.hidden-phone { display: none;}
.hidden-pc { display: block;}
.container { width: 450px;}


header h1 { /*margin: 20px 10px 20px -10px; */font-size: 250%;  display: inline-block;}
header img { /*height: 25px;*/ width: 200px;}
#tono-nav { top: 15px; right:10px}

/*Banner*/

/*#banner { padding-bottom: 100px;}*/
/*p.bjqs-caption { bottom: -60px !important; padding-top: 10px !important; padding-bottom: 10px !important; padding-left: 70px !important; width: 75% !important; height: 60px !important; font-size: 150% !important;}*/
/*
p.bjqs-caption span { display: none !important;}
p.bjqs-caption:before { top: 10px !important; width: 40px !important; height: 40px !important; background-size: 40px auto !important;}
ol.bjqs-markers  { padding-top: 22px !important; height: 60px !important;}
ol.bjqs-markers a { margin-right: 10px !important;}
*/

/*product*/
#product { margin-bottom: 0;}
#product .prod-type { float: left!important; margin-bottom: 20px;}
#product .prod-type:after { right: 0; opacity: 0.3; height: 20px; background-size: auto 20px;}
#product .col-item-5 .icon-view { width: 140px; height: 160px; background-size: 140px auto;}
#product .col-item-5 a:hover .icon-view { margin-top: 25%; margin-bottom: 10%; width: 35px; height: 40px; background-size: 35px auto;}

.prod-links ul li { text-align: left;}
.prod-links ul li a { font-size: 130%; }

.register-form dt { padding-bottom: 10px;}

/*footer*/
footer { margin-top: 20px; font-size: 80%;}
footer:before { right: -5%; top: 0; display: block; content: ""; width: 400px; height: 280px;}
#footer-top { padding: 10px 0;font-size: 140%;}
#footer-top div:first-child { text-align: left;}
#footer-top div:last-child { text-align: left;}

#footer-bottom { padding: 10px 0;}
#footer-bottom dl.row { margin-left: 0; margin-right: 0; margin-top: 15px; padding-top: 15px; border-top: 1px solid #333;}
#footer-bottom .col-3,
#footer-bottom .col-9 { float: none !important; width: 100%;}

/*Pages*/
.sub-banner-shadow { padding-bottom: 15px;}

/*service*/
#service .service-title span { font-size: 66%;}
#service .plr10 { padding-left: 0; padding-right: 0; padding-top: 40px;}

/*product*/
.prod-series ul li { min-width: 49%;}
#product-catagory .prod-type a { max-height: 123px}

/*Application*/
.col-4.appliaction-item { float: left !important; width: 50%;}
.col-4.appliaction-item .box { margin-left: 10px; margin-right: 10px;}

/*Document*/
.col-4.document-item .box { margin-left: 10px; margin-right: 10px;}

/*Responsive*/
.row.resposive-type [class^="col-"], .row.resposive-type [class*="col-"] { float: left !important; padding-left: 10px; padding-right: 10px; padding-bottom: 20px; width: 50%;}
.row.resposive-type [class^="col-"]:nth-child(4), .row.resposive-type [class^="col-"]:nth-child(5),
.row.resposive-type [class*="col-"]:nth-child(4), .row.resposive-type [class*="col-"]:nth-child(5) { padding-bottom: 0;}
.row.resposive-list { padding-left: 10px; padding-right: 10px; }

/*Inquiry*/
#verification input[type="text"] { margin-bottom: 20px;}
.inquiry-form .row { margin-left: 0; margin-right: 0;}

/*Download*/
.login-bg { height: 160px;}
.login-box { top: 0; left: 0;}
.login-form .row { margin-left: 0; margin-right: 0; margin-bottom: 10px;}
.login-title { padding-bottom: 10px;}
#verification { margin-right: 20px; width: 40%; float: left !important; z-index: 10;}
.login-form button { margin-bottom: 20px;}

/*Register*/
#register .login-title { padding: 10px;}
.register-form { padding: 0 20px;}
.register-form span.required,
.edit-form span.required  { position: static; float: none;}

.edit-form dt { padding-bottom: 10px;}

/*Download List*/
.main-catagory { margin-bottom: 20px; padding: 0 10px;}
.main-catagory li { width: 50%; margin: -1px -1px 0 0; padding-left: 0; padding-right: 0; font-size: 150%;}
.main-catagory li a { padding: 10px;}

.sub-catagory li { width: 50%;}

/*Member*/
.edit-form { padding: 0 20px;}
.edit-form .row { margin-bottom: 0;}
#member .edit-form hr { margin-left: -30px; margin-right: -30px;}

/*Contact*/
.contact-form { padding: 10px;}
.contact-form span.required { float: none;}
.contact-form .row { margin-left: 0; margin-right: 0; margin-bottom: 0;}
.office { margin: 20px 10px;}

/*History*/
.history-img {margin-left: 11.467%;}

.contact-form label.ext, .edit-form label.ext { margin-left: 0; margin-right: 0;}
.contact-form dt { padding-bottom: 10px;}
}

@media only screen and (max-width: 767px) {
.ask-car.hidden-pc { display: inline-block; font-size: 12px; padding: 7px 10px; margin-top: -5px;}
#sub-banner h2 { margin: 10px auto; bottom: 0; font-size: 20px;}
}

@media only screen and (max-width: 479px) {
.hidden-phone { display: none;}
.hidden-pc { display: block;}

.container { width: 94%;}

header h1 { margin:0;display: inline-block;}
header img { width: 200px;}
#tono-nav { top: 15px; padding: 6px 10px;}
/*#tono-nav .icon-menu { width: 14px; height: 11px; background-size: 14px auto;}*/
.ask-car.hidden-pc {  margin-top: -15px;}
.ask-car i { display: none;}
/*banner*/
/*
#banner { padding-bottom: 45px;}
#banner:after { height: 20px; background-size: 300px auto; background-repeat: no-repeat;}
p.bjqs-caption { display: none !important;}
ol.bjqs-markers  { padding-top: 5px !important; background-color: #222 !important; height: 25px !important; text-align: center !important;}
ol.bjqs-markers a { margin: 0 5px !important; width: 10px !important; height: 10px !important;}
*/
/*product*/
#product { margin-bottom: 0;}
#product .box-content { padding: 0 10px;}
#product .box-content a { left: 0; right: -1px;}
#product .box-content img { width: 100%;}
#product .prod-type { margin-bottom: 20px;}
#product .prod-type:after { right: 0; opacity: 0.3; height: 20px; background-size: auto 20px;}
#product .prod-type.col-item-5:nth-child(even) { padding-right: 0;}
#product .prod-type.col-item-5:nth-child(odd) { padding-left: 0;}
#product .prod-type.col-item-5:nth-child(even) a { left: 10px; padding-right: 0;}
#product .prod-type.col-item-5:nth-child(odd) a { right: 10px; padding-left: 0;}
#product .prod-type.col-item-5 a span { white-space: inherit; font-size: 50%;}
#product .prod-type.col-item-5 a:hover span { font-size: 100%;}
#product .prod-type.col-item-5 a:hover .icon-view { margin-top: 10%;}

#product-catagory .prod-type a { max-height: 119px}

#product .prod-wrap { padding: 0;}

.prod-links ul li { text-align: center;}
.prod-links ul li a { font-size: 130%; padding: 7px 0;}

.register-form dt { padding-bottom: 10px;}

/*Footer*/
footer { margin-top: 20px; font-size: 80%;}
footer:before { right: -15%; top: 0; display: block; content: ""; width: 400px; height: 300px;}
#footer-top { padding: 10px 0; font-size: 140%;}
#footer-top div:first-child { text-align: center;}
#footer-top div:last-child { text-align: left;}

#footer-bottom { padding: 15px 0 0;}
#footer-bottom dl.row { margin-left: 0; margin-right: 0; margin-top: 15px; padding-top: 15px; border-top: 1px solid #333;}
#footer-bottom .col-3 { float: right !important; padding-right: 10px; width: 100%;}
#footer-bottom .col-9 { float: left !important; width: 100%;}

/*Pages*/
.sub-banner-shadow { margin-bottom: 10px; padding-bottom:10px;}
.page-title { height: auto;}
.page-title .btn { position: static; margin-top: 10px; display: block; text-align: center;}


/*Service*/
#service .service-title span { font-size: 66%;}
#service .plr10 { padding-left: 0; padding-right: 0; padding-top: 40px;}

/*Product Page*/
.prod-links ul li [class^="icon-"] { display: block; margin-bottom: 5px; margin-left: auto; margin-right: auto;}
.prod-series ul li { min-width: 100%;}

/*Application*/
.col-4.appliaction-item .box { margin-left: 10px; margin-right: 10px;}
/*Document*/
.col-4.document-item .box { margin-left: 10px; margin-right: 10px;}
/*Document List*/
.list-item li time { display: none;}
/*Document List*/
#product-document-detail .page-sub-title { padding-right: 15px;}
/*Responsive*/
.row.resposive-type [class^="col-"] { padding-left: 10px; padding-right: 10px; padding-bottom: 10px;}
.row.resposive-type [class^="col-"]:last-child { padding-bottom: 0;}
.row.resposive-list { padding-left: 10px; padding-right: 10px; }

/*Inquiry*/
#verification input[type="text"] { margin-bottom: 20px;}
.inquiry-form span.required { float: none;}
.inquiry-form .row { margin-left: 0; margin-right: 0; margin-bottom: 10px;}
.register-form span.required { float: none;}
#inquiry [class^="icon-"] { margin-right: 0;}
#inquiry .page-title .btn { position: absolute; margin-top: 0; top: 10px;}

/*Download*/
.login-bg { height: 100px;}
.login-box { left: 0; margin-bottom: 0; min-width: 100%; border: none;}
.login-form .row { margin-left: 0; margin-right: 0; margin-bottom: 10px;}
.login-title, .login-form { padding: 0;}
.login-title span { display: none;}
#verification { /*margin-right: 20px; width: 40%; float: left !important;*/}
.login-form button { margin-bottom: 20px;}

#pwd-box { padding: 20px;}

/*Register*/
#register .login-title { padding: 10px;}
.register-form { padding: 0 10px;}
.register-form span.required { float: none;}
.register-form button { margin-bottom: 20px;}

/*Download List*/
.main-catagory { margin-bottom: 20px;}
.main-catagory li { float: none; display: block; margin: -1px 0 0; padding-left: 10px; padding-right: 10px; font-size: 150%;}
.main-catagory li a { padding: 10px;}
.main-catagory li a [class^="icon-"] { width: 20px; height: 20px; background-size: 10px; border-width: 5px;}

.sub-catagory li { display: block; width: 100%}

/*Member*/
.edit-form { padding: 0 20px;}
.edit-form .row { margin-bottom: 0;}
#member .edit-form hr { margin-left: -30px; margin-right: -30px;}

/*Contact*/
.contact-form { padding: 10px;}
.contact-form span.required { float: none;}
.contact-form .row { margin-left: 0; margin-right: 0; margin-bottom: 0;}

.office { margin: 20px 10px;}

/*Tabs*/
.tabs nav { height: auto;}
.tabs nav li.tab-current { border-bottom-color: #d7d7d7 !important;}

/*History*/
.history-img {margin-left: 12.467%; height: 24px;}

.contact-form label.ext, .edit-form label.ext { margin-left: 0; margin-right: 0;}

.contact-form dt { padding-bottom: 10px;}

}