@charset "UTF-8";
/* CSS Document */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { font-size: 62.5%; }

body { width: 100%; margin: 0; padding: 0; font-family: "Noto Sans JP"; background-color: aliceblue; }
body .contents { width: 100%; }

.header { width: 100%; }

.header_image { background: url("../images/hed.jpg") 0 0 no-repeat; padding-top: 43.26%; /*表示画像の高さ ÷ 表示画像の幅 × 100*/ background-size: cover; position: relative; }

@media screen and (max-width: 700px) { #page-top { display: none; position: fixed; bottom: 20px; right: 20px; font-size: 77%; opacity: 0.7; }
  #page-top a { background: #2f89fc; text-decoration: none; color: #fff; width: 100px; padding: 30px 0; text-align: center; display: block; border-radius: 5px; }
  #page-top a:hover { text-decoration: none; background: #becbff; }
  .header_top { display: none; }
  nav { width: 100%; background-color: #4a9ff5; border-top: 3px solid #033fff; text-align: center; position: fixed; bottom: 0; z-index: 10000; }
  nav ul { list-style-type: none; height: 100%; margin: 0 auto; width: 100%; }
  nav ul li { text-align: center; display: inline-block; width: auto; padding: 10px; }
  nav ul li a { text-decoration: none; line-height: 30px; font-size: 1.4rem; color: #fff; }
  .blank { margin: 50px 0; }
  .pan_list { text-align: left; }
  .pan_list li { display: inline-block; margin-left: 5px; padding-left: 5px; }
  .pan_list li:first-child { margin-left: 0; padding-left: 0; background: none; }
  .main { width: auto; margin-left: auto; margin-right: auto; font-size: 1.3rem; padding: 20px; background-color: #fff; }
  .main .banner1 { text-align: center; margin-top: 50px; }
  .main .banner1 img { max-width: 100%; height: auto; box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.4); }
  .main .banner1 a:hover { opacity: 0.5; }
  .main .banner2 { text-align: center; margin-top: 50px; }
  .main .banner2 img { max-width: 100%; height: auto; box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.4); }
  .main .banner2 a:hover { opacity: 0.5; }
  .main .banner { margin-top: 50px; text-align: center; }
  .main .banner img { max-width: 100%; height: auto; box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.4); }
  .main .banner a:hover { opacity: 0.5; }
  .main .contents { margin-top: 50px; line-height: 1.5; text-align: left; }
  .main .contents h2 { position: relative; text-align: center; padding-left: 10px; font-weight: bold; padding-bottom: 5px; font-family: "M PLUS 1p"; }
  .main .contents h2:before { content: ''; position: absolute; left: 50%; bottom: -7px; /*線の上下位置*/ display: inline-block; width: 105px; /*線の長さ*/ height: 5px; /*線の太さ*/ -webkit-transform: translateX(-50%); transform: translateX(-50%); /*位置調整*/ background-color: #4a9ff5; /*線の色*/ border-radius: 2px; /*線の丸み*/ margin-bottom: 10px; }
  .main .contents p { margin: 10px 0; }
  .main .contents .box1 .right { margin: 10px; }
  .main .contents .box1 h3 { display: inline-block; margin-top: 10px; margin-left: 10px; color: #4a9ff5; border-bottom: 2px solid #010059; }
  .main .contents .box1 p { margin: 10px; text-align: left; }
  .main .contents .box1 img { box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.4); }
  .main .contents .box2 .right { margin: 10px; }
  .main .contents .box2 h3 { display: inline-block; margin-top: 10px; margin-left: 10px; color: #4a9ff5; border-bottom: 2px solid #010059; }
  .main .contents .box2 p { margin: 10px; text-align: left; }
  .main .contents .box2 img { box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.4); }
  .main .merit_image img { display: block; margin: 0 auto; max-width: 100%; height: auto; }
  .main .slash { display: none; }
  .main h3 { text-align: left; color: #070d59; margin: 10px; }
  .main .text p { text-align: left; margin: 20px; }
  .main .text img { filter: drop-shadow(2px 2px 2px rgba(0, 0, 0, 0.4)); }
  .main .text_a p { text-align: left; margin: 20px; }
  .main .text_a p img { max-width: 100%; height: auto; box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.4); }
  .main .performance { width: auto; margin: 30px auto 0; border: 2px solid #000; padding: 30px 0; text-align: center; }
  .main .performance table { margin: 0 auto; }
  .main .performance table th { width: auto; padding-right: 20px; }
  .main .performance table td { width: auto; border-bottom: 1px solid #000; }
  .main .performance .performance_price .strong { margin: 0 auto; width: 100px; font-size: 2rem; border: 1px solid #000; padding: 10px 0; }
  .main .swiper-container { width: 100%; height: 700px; margin-top: 30px; }
  .main .swiper-container .swiper-wrapper { margin: 19px; text-align: center; }
  table.customer_voice_table { border-collapse: collapse; border: 1px solid #000; width: 295px; }
  table.customer_voice_table td { padding: 10px; border: 1px solid #000; }
  table.customer_voice_table td .heading_buy { background-color: #4a9ff5; color: #fff; width: 65px; margin: 0 auto; }
  table.customer_voice_table td .heading_sell { background-color: #EF5255; color: #fff; width: 65px; margin: 0 auto; }
  table.customer_voice_table .comment { text-align: left; height: 250px; }
  .border { display: flex; align-items: center; justify-content: column; height: auto; margin-bottom: 10px; padding: 0.5em 1em; background: #f4f4f4; border-left: solid 6px #00ade7; box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.33); }
  .border_q { display: flex; align-items: center; justify-content: column; height: auto; margin-bottom: 3px; padding: 0.5em 1em; background: #f4f4f4; border-left: solid 6px #5893d4; box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.33); }
  .border_a { display: flex; align-items: center; justify-content: column; height: auto; margin-bottom: 25px; padding: 0.5em 1em; background: #f4f4f4; border-left: solid 6px #e41749; box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.33); }
  .border_other { display: flex; align-items: center; justify-content: center; height: auto; margin-bottom: 10px; padding: 0.5em 1em; background: #f4f4f4; border-left: solid 6px #ED7780; box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.33); }
  .arrow { text-align: center; }
  .inner_border { border: 1px solid #49beb7; }
  .seal { border-bottom: 3px double red; color: red; }
  .note { margin: 30px 0; color: red; }
  .red { color: red; }
    form{ text-align: left;}
  /*------------------↓オークションで車を買う･売る↓---------------------*/
  /*------------------↑オークションで車を買う･売る↑---------------------*/
  /*------------------↓代行費↓---------------------*/
  .table_price { margin-bottom: 30px; }
  .table_price table { text-align: left; margin: 0 auto; border-collapse: collapse; width: auto; }
  .table_price table tr td { padding: 10px; border: 1px solid #becbff; display: block; width: 100%; }
  .table_price table tr .content { width: auto; background-color: #becbff; border-bottom: 1px solid #fff; }
  .table_price table tr .content_buy { width: auto; background-color: #ee7777; border-bottom: 1px solid #fff; }
  .responsive img { max-width: 100%; height: auto; }
  /*------------------↑代行費↑---------------------*/
  /*------------------↓会社概要↓---------------------*/
  .kaisha { width: 100%; }
  .kaisha th, .kaisha td { border: 1px solid #ccc; padding: 20px; }
  .kaisha th { font-weight: bold; background-color: #dedede; }
  footer { position: relative; width: 100%; background-color: #4a9ff5; color: #fff; margin-top: 30px; padding-top: 10px; overflow: hidden; z-index: 10001; }
  footer .footer { width: 100%; margin-left: auto; margin-right: auto; margin-top: 20px; font-size: 1.2rem; }
  footer .footer .logo { width: 50%; text-align: center; }
  footer .footer .logo img { max-width: 100%; height: auto; }
  footer .footer .catchcopy { width: 50%; float: left; margin-bottom: 20px; padding-left: 10px; }
  footer .footer .catchcopy p a { color: #fff; }
  footer .footer .catchcopy p a:hover { color: #00368e; }
  footer .footer .link { width: 50%; float: right; }
  footer .footer .link ul { list-style-type: none; }
  footer .footer .link ul li a { color: #fff; }
  footer .footer .link ul li a:hover { color: #00368e; }
  .copyright { width: 100%; text-align: center; overflow: hidden; margin-top: 50px; padding: 10px 0; background-color: #033fff; }
  .small { width: 100px; } }
@media screen and (min-width: 700px) { #page-top { position: fixed; bottom: 20px; right: 20px; font-size: 77%; opacity: 0.7; }
  #page-top a { background: #2f89fc; text-decoration: none; color: #fff; width: 100px; padding: 30px 0; text-align: center; display: block; border-radius: 5px; }
  #page-top a:hover { text-decoration: none; background: #becbff; }
  .header_top { width: 100%; position: absolute; top: 0; left: 0; margin: 10px; font-size: 2rem; color: #fff; text-shadow: 1px 1px 0 #000, -1px -1px 0 #000, -1px 1px 0 #000, 1px -1px 0 #000, 0px 1px 0 #000, -1px 0 #000, -1px 0 0 #000, 1px 0 0 #000; }
  /*-----------------------nav------------------------*/
  nav { width: 100%; background-color: #4a9ff5; border-top: 3px solid #033fff; text-align: center; }
  nav ul { list-style-type: none; height: 100%; margin: 0 auto; width: 1000px; }
  nav ul li { text-align: center; display: inline-block; width: 17%; }
  nav ul li a { text-decoration: none; line-height: 60px; font-size: 1.5rem; font-weight: bold; letter-spacing: 2px; color: #fff; position: relative; }
  nav ul li a::after { content: ""; display: block; position: absolute; bottom: -3px; left: 50%; width: 0; height: 3px; background-color: #2063d2; transition: 0.3s; border-radius: 3px; }
  nav ul li a:hover::after { width: 100%; left: 0; }
  nav ul .item6 { display: none; }
  nav ul br { display: none; }
  /*-----------------------main-----------------------*/
  .blank { margin: 50px 0; }
  .pan_list { text-align: left; }
  .pan_list li { display: inline-block; margin-left: 5px; padding-left: 5px; }
  .pan_list li:first-child { margin-left: 0; padding-left: 0; background: none; }
  .main { width: 1000px; margin-left: auto; margin-right: auto; font-size: 1.5rem; padding: 50px; background-color: #fff; }
  .main .banner1 { display: inline-block; margin-top: 50px; margin-right: 20px; }
  .main .banner1 a:hover { opacity: 0.5; }
  .main .banner1 img { box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.4); }
  .main .banner2 { display: inline-block; margin-top: 50px; margin-left: 20px; }
  .main .banner2 a:hover { opacity: 0.5; }
  .main .banner2 img { box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.4); }
  .main .contents { margin-top: 50px; line-height: 1.7; text-align: left; }
  .main .contents h2 { position: relative; text-align: center; padding-left: 10px; font-weight: bold; padding-bottom: 5px; font-family: "M PLUS 1p"; }
  .main .contents h2:before { content: ''; position: absolute; left: 50%; bottom: -7px; /*線の上下位置*/ display: inline-block; width: 105px; /*線の長さ*/ height: 5px; /*線の太さ*/ -webkit-transform: translateX(-50%); transform: translateX(-50%); /*位置調整*/ background-color: #4a9ff5; /*線の色*/ border-radius: 2px; /*線の丸み*/ margin-bottom: 10px; }
  .main .contents p { margin: 10px auto; text-align: left; }
  .main .contents .box1 { overflow: hidden; width: 700px; position: relative; background-color: #f4f4f4; }
  .main .contents .box1 .right { float: right; margin-right: 10px; margin-left: 10px; position: absolute; right: 0; top: 50%; transform: translateY(-50%); }
  .main .contents .box1 h3 { display: inline-block; margin-top: 10px; margin-left: 10px; color: #4a9ff5; border-bottom: 2px solid #010059; }
  .main .contents .box1 p { overflow: auto; margin: 10px; text-align: left; width: 370px; }
  .main .contents .box1 img { box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.4); }
  .main .contents .box2 { overflow: hidden; width: 700px; margin: 0 0 0 auto; position: relative; background-color: #f4f4f4; }
  .main .contents .box2 .right { float: right; margin-right: 10px; margin-left: 10px; position: absolute; right: 0; top: 50%; transform: translateY(-50%); }
  .main .contents .box2 h3 { display: inline-block; margin-top: 10px; margin-left: 10px; color: #4a9ff5; border-bottom: 2px solid #010059; }
  .main .contents .box2 p { overflow: auto; margin: 10px; text-align: left; width: 370px; }
  .main .contents .box2 img { box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.4); }
  .main .merit_image img { display: block; margin: 0 auto; }
  .main .slash { z-index: -10000; }
  .main .slash img { display: block; margin: 0 auto; }
  .main h3 { text-align: center; color: #070d59; margin: 10px; }
  .main .text { display: flex; align-items: center; justify-content: center; }
  .main .text p { text-align: left; margin: 20px; }
  .main .text img { filter: drop-shadow(2px 2px 2px rgba(0, 0, 0, 0.4)); }
  .main .text_a { display: flex; align-items: center; justify-content: center; box-shadow: 0px 9px 3px -3px rgba(0, 0, 0, 0.4); -webkit-box-shadow: 0px 9px 3px -3px rgba(0, 0, 0, 0.4); -moz-box-shadow: 0px 9px 3px -3px rgba(0, 0, 0, 0.4); }
  .main .text_a p { text-align: left; margin: 20px; }
  .main .performance { display: flex; align-items: center; justify-content: center; margin-top: 30px; border: 2px solid #000; padding: 30px 0; }
  .main .performance table { margin: 0 20px; }
  .main .performance table th { width: auto; padding-right: 20px; text-align: right; }
  .main .performance table td { width: 200px; border-bottom: 1px solid #000; }
  .main .performance .performance_price { text-align: center; }
  .main .performance .performance_price .strong { margin: 0 auto; font-size: 2rem; padding: 10px 0; }
  .main .swiper-container { width: 100%; height: 800px; margin-top: 30px; }
  .main .swiper-container .swiper-wrapper { margin: 19px; text-align: center; }
  table.customer_voice_table { border-collapse: collapse; border: 1px solid #000; width: 250px; }
  table.customer_voice_table td { padding: 10px; border: 1px solid #000; }
  table.customer_voice_table td .heading_buy { background-color: #4a9ff5; color: #fff; width: 65px; margin: 0 auto; }
  table.customer_voice_table td .heading_sell { background-color: #EF5255; color: #fff; width: 65px; margin: 0 auto; }
  table.customer_voice_table .comment { text-align: left; height: 250px; }
  .border { display: flex; align-items: center; justify-content: column; height: auto; margin-bottom: 10px; padding: 0.5em 1em; background: #f4f4f4; border-left: solid 6px #00ade7; box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.33); }
  .border_q { display: flex; align-items: center; justify-content: column; height: auto; margin-bottom: 3px; padding: 0.5em 1em; background: #f4f4f4; border-left: solid 6px #5893d4; box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.33); }
  .border_a { display: flex; align-items: center; justify-content: column; height: auto; margin-bottom: 25px; padding: 0.5em 1em; background: #f4f4f4; border-left: solid 6px #e41749; box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.33); }
  .border_other { display: flex; align-items: center; justify-content: center; height: auto; margin-bottom: 10px; padding: 0.5em 1em; background: #f4f4f4; border-left: solid 6px #ED7780; box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.33); }
  .arrow { text-align: center; }
  .arrow img { filter: drop-shadow(2px 2px 2px rgba(0, 0, 0, 0.4)); }
  .banner { margin-top: 50px; text-align: center; }
  .banner a:hover { opacity: 0.5; }
  .banner img { box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.4); }
  .inner_border { border: 1px solid #49beb7; }
  .seal { border-bottom: 3px double red; color: red; }
  .note { margin: 30px 0; color: red; }
  .red { color: red; }
  /*------------------↓オークションで車を買う･売る↓---------------------*/
  /*------------------↑オークションで車を買う･売る↑---------------------*/
  /*------------------↓代行費↓---------------------*/
  .table_price { margin-top: 30px; margin-bottom: 30px; }
  .table_price table { text-align: left; margin: 0 auto; border-collapse: collapse; width: 900px; }
  .table_price table tr td { padding: 10px; height: 30px; border: 1px solid #becbff; }
  .table_price table tr .content { width: 200px; background-color: #becbff; border-bottom: 1px solid #fff; }
  .table_price table tr .content_buy { width: 200px; background-color: #ee7777; border-bottom: 1px solid #fff; }
  /*------------------↑代行費↑---------------------*/
  /*------------------↓代行費↓---------------------*/
  .kaisha { width: 100%; }
  .kaisha th, .kaisha td { border: 1px solid #ccc; padding: 20px; }
  .kaisha th { font-weight: bold; background-color: #dedede; } }
@media screen and (min-width: 700px) and (max-width: 767px) { .kaisha, .kaisha tr, .kaisha td, .kaisha th { display: block; }
  .kaisha th { width: auto; } }
@media screen and (min-width: 700px) { /*------------------↑代行費↑---------------------*/
  /*----------------------footer----------------------*/
  footer { position: relative; width: 100%; background-color: #4a9ff5; color: #fff; margin-top: 30px; padding-top: 10px; overflow: hidden; }
  footer .footer { width: 1000px; margin-left: auto; margin-right: auto; margin-top: 20px; font-size: 1.2rem; }
  footer .footer .logo { width: 30%; float: left; }
  footer .footer .catchcopy { width: 30%; float: left; margin-bottom: 20px; }
  footer .footer .catchcopy p a { color: #fff; }
  footer .footer .catchcopy p a:hover { color: #00368e; }
  footer .footer .link { width: 30%; float: right; }
  footer .footer .link ul { list-style-type: none; }
  footer .footer .link ul li a { color: #fff; }
  footer .footer .link ul li a:hover { color: #00368e; }
  footer .copyright { width: 100%; text-align: center; overflow: hidden; margin-top: 50px; padding: 10px 0; background-color: #033fff; } }
form {text-align: left;}
@media screen and (min-width: 700px) and (max-width:330px) { .header_top { width: 100%; position: absolute; top: 0; left: 0; margin: 10px; font-size: 1.5rem; color: #fff; text-shadow: 1px 1px 0 #000, -1px -1px 0 #000, -1px 1px 0 #000, 1px -1px 0 #000, 0px 1px 0 #000, -1px 0 #000, -1px 0 0 #000, 1px 0 0 #000; } }
