/* ver7 */

h3 { font-size:1.1rem; font-weight:700; margin-bottom:.5rem; color:#003e5f;}

.branchslide {
  max-height:410px;
  min-height:343px;
  height:calc((100vw - 205px) * 205 / 618); 
}

.branchslider img { width:100%;height:auto;}

.sub-nav { width:90%; margin:2rem auto !important;}
.sub-nav ul { width:100% !important;}
.sub-nav ul li {flex: 1 0 20%; text-align:center; padding:5px;}
.sub-nav ul li a { display:block; padding:2px; width:95%; margin:auto; box-shadow: inset 1px 1px 0px 0px #ffffff; background-color: #ffffff; border:1px solid #aaa;}
.sub-nav ul li img { width:85%; max-width:75px; display:block; margin:auto; -webkit-transition:.3s; -o-transition:.3s; transition:.3s; height:auto;}
.sub-nav ul li span { font-size:.8rem; font-weight:700;}
.sub-nav ul li a:hover { background: -webkit-gradient( linear, left top, left bottom, color-stop(5%, #ffffff), color-stop(100%, #f6f6f6) ); text-decoration:underline;}

#bestsellers ul {
  display:flex;
  flex-flow:row wrap;
  font-size:.85rem;
  line-height:1.1rem;
  font-weight:700;
}
#bestsellers ul li {
  width:20%;
  text-align:center;
  margin-bottom:24px;
}
#bestsellers ul li a {
  display:inline-block;
}
#bestsellers ul li img {
  display:block;
  margin:0 auto 8px;
}
#bestsellers ul li span {
  display: block;
  width:90px;
  margin:6px auto 0;
}
#bestsellers ul li span, .btn-seeall {
  padding: 2px 5px 2px;
  border: 1px solid #000;
  border-radius: 3px;
  box-shadow: inset 0 1px 0 #fff;
  background: -webkit-gradient(linear,left top, left bottom,color-stop(0, #FFC107),to(#FF9800));
  background: -o-linear-gradient(top,#FFC107 0,#FF9800 100%);
  background: linear-gradient(to bottom,#FFC107 0,#FF9800 100%);
  border: 1px solid #da8201;
  font-weight:normal;
  font-size:.85rem;
}
ul.sl-container {
  display:flex;
  flex-flow:row wrap;
}
ul.sl-container li {
  width:10%;
  text-align:center;
  font-size:.8rem;
  font-weight:700;
  line-height:.95rem;

}
ul.sl-container li img {
  display:block;
  margin:0 auto 12px;
}
ul.sl-container li img[src*="nophoto"] {
  border: 1px solid #cccccc;
}
ul.sl-container .pd1_n {
  color: #FFFFFF;
  background-color: rgba(255,0,0,0.8);
  font-size: 12px;
  font-weight: bold;
  width: 100px;
  font-style: italic;
  display: block;
  margin: 3px auto;
}
#agent .agentbox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
#agent .agentbox li { text-align:center; padding:9px; width:calc(50% - 10px); margin:10px 5px; border:2px solid #ccc; background:#ffffff;}
#agent .agentbox h4 { background:#ececec; padding:5px 0; font-weight:700;}
#agent .agentbox h5 { font-style:italic; margin-bottom:3px; color:#000000; font-weight:700;}

#howtobuy h3 { font-size:1.3rem; font-weight:700;}
#howtobuy .htbbox img { float:left; border:1px solid #888888;}
#howtobuy .htbbox .media-body { float:right; width:calc(100% - 155px - 1.2rem); margin-left:1.2rem;}
#howtobuy .htb_arr { margin: 15px 0 15px 57px;}

#local_info #localbox input, #local_info #localbox .localcontent { display:none;}
#local_info #localbox { margin-left:5px;}
#local_info #localbox:first-of-type { margin-top:1.5em; border-top:1px solid #ccc;}

#local_info #localbox label[for*=localcard] {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  width:100%;
  background:#ffffff;
  padding:12px 12px;
  position:relative;
  border-bottom:1px solid #ccc;
  box-sizing:border-box;
  cursor:pointer;
}

#local_info #localbox label:hover {
  background:#f7f7f7;
}

#local_info #localbox input[id^="localcard"]:checked ~ label[for^="localcard"] {
  background:#f7f7f7;
  border-width:0px 1px 1px;
  border-color:#ccc;
  border-style:none solid dashed;
}

#local_info #localbox #card_left { float:left; width:calc(100% - 300px); max-width:890px; overflow-wrap: break-word;}
#local_info #localbox #card_right { width:300px; float:right; padding-right:100px;}
#local_info #localbox h5 {
  font-size:23px;
  line-height:24px;
  font-weight:700;
  margin-bottom:1rem;
}
#local_info #localbox p { font-size:.9rem; font-weight:normal; line-height:18px; margin-bottom:0;}
#local_info #localbox #card_right img { height:80px;}
#local_info #localbox label[for^="localcard"]:after {
  content:"";
  position:absolute;
  right:40px;
  top:50%;
  display:inline-block;
  width: 16px;
  height: 16px;
  border-width: 6px 6px 0 0;
  border-color: #585858;
  border-style: solid;
  border-top-right-radius:3px;
  transform:translateY(-50%) rotate(135deg);
  transition:.1s;
}
#local_info #localbox input[id^="localcard"]:checked ~ label[for^="localcard"]:after {
  transform:translateY(-50%) rotate(-45deg);
}
#local_info #localbox .localcontent {
  border:1px solid #ccc;
  border-top:0;
  background:#fff;
  padding:15px;
  clear:both;
}
#local_info #localbox input[id^="localcard"]:checked ~ .localcontent { display:block;}
.localcontent .contact { margin:20px;}
.localcontent .contact ul li {
  font-size:22px;
  margin:0 0 17px;
  font-weight:normal;
  line-height:28px;
  display:inline-block;
  width:50%;
  float:left;
}

.localcontent .contact ul li a { border-bottom:1px solid #222;}
.localcontent .contact ul li a:hover { border-bottom:0; text-decoration:none;}


.l_i {
  font-size:13px !important;
  font-weight:700;
  width:90px;
  padding:0 10px;
  text-align:center;
  border-radius:5px;
  vertical-align:middle;
  margin-right:10px;
  display:inline-block;
}
.l_i_phone {
  background:#17a2b8;
  color:#fff;
}

.l_i_whatsapp {
  background:#28a745;
  color:#fff;
}

.l_i_email {
  background:#ffc107;
  color:#000;
}
#local_info #localbox .face div {list-style:none;}

.sbox3 {
  display: inline-block;
  width: 140px;
  height: 252px;
  margin: 10px 40px 25px 0;
  float:left;
}
.sbox3 img {
  width: 100%;
  height: auto;
  margin-left: 0;
  margin-bottom: 10px;
  outline:solid 1px #a2a8c8;
}
.sbox3 .sbox3-name {
  font-size: 15px;
  margin-bottom: 5px;
  display: block;
}
.sbox3 .sbox3-lang {
  width: 160px;
  font-size: 13px;
  display: block;
  margin-bottom: 5px;
  line-height: normal;
}

.sbox3 .sbox3-lang::before {
  content:"Lang:";
  display:inline;
  margin-right:3px;
}

.sbox3 a {
  display: block;
  margin-bottom: 2px;
  font-size: 11px;
}
.sbox3 a.contact-whatsapp::before {
  content: "";
  width: 21px;
  height: 21px;
  background: url(https://autocj.co.jp/images/whatsapp.png) no-repeat;
  background-size: cover;
  display: inline-block;
  vertical-align: middle;
  margin: -2px 3px 0 0;
}
.sbox3 a.contact-skype::before {
  content: "";
  width: 18px;
  height: 18px;
  background: url(https://autocj.co.jp/images/skype-logo_s.png) no-repeat;
  background-size: cover;
  display: inline-block;
  vertical-align: middle;
  margin: 0 4.5px 0 1.5px;
}
.sbox3 a.contact-viber::before {
  content: "";
  width: 19px;
  height: 19px;
  background: url(https://autocj.co.jp/images/viber_icon.png) no-repeat;
  background-size: cover;
  display: inline-block;
  vertical-align: middle;
  margin: 0 4.5px 0 1.5px;
}
#gmp_n {
  position: relative;
  overflow: hidden;
  padding-bottom: 50%;
  margin: 2% 2% 2% 2%;
}

#gmp_agent {
  position: relative;
  overflow: hidden;
  height:120px;
  margin-top:10px;
}

#gmp_n iframe, #gmap_agent iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

#local_info #localbox .localcontent .sbox2, #local_info #localbox .localcontent .faceblock {
  float:left;
  width:140px;
  height:210px;
  margin:15px 40px 0 0 !important;
}

#local_info #localbox .localcontent .sbox2 img, #local_info #localbox .localcontent .faceblock img.photof {
  width:140px;
  margin-left:0 !important;
}

#local_info #localbox .localcontent .sbox2 .sbox2-name, #local_info #localbox .localcontent .faceblock p {
  width:140px !important;
  font-size:15px;
  padding-top:10px !important;
  font-weight:inherit;
  margin-bottom:5px;
}
.btn {
  border-radius:.3rem;
  display:inline-block;
  padding:3px 15px;
  cursor:pointer;
}
.prem-btn {
  -webkit-box-shadow: inset 0 1px 0 #fff;
  box-shadow: inset 0 1px 0 #fff;
  background: -webkit-gradient(linear,left top, left bottom,color-stop(0, #FFC107),to(#FF9800));
  background: -o-linear-gradient(top,#FFC107 0,#FF9800 100%);
  background: linear-gradient(to bottom,#FFC107 0,#FF9800 100%);
  border: 1px solid #da8201;
}

#notification:empty { display:none !important;}
#notification > div + div { margin-left:10px;}

.announce_b, .announce_c {
  padding: 8px;
  background: #dcdcdc;
  border:2px solid #dcdcdc;
  text-align: center;
  -webkit-box-flex:1;
      -ms-flex:1 1 60%;
          flex:1 1 60%;
}

#newsupdates h2 {
  font-size: 1rem !important;
  font-weight: 700;
  padding: 4px 30px;
  background: #003e5f;
  color: #fff;
  display: inline-block;
  position:relative;
}

.announce_b h3, .announce_c h3 {
  font-size: 1rem !important;
  font-weight: 700;
  padding: 4px 30px;
  background: #ff0000;
  color: #fff;
  display: inline-block;
  position:relative;
}

.announce_b .txt_b, .announce_c .txt_b { font-weight: bold; margin: 10px 0 0;}

#newsupdates { -webkit-box-flex:1; -ms-flex:1 1 40%; flex:1 1 40%; border:2px solid #003e5f;}
#newsupdates ul li {
  line-height:1.5;
  font-size:.95rem;
  width:100%;
  border-bottom:1px dashed #ccc;
}

#newsupdates ul li a { text-decoration:underline; }
#newsupdates ul li a:hover { text-decoration:none; }
#newsupdates ul li span { margin-right:7px;}

.video-wrap {
  margin:2rem auto;
  max-width:640px;
  max-height:480px;
}
.video-wrap iframe {
  width:600px;
  height:338px;
  display:block;
  margin:auto;
}

.stock-container .vlistbox {
  position: relative;
  color: #000;
  font-size: 11.5px;
  font-weight: 600;
  background: #fff;
  border-radius: .5em;
  padding: 5px;
  text-align: center;
  margin-top: 10px;
  line-height: 17px;
  overflow:hidden;
  -webkit-box-flex:0;
      -ms-flex:none;
          flex:none;
  width:110px;
}

#bestsellers .vlistbox, #ontheway .vlistbox, #latest .vlistbox { width:130px; height:144px;}
#bestsellers .vlistbox img, #ontheway .vlistbox img, #latest .vlistbox img { width:100%; max-width:140px;}

#special .vlistbox { width:130px; height:166px;}
#special .vlistbox img { width:100%; max-width:140px;}

.stock-container .vlistbox:last-of-type { display:none; background:none; padding:0; border-radius:0; width: auto !important;}

.stock-container .seemore {
  width: 30px;
  background: #607d8b;
  display: block;
  font-size:2rem;
  font-weight: 700;
  text-align: center;
  color: #ffffff;
  border-radius:0;
  padding:0;
}

#bestsellers .stock-container .seemore, #ontheway .stock-container .seemore, #latest .stock-container .seemore {line-height:144px;}
#special .stock-container .seemore {line-height:166px;}
.search-more {text-align:right; margin-top:16px;}

.content .stock_container > div:last-of-type a {display:block;}

/*1290px以上*/
@media screen and (max-width:1426px) {
.stock-container .vlistbox:nth-of-type(8) { display:none;}
}

/*1021px以上*/
@media screen and (max-width:1289px) {
.stock-container .vlistbox:nth-of-type(7) { display:none;}
}
.pd1_n {
  color: #FFFFFF;
  background-color: rgba(255,0,0,0.8);
  font-size: 12px;
  font-weight: bold;
  width: 100px;
  font-style: italic;
  display: block;
  margin: 3px auto;
}

#deliver .media-img { float:left; width:360px;}
#deliver .media-img img { width:100%; max-width:360px;}

#deliver .media-body {
  float:right;
  width:calc(100% - 380px);
}

#deliver .del-media .media-body .deliver_area p { line-height:1.1; margin-bottom:.5rem; font-weight:700;}
#deliver .del-media .media-body .deliver_area span {
  padding: 4px 7px;
  display:inline-block;
  margin-right:5px;
  text-align:center;
}

#deliver .del-media .media-body .deliver_area span.bg-warning { width:50px;}

#deliver .d-detail .popup { width:320px;}
#deliver .d-detail .price_table { width:calc(100% - 330px); margin-left:10px;}

.popup img.thummap { width:100%; border:1px solid #000; cursor:pointer;}
.popup label[for=open] .popupbtn { border-radius:3px; display:inline-block; cursor:pointer;}
.popup label[for=open] .popupbtn:hover { opacity:.65;}
.popup input, .popup .popupwindow {display:none;}
.popup #open:checked ~ .popupwindow { display:block !important;}
.popup .popupwindow .popup-overlay { position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0, 0, 0, 0.5803921568627451); z-index:7000;}
.popup .popupwindow .popimg { position:fixed; -webkit-transform:translate(-50%, -50%); -ms-transform:translate(-50%, -50%); transform:translate(-50%, -50%); top:50%; left:50%; background:#fff; padding:10px;}
.popup .popupwindow .popimg span { position: absolute; right: 0; top: -33px; font-size: 30px; color: #fff; cursor: pointer;}
.popup .popupwindow .popimg img { width:100%; height:auto; max-width:700px; max-height:850px;}

.price_table table {
  font-size: .8rem;
  width: 100%;
  text-align: center;
  border: 1px solid #607d8b;
  background: #ffffff;
  line-height: 1.1rem;
  border-collapse: collapse !important;
  border-spacing: 0;
  margin:0;
  
}

.price_table table .tr-spn { display:none;}
.price_table table .th-spn { display:none;}

.price_table table td {
  vertical-align:middle;
  border: 1px solid #607d8b;
}

.price_table table tr {
  height:32px;
}

.price_table table th {
  font-weight:700;
  vertical-align:middle;
  border: 1px solid #607d8b;
  font-size:.8rem;
}

.price_table table .th_de {
  font-size: .8rem;
  font-weight: bold;
  color: #ffffff;
  background: #305496;
}

.price_table table .th_we {
  font-size: .8rem;
  font-weight: bold;
  color: #000000;
  background: #ffc000;
}

.price_table table .tb_de {
  background: #d9e1f2;
}

.price_table table .th_we_fig {
    color: #000000;
    background: #ffc000;
}

#agent .agentbox li { text-align:center; padding:9px; width:calc(50% - 10px); margin:10px 5px; border:2px solid #ccc;}
#agent .agentbox h4 { background:#ececec; padding:5px 0;}
#agent .agentbox h5 { font-style:italic; margin-bottom:3px;}

#howtobuy .htbbox img { float:left;}
#howtobuy .htbbox .media-body { float:right; width:calc(100% - 155px - 1.2rem); margin-left:1.2rem;}
#howtobuy .htb_arr { margin: 15px 0 15px 57px;}

#faq dl dt {
  width: 1.4rem;
  line-height: 1.4rem;
  color: #fff;
  text-align: center;
  margin-right: 10px;
  display:inline-block;
  vertical-align:top;
}

#faq .faq_q_squ { background:#ff0000;}
#faq .faq_a_squ { background:#008;}
#faq dl dd { display:inline-block; width:calc(100% - 1.4rem - 15px);}
#faq dl dd p { margin-bottom: 2rem; max-width: 90%;}
#faq dl a { color:#007bff;}
