10px 10px 10px 50px10px 10px 10px 50pxpadding: 10px 10px 10px 50px;padding: 10px 10px 10px 50px;@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700;900&family=Noto+Serif+JP:wght@400;700;900&display=swap');
.icon17 { font-size: 17px; float: right; margin: 18px 16px 0 0; }
.icon14 { font-size: 17px; float: right; margin: 13px 9px 0 0; }
.icon12 { font-size: 10px; }

/*paddingとborderがwidthとheightの中に含まれるようになる*/
*, *:before, *:after { -webkit-box-sizing: border-box; box-sizing: border-box; }

.pc { display: block; }
.sp { display: none; }
.sp-inline { display: none; }

a { text-decoration: underline; color: #00368f; }
a:hover { text-decoration: none; color: #00368f; }
a:visited { color: #00368f; }

/* FADE定義 */
.fade { opacity: 0; }
.fadeRight { animation-name: fadeRightAnime; animation-duration: 0.8s; animation-fill-mode:forwards; opacity: 0; }
@keyframes fadeRightAnime{ from { opacity: 0; transform: translateY(75px); } to { opacity: 1; transform: translateY(0); } }

/* ベース定義 */

.fa-angles-right:after {
  content:"\f101";
  font-family:FontAwesome;
  pointer-events:none
}

.fa-caret-right { margin-left: 35px; margin-right: -35px; }
.fa-caret-right:before {
  content:" ";
  font-family:FontAwesome;
  pointer-events:none
}

.fa-circle-chevron-right { margin-right: 15px; }
.fa-circle-chevron-right:after {
  content:"\f138";
  font-family:FontAwesome;
  pointer-events:none
}

html { scroll-behavior: smooth; }

body { font-size: 65%; line-height: 180%; color: #333333; background-color: #ffffff; font-family: 'Noto Sans JP', sans-serif; font-weight: 400; margin: 0; padding: 0; overflow-x: hidden; }

.image-center { display: block; margin: 0 auto; }

.image-navi { display: block; margin: 0 60px 0 0; width: calc(50% - 60px); float: left; }

img { max-width: 100%; height: auto; }

.content5 { display: block; width: 100%; max-width: 1230px; margin: 60px auto 60px; padding: 0 20px; }
.content4 { display: block; width: 100%; max-width: 1230px; margin: 0 auto 60px; padding: 0 20px; }
.content2 { width: 95%; margin: 0 auto; }
.content3 { width: 85%; margin: 0 auto; }

.title { width: 100%; background-color: #000; display: inline-block; padding: 10px 15px 10px 15px; margin-bottom: 30px; margin-top: 10px; position: relative; color: #fff; font-weight: bold; letter-spacing: 1px; font-size: 140%; text-align: center; }
.title::after { content: ""; position: absolute; bottom: 0; right: 0; width: 12px; height: 12px; border: 6px solid rgba(0, 0, 0, 0); border-right-color: #fff; /* 背景色 */ border-bottom-color: #fff; /* 背景色 */ box-sizing: border-box; }

.main-01 img,.main-02 img,.main-03 img { position: absolute; right: 20px; top: 47px; }
.main-01 { text-align: left; padding: 40px 42px; margin-bottom: 0; font-size: 200%; background: url("../img/index-title-01.jpg")left top; }
.main-02 { text-align: left; padding: 40px 42px; margin-bottom: 0; font-size: 200%; background: url("../img/index-title-02.jpg")left top; }
.main-03 { text-align: left; padding: 40px 42px; margin-bottom: 0; font-size: 200%; background: url("../img/index-title-03.jpg")left top; }
.main-black img  { position: absolute; right: 20px; top: 27px; }
.main-black { text-align: left; padding: 20px 42px; margin-bottom: 0; font-size: 140%; }

p.text-title { margin: 0 0 20px 0; text-align: left; font-weight: bold; font-size: 200%; letter-spacing: 1px; position: relative; display: inline-block; padding: 0 18px; color: #000; display: block; }
p.text-title {
	position: relative;
	padding-top: 30px;
	font-size: 26px;
	border-bottom: 1px solid rgba(5,62,98,1);
}

p.text-title span {
	position: relative;
	z-index: 2;
}

p.text-title::before {
	content: attr(data-en);
	position: absolute;
	top: 0px;
	left: 0;
	color: rgba(5,62,98,0.2);
	font-size: 200%;
	text-transform: uppercase;
	z-index: 1;
}

p.text-title-left { display: block; margin: 0 0 20px 0; padding: 0; text-align: left; font-weight: bold; font-size: 125%; letter-spacing: 1px; }
p.text-read { display: block; margin: 0 0 20px 0; padding: 0; text-align: left; font-weight: bold; font-size: 125%; letter-spacing: 1px; }

div.box2 { position: relative; }
div.box2 ul { display: block; overflow: hidden; padding-left: 0; }
div.box2 ul li { width: 100%; list-style:none; clear: both; padding-top: 40px; border-top: 1px solid #eee; margin-bottom: 40px; }

div.box25 { position: relative; }
div.box25 ul { display: flex; justify-content: space-between; overflow: hidden; padding-left: 0; }
div.box25 ul li { width: 100%; list-style:none; padding-left: 20px; }
div.box25 ul li:first-child { padding-right: 20px; padding-left: 0; }
div.box25 ul li.read { font-size: 120%; font-weight: bold; }
div.box25 ul li.read p { font-size: 85%; font-weight: normal; }

.button { margin: 0 auto; text-align: center; width: 300px; color: #ffffff; border-radius: 32px; display: block; text-decoration: none; font-size: 110%; z-index: 0; position: relative; line-height:50px; white-space: nowrap; padding-left: 22px; }
.button:before{ border-radius: 32px; content:""; width:100%; height:100%; position:absolute; z-index:-1; left:0; transition:0.5s; background:-webkit-linear-gradient(0deg, #142276, #009ee4); }
.button:after{ border-radius: 32px; content:""; width:100%; height:100%; position:absolute; z-index:-2; left:0; background:-webkit-linear-gradient(0deg, #009ee4, #142276); }
.button:hover:before{ opacity:0; }
a.button:hover { color: #fff; }
a.button:visited { color: #fff; }

.button-none { margin: 0 auto; text-align: center; width: 300px; color: #ffffff; border-radius: 32px; display: block; text-decoration: none; font-size: 110%; z-index: 0; position: relative; line-height:50px; white-space: nowrap; padding-left: 22px; }
.button-none:before{ border-radius: 32px; content:""; width:100%; height:100%; position:absolute; z-index:-1; left:0; transition:0.5s; background:-webkit-linear-gradient(0deg, #333333, #333333); }
.button-none:after{ border-radius: 32px; content:""; width:100%; height:100%; position:absolute; z-index:-2; left:0; background:-webkit-linear-gradient(0deg, #333333, #eeeeee); }
.button-none:hover:before{ opacity:0; }
a.button-none:hover { color: #fff; }
a.button-none:visited { color: #fff; }

img.radius { border-radius: 10px; }

header2 { width: 100%; overflow: hidden; }

/*#navigation { position: relative; z-index: 7; max-width: 1280px; margin: 0 auto; overflow: hidden; padding: 0 30px; }*/
#navigation { position: relative; z-index: 7; margin: 0 auto; overflow: hidden; padding: 0 0 0 30px; }
#navigation div.read { padding: 20px 0 0 0; font-weight: 700; font-size: 14px; }
.main-title { display: inline-block; }
.main-title img { padding: 10px 0 0 0; }
#navigation ul { display: block; /*width: calc(100% - 358px);*/ float: right; overflow: hidden; margin-top: -40px; }
#navigation ul li { margin: 70px 0 0 0; text-align: center; /*width: calc(14% + 10px);*/ float: right; list-style: none; font-size: 14px;  margin-right: 40px; }
#navigation ul li img { width: 100%; max-width: 296px; }
#navigation ul li a { color: #000; font-weight: 500; transition: 0.3s; }
#navigation ul li a:hover { opacity: 0.6; transition: 0.3s; text-decoration: none; }
#navigation ul li.common-home { margin: 0; width: 111px; }
#navigation ul li.common-home img { width: 111px; }

div.navigation-main-image { background: url("../img/common-background.jpg")no-repeat top center; background-size: cover; height: 420px; margin-bottom: 100px; position: relative; }
div.navigation-main-image p { width: 47%;
  display: block;
  margin: 0;
  text-shadow: 0 0 10px #fff;
  color: #000;
  font-size: 1.5vw;
  padding: 76px 0 0 76px;
  line-height: 150%;
  font-weight: 700; }
div.navigation-main-image img { position: absolute;
  right: 30px;
  top: 77px;
  width: 50%;
  max-width: 628px; }
  
div.navigation-main-image2 { background: url("../img/common-background.jpg")no-repeat top center; background-size: cover; height: 180px; margin-bottom: 100px; position: relative; }
div.navigation-main-image2 p { width: 100%; max-width: 1280px; display: block; margin: 0 auto; text-shadow: 0 0 10px #fff;
  color: #000;
  font-size: 150%;
  padding: 52px 0 0 56px; font-weight: 700; }
div.navigation-main-image2 img { position: absolute;
  right: 30px;
  top: 50px;
  width: 338px; }

div.navigation-main-image p span { display: block;
  font-size: 2.1vw;
  line-height: 150%;
  margin-bottom: 20px; margin-left: -20px; }

#navigation-second { position: relative; z-index: 7; max-width: 1280px; margin: 0 auto 25px; border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; background: url("../img/index-background.jpg"); background-size: cover; overflow: hidden; }
#navigation-second div.main-title img { padding: 36px 0 0 70px; max-width: 700px; width: 100%; }
#navigation-second div.main-title { float: left; width: 68%;  max-width: 700px }
#navigation-second ul { display: block; float: right; padding: 25px 50px 0; overflow: hidden; width: 30%; }
#navigation-second ul li { margin: 20px 0 20px 0; text-align: center; width: 100%; list-style: none; }
#navigation-second ul li img { width: 100%; max-width: 296px; }
#navigation-second ul li a:hover { opacity: 0.6; }

#g-nav-list ul li { display: inline-block; letter-spacing: 2px; font-size: 85%; margin-top: 5px; margin-right: 35px; vertical-align: top; text-align: left; }
#g-nav-list ul li span { display: block; letter-spacing: 0px; font-size: 75%; }
#g-nav-list ul li a { color: #142276; text-decoration: none; }
#g-nav-list ul li a:hover { text-decoration: underline; }
#g-nav-list ul li.navi-button { margin-top: 10px; margin-right: 10px; }
#g-nav-list ul li.navi-button:last-child { margin-right: 50px; }
#g-nav-list ul li.navi-button img { vertical-align: sub; margin-right: 5px; }
#g-nav-list ul li.navi-button a { display: block; border: solid 1px #142276; border-radius: 17px; padding: 7px 16px 7px 19px; letter-spacing: 0; transition: 0.5s; }
#g-nav-list ul li.navi-button a:hover { text-decoration: none; background-color: #d5f4ff; border: solid 1px #9ed1e4; }
#g-nav-list ul li.list { clear: both; width: 100%; padding: 20px 0 20px 0; }
#g-nav-list ul li.list div { float: left; line-height: 180%; }
#g-nav-list ul li.list div:last-child { padding-left: 30px; }
#g-nav-list ul li.list div a { display:block; }

#page_top{ position: fixed; right: 0; bottom: -150px; opacity: 1; z-index: 999; }
#page_top a{ position: relative; display: block; }
#page_top a::before{ bottom: 0; right: 0; left: 0; margin: auto; text-align: center; opacity: 0.6; }

a.cp_btn {
  margin: 30px auto 0;
  display: block;
  max-width: 600px;
  width: 100%;
  padding: 0.8em;
  text-align: center;
  text-decoration: none;
  color: #9a3e8b;
  border: 2px solid #9a3e8b;
  border-radius: 30px;
  transition: .4s;
  line-height: 200%;
  font-size: 120%;
  font-weight: bold;
}

a.cp_btn:hover {
  background: #9a3e8b;
  color: #fff;
  text-decoration: none;
}

.cp_btn_right {
  float: right;
  padding-top: 8px;
  color: #9a3e8b;
}

a.cp_btn2 {
  margin: 30px auto 0;
  display: block;
  max-width: 400px;
  width: 100%;
  padding: 0.4em;
  text-align: center;
  text-decoration: none;
  color: #fff;
  border: 2px solid #ff66cc;
  border-radius: 30px;
  transition: .4s;
  line-height: 200%;
  font-size: 120%;
  font-weight: bold;
  background: #ff66cc;
}

a.cp_btn2:hover {
  background: #fff;
  color: #ff66cc;
}

.cp_btn_right2 {
  float: right;
  padding-top: 8px;
  color: #fff;
}

.cp_btn_right2:hover {
  color: #ff66cc;
}

a.cp_btn3 {
  margin: 20px auto;
  display: block;
  max-width: 800px;
  width: 100%;
  padding: 0.8em;
  text-align: center;
  text-decoration: none;
  color: #333;
  border: 2px solid #cccccc;
  border-radius: 30px;
  transition: .4s;
  line-height: 200%;
  font-size: 120%;
  font-weight: normal;
  background: #cccccc;
}

a.cp_btn3:hover {
  background: #fff;
  color: #333;
}

.cp_btn_right3 {
  float: right;
  padding-top: 8px;
  color: #333;
}

a.cp_btn4 {
  margin: 20px auto;
  display: block;
  max-width: 800px;
  width: 100%;
  padding: 0.8em;
  text-align: center;
  text-decoration: none;
  color: #fff;
  border: 2px solid #00368f;
  border-radius: 30px;
  transition: .4s;
  line-height: 200%;
  font-size: 120%;
  font-weight: normal;
  background: #00368f;
}

a.cp_btn4:hover {
  background: #fff;
  color: #00368f;text-decoration: none;
}

.cp_btn_right4 {
  float: right;
  padding-top: 10px;
  color: #fff;
}

.cp_btn_right4:hover {
  color: #00368f;
}

.menu2 {position: fixed; font-size: 60%; font-weight: 700; color: #2c9eb0; z-index: 9; top: 93px; right: -1px; cursor: pointer; width: 50px; height: 50px;}
/*ボタン外側※レイアウトによってpositionや形状は適宜変更してください*/
.openbtn{ /*ボタン内側の基点となるためrelativeを指定。追従するナビゲーションの場合はfixed＋top、rightといった位置をセットで指定*/
position: relative; width: 50px; height:50px; cursor: pointer; }
/*ボタン内側*/
.openbtn span{ display: inline-block; transition: all .4s; position: absolute; right: 13px; height: 2px; background-color: #2c9eb0; }
.openbtn span:nth-of-type(1) { top:22px; width: 50%; }
.openbtn span:nth-of-type(2) { top:29px; width: 30%; }
/*activeクラスが付与されると線が回転して×に*/
.openbtn.active span:nth-of-type(1) { top: 20px; left: 16px; transform: translateY(6px) rotate(-45deg); width: 35%; }
.openbtn.active span:nth-of-type(2) { top: 32px; left: 16px; transform: translateY(-6px) rotate(45deg); width: 35%; }
/*========= ナビゲーションのためのCSS ===============*/
#g-nav{ position:fixed; z-index: -1; opacity: 0; top:0; left: 0; width: 100%; height: 100vh; background:#152f46; transition: all 0.3s; }
/*アクティブクラスがついたら透過なしにして最前面へ*/
#g-nav.panelactive{ opacity: 1; z-index:8; }
/*ナビゲーションの縦スクロール*/
#g-nav.panelactive #g-nav-list{
/*ナビの数が増えた場合縦スクロール*/
position: fixed; z-index: 8; width: 100%; height: 100vh; overflow: auto; -webkit-overflow-scrolling: touch; }
/*ナビゲーション*/
#g-nav ul { display: none; position: absolute; z-index: 999; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 100%; max-width: 500px; padding: 20px; }
#g-nav.panelactive ul { display: block; }
/*リストのレイアウト設定*/
#g-nav li { list-style: none; text-align: center; }
#g-nav li a { color: #333; text-decoration: none; padding: 10px; display: block; letter-spacing: 0.1em; font-weight: bold; }
/*========= ボタンのためのCSS ===============*/
.openbtn{ position: fixed; z-index: 9; top: 55px; right: 10px; cursor: pointer; width: 50px; height:50px; }
	
/*個別設定*/

.caution01 { border-radius: 10px; background: #ececec; padding: 20px; font-size: 100%; margin-bottom: 20px; }

div.box2 ul {  }
div.box2 ul.index-navi-box { text-align: center; }
div.box2 ul.index-navi-box li { /*border: 1px solid #000;*/ margin: 10px 10px 4px 10px; padding: 20px; border: none; display: inline-block; width: 33%; }
.pc-inline { display: inline; }
div.box2 ul.index-navi-box li a { display: block; text-decoration: none; color: #333; }
div.box2 ul.index-navi-box li a:hover { text-decoration: underline; }
div.box2 ul.index-navi-box li.pc { border: none; }

div.box2 ul.systemup-box { text-align: center; }
div.box2 ul.systemup-box li { border-radius: 20px; border: 1px solid #999; margin: 60px 10px 4px 10px; padding: 20px; }

div.navigation-header { background: none; padding: 20px 0 20px; width: 100%; height: auto; z-index: 10; max-width: 1200px; }
div.navigation-header img { display: block; margin: 0 auto; }

#navigationplus p.text-title { display: block; }
.navigation-box ul li { text-align: left; display: block; padding: 0; overflow: hidden; }
.navigation-box { margin-top: 60px; font-weight: bold; }
.navigation-box ul li span { display: block; width: 100%; text-align: left; margin-bottom: 10px; }
.navigation-box ul li p { font-size: 200%; display: block; margin-bottom: 0; color: #000; font-weight: 700; margin-top: 20px; }
.navigation-box ul li span.brand {  }
.navigation-box ul li span.spec { text-align: left; font-weight: normal; }
.navigation-box ul li span.normal { font-weight: normal; display: inline-block; width: auto; margin-right: 10px; }
.navigation-box ul li span.price { font-weight: bold; display: inline-block; width: auto; font-size: 200%; color: #333; margin-bottom: 0; margin-top: 0; }

.spec-icon { display: block; color: #ff0000; font-size: 85%; }
.spec-icon img { display: block; margin: 60px 0 20px; }

.navigation-category-01 { margin: 60px 0 0; padding: 25px 40px; font-weight: bold; font-size: 140%; color: #fff; background: #397fb5; letter-spacing: 1px; }
div.bevel-01 { border: 1px solid #397fb5; color: #397fb5; width: 100%; padding: 10px; position: relative; text-align: center; font-weight: bold; font-size: 130%; margin-top: 60px; }
div.bevel-01 img { position: absolute; right: -1px; bottom: -1px; z-index: 2; }
p.navigation-read { font-size: 110%; margin: 20px 0; }
div.navigation-sec { border-left: 4px solid #397fb5; color: #397fb5; padding: 0 0 0 20px; font-weight: bold; margin: 20px 0; }
div.navigation-sec2 { max-width: 645px; margin: 20px auto; }

.navigation-category-02 { margin: 60px 0 0; padding: 25px 40px; font-weight: bold; font-size: 140%; color: #fff; background: #ff66cc; letter-spacing: 1px; }
div.bevel-02 { border: 1px solid #ff66cc; color: #ff66cc; width: 100%; padding: 10px; position: relative; text-align: center; font-weight: bold; font-size: 130%; margin-top: 60px; }
div.bevel-02 img { position: absolute; right: -1px; bottom: -1px; z-index: 2; }

div.bevel-03 { border: 1px solid #999; color: #999; width: 100%; padding: 10px; position: relative; text-align: center; font-weight: bold; font-size: 130%; margin-top: 60px; }
div.bevel-03 img { position: absolute; right: -1px; bottom: -1px; z-index: 2; }

.caution02 { background: #ffd9f2; padding: 10px 20px 10px 10px; font-size: 100%; margin-bottom: 20px; margin-top: 30px; }
.caution02 ul {  }
div.content2 .caution02 ul li { list-style:none; text-indent: -1em; padding-left: 1em; padding-top: 0; border-top: none; margin: 0; }
.caution02 ul li:before { content:"※" }

.caution03 { background: #fff; padding: 10px 20px 10px 10px; font-size: 100%; margin-bottom: 20px; margin-top: 60px; }
.caution03 ul {  }
.caution03 ul li { list-style:none; text-indent: -1em; padding-left: 1em; }
.caution03 ul li:before { content:"●" }

.entry-text { display: block; max-width: 546px; margin: 0 auto; }

.caution04 { display: inline-block; border-radius: 10px; border: 1px solid #ff0000; padding: 0 20px; }

.navigation-box ul li span.entry-box1 { display: inline-block; font-weight: normal; color: #fff; background: #003a8d; padding: 4px 4px 4px 10px; width: 50%; }
.navigation-box ul li span.entry-box2 { display: inline-block; font-weight: normal; color: #fff; background: #ff66cc; margin-top: 10px; padding: 4px 4px 4px 10px; width: 50%; }

.caution05 { font-weight: bold; color: #ff0000; display: block; margin: 40px 0 -20px 0; font-size: 13px; }

.drive-title { display: inline; border-radius: 10px; background: rgba(256,256,256,0.6); color: #6c6c6c; margin-left: 10px; font-size: 75%; font-weight: bold; padding: 4px 10px; letter-spacing: 0; }
div.price-box span.normal { font-weight: normal; display: inline-block; width: auto; margin-right: 10px; }
div.price-box span.price { font-weight: bold; display: inline-block; width: auto; font-size: 240%; margin: auto; color: #333; }

/*li.drive-box1 { max-width: 470px; }*/
li.drive-box1 img { max-width: 517px; }
div.drive-title1 { border-left: 8px solid #203d8a; padding: 4px 24px; font-weight: bold; color: #203d8a; margin-top: 28px; }
div.drive-title1 span { color: #333; margin-left: 20px; font-weight: normal; font-size: 85%; }
div.drive-title2 { background: #203d8a; color: #fff; text-align: center; font-weight: normal; font-size: 85%; margin: 14px 0; }
div.drive-text1 { font-size: 85%; padding-left: 16px; margin-top: 20px; }
div.drive-text3 { font-size: 110%; padding-left: 16px; margin-top: 0; margin-bottom: 20px; color: #727171; font-weight: 700; }
div.drive-title3 { margin-top: 0; display: block; padding: 0 20px; }
div.drive-text2 { font-size: 85%; padding-left: 16px; margin-top: 0px; margin-bottom: 10px; }

.caution06 { background: #fff; padding: 10px 20px 10px 10px; font-size: 120%; margin-bottom: 20px; margin-top: 30px; color: #ff0000; border: 1px solid #ff0000; }
.caution06 ul {  }
.caution06 ul li { list-style:none; text-indent: -1em; padding: 5px 10px 5px 40px; }
.caution06 ul li:before { content:"※" }

.caution07 { background: #fff; padding: 10px; font-size: 120%; }
.caution07 ul {  }
.caution07 ul li { list-style:none; text-indent: -1em; padding-left: 1em; }
.caution07 ul li:before { content:"※" }
.caution07 ul li.evitara-li { color: #215994; }
.caution07 ul li.evitara-li span { color: #000; }

.caution08 { background: #fff; padding: 10px 20px 10px 10px; font-size: 100%; margin-bottom: 20px; }
.caution08 ul {  }
.caution08 ul li { list-style:none; text-indent: -1em; padding-left: 1em; }
.caution08 ul li:before { content:"●" }

p.text-title2 { display: block; margin: 0 0 38px 0; padding: 0; text-align: center; font-weight: bold; font-size: 125%; letter-spacing: 1px; }

.etc-top-box { width: 100%; margin-bottom: 60px; }
#tbl-bdr table,#tbl-bdr td,#tbl-bdr th {
    border-collapse: collapse;
    border:1px solid #ccc;
    }
#tbl-bdr td { padding: 37px; width: 50%; vertical-align: top; }

div.etc-title1 { border-left: 8px solid #00508f; padding: 4px 16px; font-weight: bold; color: #00508f; font-size: 110%; }
div.etc-text1 { font-size: 100%; padding-left: 16px; margin-top: 20px; margin-bottom: 20px; }

div.etc-title2 { border-bottom: 1px solid #ccc; font-weight: bold; font-size: 130%; padding-bottom: 15px; padding-left: 40px; }
div.etc-title3 { border-left: 4px solid #333; background: #d6d6d6; font-weight: bold; font-size: 120%; padding: 10px 10px 10px 20px; margin-bottom: 30px; margin-top: 50px; }

.etc-box { text-align: center;
  color: #f6c;
  font-weight: normal;
  font-size: 110%;
  background: #fff;
  border-radius: 30px;
  box-shadow: 0px 0px 19px 4px rgba(0, 0, 0, 0.1);
  padding: 10px;
  width: 97%; }
.etc-box3 { text-align: center; color: #fff; font-weight: normal; font-size: 110%; background: #006699; border-radius: 30px; }
div.etc-box2 { margin-top: 10px; margin-bottom: 10px; display: block; padding: 20px; }

.caution09 { background: #fff; padding: 10px 20px 10px 10px; font-size: 100%; margin-bottom: 20px; border: 1px solid #ff0000; border-radius: 20px; text-align: center; color: #ff0000; margin-top: 100px; }
.caution09 span { font-size: 120%; margin-top: 20px; display: block; }

div.monitor-box2 { margin-bottom: 10px; display: block; font-size: 120%; line-height: 200%; }

p.text-title3 { display: block; padding: 0; text-align: center; font-weight: bold; font-size: 125%; letter-spacing: 1px; margin-top: 45px; }
.title4 { width: 100%; background-color: #000; display: inline-block; padding: 10px 15px 10px 15px; margin-bottom: 30px; margin-top: 20px; position: relative; color: #fff; font-weight: bold; letter-spacing: 1px; font-size: 140%; text-align: center; }
.title5 { width: 100%; background-color: #000; display: inline-block; padding: 10px 15px 10px 15px; margin-bottom: 10px; margin-top: 20px; position: relative; color: #fff; font-weight: bold; letter-spacing: 1px; font-size: 140%; text-align: center; }
p.text-title4 { display: block; padding: 0; text-align: center; font-weight: bold; font-size: 125%; letter-spacing: 1px; margin: 0 0 25px 0; }
p.text-title5 { display: block; padding: 0; text-align: left; font-weight: bold; font-size: 125%; letter-spacing: 0; margin: 0 0 0 0; }
.title6 { width: 100%; background-color: #000; display: inline-block; padding: 10px 15px 10px 15px; margin-bottom: 10px; margin-top: 60px; position: relative; color: #fff; font-weight: bold; letter-spacing: 1px; font-size: 140%; text-align: center; }

.caution10 { background: #fff; padding: 10px 20px 10px 10px; font-size: 100%; margin-bottom: 20px; border: 1px solid #ff0000; text-align: left; color: #ff0000; margin-top: 30px; }

.caution11 { font-weight: normal; font-size: 75%; display: inline-block; color: #333; }

.car-box-wrapper { display: flex; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; flex-wrap: wrap; }
.select h3 { text-align: center; font-size: 170%; color: #4d4d4d; }
.car-box { flex-basis: 23%; display: flex; margin: 20px 1% 0; text-align: center; box-sizing: border-box; }
.car-box img { width: 100%; border: 1px solid #ddd; border-radius: 5px; margin-bottom: 5px; }
.car-box h4 { font-size: 1.25em; font-weight: 700; color: #4d4d4d; border-left: none; padding: 0 0 5px; margin: 0; }
.car-box a { text-decoration: none; }
.car-box a:hover { text-decoration: none; }




.modalnavi {
    display: none;
    position: fixed;
    z-index: 10000;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    overflow: auto;
    background-color: rgba(0, 0, 0, 0.5);
}
.modalnavi .modal-box {
    background-color: #fff;
    margin: 10% auto;
    max-width: 1080px;
    width: 90%;
    border-radius: 10px;
    animation-name: modalopen;
    animation-duration: 1s;
    position: relative;
	padding: 40px;
}
.modalnavi .modal-box .modalClose {
    position: absolute;
top: 15px;
right: 15px;
cursor: pointer;
color: #999;
font-size: 220%;
}


.redline { border: 1px solid #ff0000; padding: 10px; }
.redtext { color: #ff0000; }
.bluetext { color: #073190; }

a img,a:hover img { transition: 0.3s; }
a:hover img { opacity: 0.6; }


.top-navi-button { text-align: center; margin-bottom: 60px; }
.top-navi-button a { display: inline-block; }


div.index-btn { width: calc(50% - 30px); height: 250px; float: left; background: url("../img/index-btn-background.jpg")no-repeat center; border-radius: 30px; margin: 0 15px; text-align: center; display: flex; font-size: 170%; font-weight: 600; transition: 0.3s; background-size: cover; }
div.index-btn a { color: #333;
  align-items: center;
  justify-content: center;
  display: flex;
  box-sizing: border-box;
  width: 100%;
  text-shadow: #fff 1px 0 10px;
  line-height: 200%; }
div.index-btn a:hover { text-decoration: none; }
div.index-btn:hover { opacity: 0.6; transition: 0.3s; }


div.index-btn2 { width: calc(33.333333333% - 30px); }


div.index-btn-1 { width: calc(100% - 30px); border: 1px solid #a3a3a3; clear: both; border-radius: 20px; margin: 30px auto 0; height: 350px; font-size: 260%; font-weight: 900; padding: 24px 60px 60px 60px; position: relative; overflow: hidden; }
div.index-btn-1 a { display: block; width: 100%; max-width: 400px; border-radius: 30px; box-shadow: 0px 0px 50px 4px rgba(0, 0, 0, 0.1); text-align: center; font-size: 55%; font-weight: 400; padding: 15px 0; transition: 0.3s; margin-top: 30px; background-color: #fff; height: auto; }
div.index-btn-1 a:hover { transition: 0.3s; text-decoration: none; background-color: rgba(255,255,255,0.3) }
div.index-btn-1 span { display: block; position: absolute; top:0; left: 0; z-index: -1; color: #f7f7fa; font-size: 400%; line-height: 86%; }
div.index-btn-1 img { display: block; position: absolute; right: 30px; bottom: 30px; max-width: 535px; }
div.dealer img { max-width: 392px; }
div.mop img { max-width: 396px; }

#futures-wrapper { width: 100%; background-color: #f7f7f7; overflow: hidden; margin-top: 200px; }

.new-title {
  position: relative;
  padding: 5px 40px 5px 40px;
  display: inline-block;
  top:0;
  margin: 0 auto 50px;
  font-size: 250%;
  font-weight: 900;
}
.new-title span { display: block; font-size: 40%; color: #b7b7b7; }
.new-title:before, .new-title:after { 
  position: absolute;
  top: 0;
  content:'';
  width: 15px;
  height: 100%;
  display: inline-block;
}
.new-title:before {
  border-left: solid 1px #212721;
  border-top: solid 1px #212721;
  border-bottom: solid 1px #212721;
  left: 0;
}
.new-title:after {
  content: '';
  border-top: solid 1px #212721;
  border-right: solid 1px #212721;
  border-bottom: solid 1px #212721;
  right: 0;
}

div.new-title-wrapper { text-align: center; margin: 100px 0 10px 0; }


div.index-box1 { position: relative; overflow: hidden; clear: both; margin: 60px 0 0 0; }
div.index-box1 b { display: block; color: #00368f; font-size: 150%; margin-bottom: 20px; }
div.index-box1 img { position: absolute; top: 0; left: 0; display: block; max-width: 600px; width: 100%; z-index: 1; }
div.index-box1 p { position: relative; float: right; display: block; background-color: #fff; z-index: 2; padding: 40px; border-radius: 30px; width: 100%; max-width: 590px; margin: 120px 50px 50px 0; font-size: 140%; line-height: 180%; box-shadow: 0px 0px 50px 4px rgba(0, 0, 0, 0.1); }

div.index-box1 p img { position: relative; display: block; margin: 20px auto 0; width: 66%; }

div.index-box2 { position: relative; overflow: hidden; }
div.index-box2 b { display: block; color: #00368f; font-size: 150%; margin-bottom: 20px; }
div.index-box2 img { position: absolute; bottom: 0; right: 0; display: block; max-width: 600px; width: 100%; z-index: 1; }
div.index-box2 p { position: relative; float: left; display: block; background-color: #fff; z-index: 2; padding: 40px; border-radius: 30px; width: 100%; max-width: 590px; margin: 50px 0 70px 50px; font-size: 140%; line-height: 180%; box-shadow: 0px 0px 50px 4px rgba(0, 0, 0, 0.1); }

div.index-box3 { position: relative; overflow: hidden; }
div.index-box3 p { display: block; float: left; width: calc(50% - 16px); }
div.index-box3 p:last-child { float: right; }
div.index-box3 p b { display: block; background-color: #fff; padding: 20px; text-align: center; margin: 30px 0 10px; font-weight: 400; font-size: 110%; }
div.index-box3 p span { display: block; width: 90%; margin: 0 auto; }
div.index-box3 p span img { width: 100%; display: block; margin: 20px 0; }

div.index-box4 { position: relative; overflow: hidden; clear: both; margin: 60px 0 0 0; padding: 20px; box-shadow: 0px 0px 50px 4px rgba(0, 0, 0, 0.1); border-radius: 30px; }
div.index-box4 b { display: block; color: #00368f; font-size: 200%; font-weight: 700; margin: 27px; float: left; }
div.index-box4 p { display: block; float: right; }

div.index-box5 { position: relative; overflow: hidden; }
div.index-box5 p { display: block; width: calc(100% - 32px); margin: 0 auto; }
div.index-box5 p b { display: block; background-color: #fff; padding: 20px; text-align: center; margin: 30px 0 10px; font-weight: 400; font-size: 110%; }
div.index-box5 p span { display: block; width: 90%; margin: 0 auto; text-align: center; }

a.index-btn-2 { display: block; padding: 20px; text-align: center; background-color: #ab199f; color: #fff; border-radius: 30px; width: 90%; margin: 40px auto; font-size: 130%; font-weight: 500; transition: 0.3s; }
a:hover.index-btn-2 { background-color: #ab199f; color: #fff; opacity: 0.6; transition: 0.3s; text-decoration: none; }
div.index-box2 p img {
  position: relative;
  display: block;
  margin: 20px auto 0;
  width: 66%;
}

div.selector { text-align: center; }
div.selector a { display: inline-block; width: calc(50% - 60px); border-radius: 30px; box-shadow: 0px 0px 50px 4px rgba(0, 0, 0, 0.1); text-align: center; font-size: 120%; font-weight: 500; padding: 15px 0; transition: 0.3s; margin: 30px; background-color: #fff; }
div.selector a.active { color:#fff; background-color: #f00; }
div.selector a:hover { transition: 0.3s; opacity: 0.6; text-decoration: none; }


.tab { display: flex; flex-wrap: wrap; }
.tab_cont { display: none; padding: 2em; border: 3px solid #c6c6c6; border-radius: 0 0 15px 15px; transition: 0.3s; border-top: none; }
.tab_cont.active { display: block; background: #fff; }
.tab li { border: 3px solid #c6c6c6; padding: .6em; width: 33.333%; text-align: center; transition: 0.3s; background-color: #c6c6c6; }
.tab li:nth-child(2) { border-left: none; border-right: none; }
.tab li.active { background: #fff; border-bottom: none; }
.tab li a { display: block; width: 100%; height: 100%; color: #212721; font-size: 130%; font-weight: 500; }
.tab li a:hover { text-decoration: none; }
.tab li:hover { opacity: 0.3; }

img.entry-img-pc { padding-bottom: 180px; }

section.mop ul.tab li { width: 25%; }
section.mop div.box2 ul li { border: none; }
section.mop div.box2 ul { display: flex; justify-content: space-between; }

section.dop ul.tab li { width: 33.3333333333333333333333%; }
section.dop div.box2 ul li { border: none; }
section.dop div.box2 ul { display: flex; justify-content: space-between; }

.details-summary {
  position: relative;
  display: block;
}
.details-summary .btn1::before, .details-summary .btn1::after {
  content: "";
  background-color: #999;
  border-radius: 10px;
  width: 18px;
  height: 4px;
  position: absolute;
  top: 7px;
  left: 0;
  transform-origin: center center;
}
.details-summary.is-active .btn1::before {
  content: none;
}
.details-summary .btn1::before {
  width: 4px;
  height: 18px;
  top: 0;
  left: 7px;
}
.details-summary.is-active .btn1 {
  -webkit-transform: rotate(-180deg);
  transform: rotate(-180deg);
}
.details-summary .btn1 {
  position: absolute;
  top: 26px;
  left: 4%;
  width: 18px;
  height: 18px;
  transform-origin: center center;
  transition-duration: 0.2s;
  z-index: 99999;
}
.details-summary .btn0 {
  top: 6px;
  left: 1%;
}

section#navigationplus .details-summary .btn1::before, section#navigationplus .details-summary .btn1::after {
  content: "";
  background-color: #fff;
  border-radius: 10px;
  width: 18px;
  height: 4px;
  position: absolute;
  top: 7px;
  left: 0;
  transform-origin: center center;
}
section#navigationplus .details-summary.is-active .btn1::before {
  content: none;
}
section#navigationplus .details-summary .btn1::before {
  width: 4px;
  height: 18px;
  top: 0;
  left: 7px;
}
section#navigationplus .details-summary.is-active .btn1 {
  -webkit-transform: rotate(-180deg);
  transform: rotate(-180deg);
}
section#navigationplus .details-summary .btn1 {
  position: absolute;
  top: 41%;
  left: 4%;
  width: 18px;
  height: 18px;
  transform-origin: center center;
  transition-duration: 0.2s;
  z-index: 99999;
}
section#navigationplus .details-summary .btn0 {
  top: 14%;
  left: 1%;
}


p.support-title { display: block; text-align: center; font-size: 250%; font-weight: 700; }
p.support-text { display: block; text-align: center; font-size: 120%; font-weight: 400; margin-bottom: 30px; }

td.pc { display: revert; }

p.drive-title-0 { text-align: center; font-size: 150%; font-weight: 700; color: #6971b3; }
p.drive-title-1 { text-align: center; font-size: 150%; font-weight: 700; color: #4d829a; }

div.dealer img.index-btn-img { opacity: 0.2;
  left: auto;
  right: 30px;
  top: auto;
  max-width: 455px;
  bottom: 26px; }

div.mop img.index-btn-img { opacity: 0.2;
  left: auto;
  right: 30px;
  top: auto;
  max-width: 455px;
  bottom: 26px; }
  
div.index-btn-1 p { max-width: 381px; color: #212529; }

div.etc-wrapper3 { text-align: center; padding-top: 30px; }
div.etc-wrapper3 img { display: inline-block; width: calc(30% - 40px); margin: 0 20px; }

img.hdmi { padding-right: 20px; }

div.list-wrapper { padding: 20px 40px; line-height: 180%; font-size: 110%; }

div.list-wrapper div { display: inline-block; color: #ff0000; padding: 20px 40px; border: 1px solid #ff0000; font-size: 120%; font-weight: 700; margin-left: -1.0em; margin-bottom: 40px; margin-top: 40px; }

div.list-wrapper ul.list-red { color: #ff0000; }

div.list-wrapper ul li.circle { list-style: disc; }

div.list-wrapper p { margin-left: -1.0em; font-size: 95%; }

li.list-01 { position: relative; padding-left: 2.5em; margin-left: -1.0em }
li.list-01::before { content: '注1：'; position: absolute; left: 0; color: #ff0000; }
li.list-02 { position: relative; padding-left: 2.5em; margin-left: -1.0em }
li.list-02::before { content: '注2：'; position: absolute; left: 0; color: #ff0000; }
li.list-03 { position: relative; padding-left: 2.5em; margin-left: -1.0em }
li.list-03::before { content: '注3：'; position: absolute; left: 0; color: #ff0000; }
li.list-04 { position: relative; padding-left: 2.5em; margin-left: -1.0em }
li.list-04::before { content: '注4：'; position: absolute; left: 0; color: #ff0000; }
li.list-05 { position: relative; padding-left: 2.5em; margin-left: -1.0em }
li.list-05::before { content: '注5：'; position: absolute; left: 0; color: #ff0000; }
li.list-06 { position: relative; padding-left: 2.5em; margin-left: -1.0em }
li.list-06::before { content: '注6：'; position: absolute; left: 0; color: #ff0000; }
li.list-07 { position: relative; padding-left: 2.5em; margin-left: -1.0em }
li.list-07::before { content: '注7：'; position: absolute; left: 0; color: #ff0000; }
li.list-08 { position: relative; padding-left: 2.5em; margin-left: -1.0em }
li.list-08::before { content: '注8：'; position: absolute; left: 0; color: #ff0000; }
li.list-09 { position: relative; padding-left: 2.5em; margin-left: -1.0em }
li.list-09::before { content: '注9：'; position: absolute; left: 0; color: #ff0000; }

div .simple-tstyle { margin: 0 0 20px 0; border-bottom: 1px dotted #999; padding-bottom: 20px; }
div .simple-tstyle span { display: block; color: #00a2b1; font-weight: 700; font-size: 120%; margin: 0 0 10px 0; }

div.index-btn-1 p.dop-back { display: block; padding: 10px; color: #fff; font-weight: 900; background-color: #FFA31F; text-align: center; border-radius: 0 30px 30px 0 }
div.index-btn-1 p.mop-back { display: block; padding: 10px; color: #fff; font-weight: 900; background-color: #2EA83B; text-align: center; border-radius: 0 30px 30px 0 }

div.index-btn p b { margin-bottom: 20px; display: block; }
div.index-btn p { font-size: 110%; text-align: center; }

span.ig-blue { color: #215994; }
span.cost { border: 1px solid #000; border-radius: 6px; padding: 0 4px; }
span.cost2 { margin-left: 195px; }

.est_time_caption--blank { display: inline-block; width: 30px; height: 17px; background: #FFFFFF; border: 1px solid #333333; border-radius: 3px; margin: 0 2px; vertical-align: bottom; }
.est_time_caption { display: inline; background: #FFFFFF; border: 1px solid #333333; border-radius: 3px; padding: 0 4px; margin-right: 1px; }