@charset "utf-8";
/**
 * style.css
 * 
 * @version  1.0
 * @author   ADVANCED INFORMATION DESIGN Co.,Ltd.
 */

/* Reset default browser CSS */
*{ margin: 0; padding: 0; }
body, div, dl, dt, dd, ul, ol, li,h1, h2, h3, h4, h5, h6,
pre, form, fieldset, input, textarea, p, blockquote, th, td { margin: 0; padding: 0; }
address, caption, cite, code, dfn, em, strong, th, var { font-style: normal; font-weight: normal; }
table { border-collapse: collapse; border-spacing: 2px; background: transparent; }
table, input, textarea, select { font: inherit; }
h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal; }
ul, ol { list-style-position: inside; }
img { border: none; vertical-align: bottom; }
hr { border: none; }

/* Font configuration */
body {
    color: #333;
    font-family: 'メイリオ', Meiryo, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', Arial, 'ＭＳ Ｐゴシック', 'MS PGothic', Osaka, sans-serif;
    font-size: 100%;
}
a { color: #343434; text-decoration: underline; }
a:link { color: #4d4d4d; text-decoration: underline; }
a:visited { color: #666; text-decoration: underline; }
a:hover { color: #333999; text-decoration: none; }


/* Common settings */
a img { background: none !important; }
a:hover img { opacity: 0.85; filter:alpha(opacity=85); -ms-filter: 'alpha( opacity=85)'; background: none !important; z-index: 0; }

/* Common classes */
.mb1 { margin-bottom: 1em !important; }
.mb2 { margin-bottom: 20px; }
.mb4 { margin-bottom: 40px; }
.mb6 { margin-bottom: 60px; }
.fl { float: left; }
.fr { float: right; }
.txtl { text-align: left; }
.txtc { text-align: center; }
.txtr, .justifyright { text-align: right; }
.clear { clear: both; }
.clearfix:after { display: block; clear: both; content: ''; }
.clearfix { width:100%; }	/* clearfix IE 6, 7 */
.caution { padding-left: 1.3em; line-height: 1.5em; text-indent: -1.3em; }
.caution:before { margin-right: 0.2em; content: '※'; }
.caution_r { color: #d94a30; }

/* Structure */
body * { line-height: 1.5em; }
div#wrapper { position: relative; background: #faf9f5; z-index: 0; margin-top: -100px; padding-top: 100px; }

/* Common classes */
.w30 { width: 30%; }
.w32 { width: 32%; }
.w38 { width: 38%; }
.w48 { width: 48%; }
.w58 { width: 58%; }
.w64 { width: 64%; }

.more { text-align: center; margin-top: 25px; }
.more a { padding: 8px 80px; border: 1px solid #0e3a58; border-radius: 2px; color: #0e3a58; background:  url('images/bg_white.png');; text-decoration: none; }
.more a:hover { color: #fff; background: #0e3a58; }

.tel::before { content: "Tel." }
.fax::before { content: "Fax." }


/* header */
#header { margin: 15px 0; }

#h_content {
    width: 1060px;
    margin: 0 auto;
    position: relative;
}

#header h1 { float: left; }
#header h1 a { display: block; width: 380px; height: 43px; }
#header h1 img { vertical-align: middle; }

#hnavi{
    float: right;
    display: flex;
}

#hnavi .contact_btn {
    margin: 10px 0 0 20px;
}

#hnavi .contact_btn a {
    background: url('images/contact.png') no-repeat 10px 50%, #e0e2e6;
    padding: 10px 20px 10px 40px;
    text-decoration: none;
    border-radius: 5px;
}
#hnavi .contact_btn a:hover { text-decoration: underline; }

#gnavi {
    background: url('images/bg_black.png');
}

#gnavi ul { clear: both; width: 1060px; margin: 0 auto; }
#gnavi ul li { position: relative; display: inline; }
#gnavi ul li a { 
    display: inline-block;
    padding: 13px 18px;
    text-decoration: none;
    text-align: center;
    color: #fff;
}
#gnavi ul li a:hover { background: #faf9f5; color: #333; }

.clone-nav {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2;
    width: 100%;
    transition: .3s;
    transform: translateY(-100%);
}
.is-show {
    transform: translateY(0);
}

/* --- Page Title --- */
#page_title{
    height: 200px;
    background-size: cover !important;
}
#topicpath {
    width: 1060px;
    margin: 0 auto;
    padding-top: 20px;
    font-size: 75%;
    color: #fff;
}
#topicpath a { color: #fff; 	}
#page_title h1 {
    width: 1060px;
    font-size: 240%;
    font-weight: bold;
    margin: 0 auto;
    padding: 40px 0;
    color: #fff;
    font-family: 'ヒラギノ明朝 Pro W3', 'Hiragino Mincho Pro', 'HGS明朝B', 'ＭＳ Ｐ明朝', serif;
}

/* introduction pagetitle */
body#introduction #page_title,
body.introduction #page_title { background: url('images/bg_pt_in.png') no-repeat center center; }

/* about pagetitle */
body#about #page_title { background: url('images/bg_pt_ab.png') no-repeat center center; }

/* truckbody pagetitle */
body#truckbody #page_title { background: url('images/bg_pt_tr.png') no-repeat center center; }
body.truck_menu #page_title,
body.truck_list #page_title { background: url('images/bg_pt_er.png') no-repeat center center; }

/* snowplow pagetitle */
body#snowplow #page_title,
body#track #page_title,
body#chugata #page_title,
body#kogata #page_title,
body#minitruck #page_title,
body#mini #page_title,
body#jimny #page_title,
body#kanri #page_title,
body#cyuukosya #page_title,
body#sanpu #page_title { background: url('images/bg_pt_sn.png') no-repeat center center; }

/* roofrack pagetitle */
body#roofrack #page_title,
body#noselda #page_title,
body#rearladder #page_title,
body#sample #page_title { background: url('images/bg_pt_ro.png') no-repeat center center; }

/* recruit pagetitle */
body#recruit #page_title { background: url('images/bg_pt_re.png') no-repeat center center; }

/* form pagetitle */
body#form #page_title,
body#product_form #page_title,
body#other_form #page_title { background: url('images/bg_pt_fo.png') no-repeat center center; }

/* policy pagetitle */
body#policy #page_title { background: url('images/bg_pt_po.png') no-repeat center center; }

/* news pagetitle */
body#news #page_title,
body.news_topics #page_title { background: url('images/bg_pt_ne.png') no-repeat center center; }

/* error pagetitle */
body#error #page_title { background: url('images/bg_pt_er.png') no-repeat center center; }

/* --- Content --- */
#content { width: 1060px; margin: 0 auto; }
#content section {
    margin-bottom: 60px;
    padding-top: 70px; /* ページ内リンク用 */
    margin-top: -70px; /* ページ内リンク用 */
}
#content img { max-width: 100%; height: auto; }
#content #main { float: left;  width: 780px; margin: 0 0 100px; }
#content #sub  { float: right; width: 240px; margin-top: 70px; }

#content h2 {
    position: relative;
    font-size: 180%;
    font-weight: 600;
    color: #0e3a58;
    margin-bottom: 20px;
    padding: 10px;
    border-top: 2px solid #ddd;
}
#content h2::after {
    position: absolute;
    top: -2px;
    left: 0;
    width: 30%;
    height: 4px;
    background-color: #0e3a58;
    content: ''; 
}
#content h3 {
    font-size: 140%;
    font-weight: bold;
    margin-bottom: 20px;
    color: #444;
    border-left: #c69113 5px solid;
    padding-left: 10px;
    font-family: 'ヒラギノ明朝 Pro W3', 'Hiragino Mincho Pro', 'HGS明朝B', 'ＭＳ Ｐ明朝', serif;
}
#content h4 {
    font-size: 110%;
    font-weight: bold;
    margin-bottom: 10px;
}

#content table { width: 100%; }
#content table caption { margin-bottom: 10px; font-size: 120%; text-align: left; font-weight: bold; }
#content table tr { border-bottom: #666 dotted 1px; }
#content table tr:first-child { border-top: solid 1px; }
#content table tr:last-child { border-bottom: solid 1px; }
#content table th,
#content table td { padding: 0.5em; }
#content table th { text-align: left; font-weight: bold; background: #e0e2e6; }

#content ul li { list-style: none; }

#content .prod_mn ul li {
    position:relative;
    border: #0e3a58 solid 1px;
    padding: 10px;
    border-radius: 2px;
    font-weight: bold;
    font-size: 120%;
    color: #0e3a58;
    margin-bottom: 10px;
}
#content .prod_mn ul li:nth-child(odd)  { float: left;  width: 45%; }
#content .prod_mn ul li:nth-child(even) { float: right; width: 45%; }
#content .prod_mn .txt::after { padding: 0.2em 0 0 0.5em; font-weight: normal; font-size: 70%; content: "→詳しくはこちら" }
#content .prod_mn .img { float: right; margin-right: 10px; height: 100px; text-align: center; }
#content .prod_mn .img img {
    max-height: 100% !important;
    width: auto;
    height: 100% !important;
}
#content .prod_mn ul li a {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    text-indent:-999px;
}
#content .prod_mn ul li:hover { background: #0e3a58; color: #fff; border-radius: 2px; }

#content dl.description dt { font-size: 120%; margin-bottom: 10px; font-weight: bold; }

/* main */
#main .price { font-size: 140%; }
#main .red { color: #ff0000; }
#main .title {
    font-size: 140%;
    font-family: 'ヒラギノ明朝 Pro W3', 'Hiragino Mincho Pro', 'HGS明朝B', 'ＭＳ Ｐ明朝', serif;
}

#main ul.listmark { margin: 1em 0; }
#main .circle_b,
#main ul.listmark li {
    background: url('images/circle_b.png') no-repeat 10px 50%;
    padding-left: 25px;
}
#main .circle_y {
    background: url('images/circle_y.png') no-repeat 10px 50%;
    padding-left: 25px;
}
#main .double_b {
    background: url('images/double_b.png') no-repeat 0 50%;
    padding-left: 20px;
    font-weight: bold;
}
#main .double_r {
    background: url('images/double_r.png') no-repeat 0 50%;
    padding-left: 20px;
}


/* about */
body#about #sm03 table td { min-width: 32%; width: 32%; }
body#about #googlemap {
    width: 100%;
    height: 300px;
    margin-top: 20px;
}
body#about .name { width: 12em; float: right; margin-top: 10px; font-weight: bold; }
body#about table#history tr th { width: 10em; }
body#about #his_img { text-align: center; }
body#about #his_img img { width: 544px; } 
body#about sub { font-size: 60%; vertical-align: sub; }

/* -- Truck Body -- */
#max div.img { position: relative; }
#max div.catch {
    position: absolute;
    top: 20px;
    right: 20px;
    font-size: 140%;
    font-family: 'ヒラギノ明朝 Pro W3', 'Hiragino Mincho Pro', 'HGS明朝B', 'ＭＳ Ｐ明朝', serif;
}
#max div.catch em { font-size: 115%; }
	

/* truck_all */
#truck_all table img { width: 100px }
#truck_all table a { padding: 3px 5px; border: 1px solid #0e3a58; border-radius: 2px; color: #0e3a58; text-decoration: none; }
#truck_all table a:hover { color: #fff; background: #e3e3e3; }

.thumbnail{
    overflow: hidden;
    width: 100%;
    height: 100%;
}
.thumbnail li{
    width: 108px;
    height: 80px;
    overflow: hidden;
    float: left;
    margin-right: 1%;
    list-style: none;
}
.thumbnail li img{
    width: 108px;
    height: auto;
    opacity: 0.5;
    filter: alpha(opacity=50); 
}
.thumbnail li.current img{
    opacity: 1;
    filter: alpha(opacity=100);
}
.main_photo{
    position: relative;
    max-width: 450px;
    width: 450px;
    height: 250px !important;
    border: #d0d8d3 solid 1px;
    margin-bottom: 10px;
}
.main_photo img{
    width: auto !important;
    max-width: 100%;
    max-height: 250px;
    width: 100%;
    height: 250px;
    position: absolute;
    top:0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
}

table.tb_all td.tb_img { min-width: 15%; width: 15%; }
table.tb_all td.tb_img img { width: 100%!important; }
table.tb_all td.tb_gvw { min-width: 11%; width: 11%; }
table.tb_all td.tb_max { min-width: 14%; width: 14%; }
table.tb_all td.tb_more { min-width: 9%; width: 9%; }
table.tb_all td.tb_more a {
    padding: 2px 10px;
    border-radius: 2px;
    color: #0e3a58;
    border: 1px solid #0e3a58;
    text-decoration: none;
}
table.tb_all td.tb_more a:hover {
    background: #0e3a58;
    color: #fff;
}

/* -- Snow Plow -- */
#snowplow_meue ul { margin-top: 20px; }
#snowplow_meue ul li {
    float: left;
    width: 220px;
    height: 175px;
    margin-right: 18px;
    border: 1px solid #ccc;
    vertical-align: middle;
    position: relative;
}
#snowplow_meue ul li:first-child: { margin-right: 0; }
#snowplow_meue ul li dl dd a {
    position: absolute;
    bottom: 0;
    width: calc(100% - 10px);
    padding: 5px;
    color: #fff;
    background: url('images/bg_blue.png');
    text-decoration: none;
}

#content .size {
    font-weight: bold;
    font-size: 120%;
    margin-bottom: 20px;
}

#snowplow #main p video { width: 100%; }

/* track */
body#track .bg_img { float: right; width: 80%; }
body#track .title { font-size: 120%; }
body#track .title span { font-size: 140%; }
body#track #option ul li { margin-bottom: 60px; }
body#track #yuatsu { background: #f5f5c3; padding: 20px; border-radius: 5px; }
body#track #yuatsu img { height: auto; }
body#track #souko ul li:first-child { margin-bottom: 20px; background: url('images/arrow_bb.png') no-repeat 50% 90%; }
body#track #souko dl dt { float: left; width: 32% }
body#track #souko dl dd { float: right; width: 64%; }
body#track #souko dl dd img { float: right; width: 50%; height: auto; }
body#track #tilt dl dt{ float: left;  width: 32%; }
body#track #tilt dl dd{ float: right; width: 64%; }
body#track #torihazushi ul li { float: left; height: 270px; margin-right: 40px; }
body#track #torihazushi ul li:last-child { margin-right: 0; }
body#track #torihazushi ul li img { height: 100%; }
body#track p#four {
    border: 5px solid #ddd;
    padding: 20px 20px 20px 30px;
    border-radius: 5px;
    background: url('images/circle_y.png') no-repeat 15px 35%
}
body#track dl#set {
    background: #f5f5c3;
    padding: 20px;
    border-radius: 5px;
}
body#track dl#set dt { font-size: 110%; font-weight: bold; margin-bottom: 10px; }
body#track #option .price { margin: 0 5px 0 10px; }

/* sanpu */
body#sanpu #main ul li:nth-child(odd)  { float: left;  width: 48%; }
body#sanpu #main ul li:nth-child(even) { float: right; width: 48%; }
body#sanpu #sanpu_spe dl dt { font-weight: bold; margin-bottom: 5px; }
body#sanpu #sanpu_spe dl dd { margin-left: 10px; }

/* minitruck & jimny*/
body#minitruck div.img { position: relative; }
body#minitruck .bg_img { width: 53%; right: 0; }
body#minitruck #ct01 {
    position: absolute;
    top: 50px;
    right: 0;
    font-size: 140%;
    font-family: 'ヒラギノ明朝 Pro W3', 'Hiragino Mincho Pro', 'HGS明朝B', 'ＭＳ Ｐ明朝', serif;
}
body#minitruck #ct02 {
    position: absolute;
    bottom: 30px;
    right: 0;
}
body#minitruck #anzen ul li { float: left; height: 150px; padding-right: 4%; }
body#minitruck #anzen ul li img { height: 100%; width: auto; }
body#minitruck #anzen ul li:first-child { padding-right: 8%; background: url('images/arrow_rb.png') no-repeat 210px 50%; }
body#minitruck #anzen ul li:last-child { padding-right: 0; }
body#minitruck #angle ul li:nth-child(odd)  { float: left;  width: 48%; }
body#minitruck #angle ul li:nth-child(even) { float: right; width: 48%; }
body#minitruck #sell dl dt { font-weight: bold; font-size: 110%; }
body#minitruck #ichiran dl { font-weight: bold; }
body#minitruck #ichiran dl dt { font-size: 140%; color: #ff0000; }
body#minitruck #ichiran dl dd { font-size: 120%; text-decoration: underline; }
body#minitruck #ichiran table th.t01 { min-width: 150px; width: 150px; }
body#minitruck #ichiran table th.t02 { min-width: 80px; width: 80px; }
body#minitruck #ichiran table th.t03 { min-width: 130px; width: 130px; }

/* mini */
body#mini .catch {
    font-size: 140%;
    font-family: 'ヒラギノ明朝 Pro W3', 'Hiragino Mincho Pro', 'HGS明朝B', 'ＭＳ Ｐ明朝', serif;
}

#jm div.img { position: relative; }
#jm .bg_img { width: 60%; right: 0; padding: 50px 0; }
#jm div.catch {
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 140%;
    font-family: 'ヒラギノ明朝 Pro W3', 'Hiragino Mincho Pro', 'HGS明朝B', 'ＭＳ Ｐ明朝', serif;
}
#jm div#catch_img { top: 110px; right: 0; }

/* jimny */
body#jimny table th { width: 32%; }

/* kanri */
#kanri .bracket {
    font-size: 120%;
    font-weight: bold;
    color: #f00;
    margin: 1em 0;
}

/* -- Roofrack -- */
body#roofrack .img { position: relative; height: 320px; }
body#roofrack .bg_img { width: 40%; }
body#roofrack .catch {
    font-size: 140%;
    font-family: 'ヒラギノ明朝 Pro W3', 'Hiragino Mincho Pro', 'HGS明朝B', 'ＭＳ Ｐ明朝', serif;
}
body#roofrack .ct01 { position: absolute; top: 0; right: 0; }
body#roofrack .ct02 { position: absolute; left: 10px; bottom: 15px;}
body#roofrack #feature ul li { margin-bottom: 60px; }

/* noselda */
body#noselda #main > div,
body.roofrack_list #main > div { margin-bottom: 40px; }
body#noselda #main > div > div { margin-bottom: 20px; }
body#noselda p.pdf { margin-top: 30px; text-align: center; }
body#noselda p.pdf a {
    color: #fff; 
    padding: 10px 75px;
    text-align: center;
    text-decoration: none;
    border-radius: 2px;
    background: url('images/bg_pdf.png') no-repeat 30px 50%, #c69113;
}
body#noselda p.pdf a:hover { opacity: 0.85; }

/* rearladder */
body#rearladder #main > div { margin-bottom: 60px; }
body#rearladder table th { width: 7em; }


/* attention */
#content .attention ul li {
    list-style-type : disc;
    margin-left: 1em;
}
#content .attention ul.listmark li { list-style: none; }

*#content .attention .border { border: 5px solid #ddd; padding: 15px; border-radius: 2px; }


/* -- recruit -- */
#recruit div.img { position: relative; }
#recruit div.catch { font-size: 170%; font-family: 'ヒラギノ明朝 Pro W3', 'Hiragino Mincho Pro', 'HGS明朝B', 'ＭＳ Ｐ明朝', serif; }
#recruit span.tel { margin: 0 5px; }
#recruit span.em { font-size: 110%; font-weight: bold; }
#recruit span.em { font-size: 110%; font-weight: bold; }
#recruit #movie dl dt { float: left; width: 45%; }
#recruit #movie dl dt p:last-child { text-align: center; }
#recruit #movie dl dt video { display: block; width: 100%;}
#recruit #movie dl dd { float: right; width: 50%; }
#recruit #voice ul li:first-child { margin-bottom: 20px; }
#recruit #voice dl dt { float: left; width: 32% }
#recruit #voice dl dd { float: right; width: 64%; }
#recruit #voice111 dl dd img { float: right; width: 50%; height: auto; }
#recruit #content table th { width:4.5em; }

/* -- form -- */
#form #main .tel em { font-size: 30px; }
#form .caution em { color: #f00; }
#form ul.caution { padding-left: 0; }
#form ul.caution:before,
#form p.caution:before { content: none; }
#form ul.caution li { padding-left: 40px; background: url('images/circle_y.png') no-repeat 5px 7px; }
#form table.form { margin: 20px 0; }
#form #content tr th { width: 170px; max-width: 170px;  }
#form #content tr th.required::before,
#form #content tr td.required::before { color: #f00; content: "*"; }
#form #content tr td p.error { color: #f00; }
#form #content tr td a { font-weight: bold; }
#form .btnarea { margin-top: 40px; text-align: center; }
#form .btnarea form { display: inline-block; margin-left: 20px; }
#form input#btn_conf,
#form input#btn_turn,
#form input#btn_send { width: 12em; padding: 0.7em 0; border: none; border-radius: 2px; text-align: center; }
#form input#btn_conf,
#form input#btn_send { background-color: #c69113; color: #fff; }
#form input#btn_turn { background-color: #adaca4; color: #fff; }
#form input#btn_conf:hover,
#form input#btn_send:hover,
#form input#btn_turn:hover { opacity:0.5; }


/* news */
.post { padding: 5px 0; border-bottom: 1px dotted #6c6753; }
.post .postedon { display: block; font-size: small; }
.post span.category { border-radius: 2px; font-size: small; }
.post span.info,
.post span.introduction  { background: #c69113; }
.post span.products { background: #4b87ce; }
.post span.category a { display: inline-block; width: 6em; color: #fff; text-align: center; text-decoration: none; }
.post p { display: inline; margin-left: 0.5em; }
#main p#paginate { margin-top: 50px; }
#main p#paginate span,
#main p#paginate a { margin-left: 3px; padding: 0.2em 1.2em; background: #e8eaee; border-radius: 0.8em; color: #4d4d4d; }
#main p#paginate span.ditto_currentpage { background: #1D3156; color: #fff; }
#main p#paginate span.ditto_off { background: #e8eaee; color: #bbb; }
#main p#paginate a:hover { background: #606e88; color: #fff; text-decoration: none; }

/* localmenu */
#localmenu {
    margin-bottom: 40px;
    border: #0e3a58 solid 1px;
    border-radius: 2px;
    background: #fff;
}

#localmenu * {
    margin: 0;
}

#localmenu .figcaption {
    padding: 10px;
    background: #0e3a58;
    color: #fff;
    font-weight: bold;
}

#localmenu ul li {
    list-style: none;
}

#localmenu ul li a {
    display: block;
    padding: 10px 20px 10px 10px;
    border-top: #ccc dotted 1px;
    background: url('images/bg_article.png') no-repeat 95% 50%;
}


/* product_menu */
#product_menu {
    margin-bottom: 40px;
    border-radius: 2px;
}
#product_menu * {
    margin: 0;
}
#product_menu .figcaption {
    padding: 10px;
    font-weight: bold;
    color: #0e3a58;
    font-size: 140%;
}
#product_menu .figure > ul { border: 1px solid #0e3a58; border-radius: 2px; }
#product_menu ul li a {
    display: block;
    padding: 10px 25px 10px 10px;
    text-decoration: none;
    background: url('images/bg_article_w.png') no-repeat 95% 50%;
}
#product_menu ul li  { background: #0e3a58; }
#product_menu .figure > ul > li > a {
    font-weight: bold;
    color: #fff;
}
#product_menu ul li li { background: #c4cada; }
#product_menu ul li li a {
    padding-left: 1em;
    background: url('images/bg_article.png') no-repeat 95% 50%;
    color: #333;
    border-top: #999 dotted 1px;
}
#product_menu ul li li li { background: #fff; }
#product_menu ul li li li a {
    padding-left: 1.5em;
}

#product_menu ul li a:hover {
    text-decoration: underline;
}

/* footer */
#footer { background: url('images/bg_black.png'); color: #fff; padding: 20px 0; font-size: 95%; }
#footer div { width: 1060px; margin: 0 auto; }
#footer h1 img { float: left; margin-right: 1em; }
#footer nav ul { float: right; font-size: 90%; }
#footer ul li { display: inline-block; padding-right: 0.5em; }
#footer ul li:last-child { padding-right: 0; }
#footer nav ul li:last-child::before { content: "|"; padding-right: 0.5em; }
#footer nav a { color: #fff; }
#footer address { display: inline-block; }

#copyright { padding-top: 10px; text-align: center; }
p#pagetop { position:fixed; right: 0; bottom: 0; }