@charset "utf-8";
/* CSS Document */


/* Reset
------------------------------------------------------------*/
body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
form,
fieldset,
input,
textarea,
p,
blockquote,
th,
td
{
	margin: 0;
	padding: 0;
}
address,
em
{
	font-style: normal;
}
strong,
th
{
	font-weight: normal;
}
table
{
	border-collapse: collapse;
	border-spacing: 0;
	width: 100%;
}
th
{
	text-align: left;
}
hr,
legend
{
	clear: both;
	display: none;
}
h1,
h2,
h3,
h4,
h5,
h6
{
	font-size: 100%;
	font-weight: normal;
}
img,
fieldset
{
	border: 0;
}
img
{
	border:0;
	vertical-align:top;
	max-width:100%;
	height:auto;
  /* image-rendering: -webkit-optimize-contrast; */
}
li
{
	list-style-type: none;
}
input[type="submit"],button,label,select{
	cursor:pointer;
}
hr{
	clear: both;
}


/* Fonts
------------------------------------------------------------*/
body{
	-webkit-text-size-adjust: 100%;
	word-wrap : break-word;
	overflow-wrap : break-word; 
}
body,input,button,textarea,select
{
	font: 14px/2 "メイリオ",Verdana, "Hiragino Kaku Gothic ProN", "游ゴシック", YuGothic, Meiryo, sans-serif;
	color: #333;
}
html>/**/body
{
	font-size: 14px;
} /* Except IE */
.clear
{
	clear: both;
}


/* link
------------------------------------------------------------*/
a,a:hover{
	color:#2980b9;
	text-decoration:none;
}


/* clearfix
------------------------------------------------------------*/
.clearfix::after
{
	content:".";
	display:block;
	clear:both;
	height:0;
	visibility:hidden;
}
.clearfix
{
	display:inline-block;
}
/* exlude MacIE5 \*/
* html .clearfix
{
	height:1%;
}
.clearfix
{
	display:block;
}
/* end MacIE5 */
.clearfix + *
{
	clear: both;
}


/* 
------------------------------------------------------------*/
body{
	margin: 0;
	padding: 0;
}

/* html { scroll-behavior: smooth; */

  a:hover img{
  opacity: 0.8;
  filter: alpha(opacity=80);
  -ms-filter: "alpha(opacity=80)";
}
div#main{
	width: 100%;
	max-width: 980px;
	margin: 0 auto;
	padding: 0;
  overflow: hidden;
}
div#main>h3{
  width: 90%;
  max-width: 750px;
  padding: 2% 5%;
}
div#main>div{
  width: 90%;
  max-width: 915px;
  padding: 0 5% 5%;
}
div#main img,
div#nissanbg img{
  display: block;
  width: 100%;
  height: auto;
}
a#nissanbtn{
  display: block;
  width: 60%;
  margin: 0 auto;
}
img#nissanbg{
  display: block;
  margin-bottom: -35%;
}
.pLR20{
  padding-left: 20px;
  padding-right: 20px;
}
.pUD20{
  padding-top: 20px;
  padding-bottom: 20px;
}
@media screen and (max-width: 768px) {
div#main,
div#nissanbg{
  width: 100%;
  max-width: 980px;
  margin: 0 auto;
  padding: 0;
}
.pLR20{
  padding-left: 2%!important;
  padding-right: 2%!important;
}
.pUD20{
  padding-top: 2%!important;
  padding-bottom: 2%!important;
}
}


/* topnav
------------------------------------------------------------*/
ul.topnav{
	width: 100%;
	max-width: 980px;
	font-size: 0;
}
ul.topnav>li{
	width: 50%;
	max-width: 490px;
	display:inline-block;
}
ul.topnav>li>a{
  display: block;
}


/* article>img
------------------------------------------------------------*/
article>img
{
  display: block;
  width: 100%;
}


/* .subnav
------------------------------------------------------------*/
ul.subnav2{
  width: 100%;
  font-size: 0;
  margin: 0 20px;
}
ul.subnav2>li{
  width: 45%;
  display:inline-block;
  padding: 10px;
}

ul.subnav3{
  width: 100%;
  font-size: 0;
}
ul.subnav3>li{
  width: 25%;
  display:inline-block;
}






/* article.recommend
------------------------------------------------------------*/
article.recommend{
  position: relative;
}
article.recommend>img{
  display: block;
  width: 100%;
}
article.recommend>ul{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  position: absolute;
  margin-top: 61%;
  top: 0;
  left: 0;
  width: 100%;
}
article.recommend>ul>li{
  width: 50%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
article.recommend>ul>li a{
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 88%;
}
article.recommend>ul>li.recommend_btn01,
article.recommend>ul>li.recommend_btn02{
  padding-top: 0%;
}
article.recommend>ul>li.recommend_btn03,
article.recommend>ul>li.recommend_btn04{
  padding-top: 39.5%;
}
article.recommend>ul>li.recommend_btn05{
  padding-top: 39.5%;
}
article.recommend>ul>li.recommend_btn06{
  padding-top: 6%;
  margin-left: -1%;
}
article.recommend>ul>li.recommend_btn06 a{
  width: 100%;
}


/* article.popular
------------------------------------------------------------*/
article.popular{
  position: relative;
}
article.popular>img{
  display: block;
  width: 100%;
}
article.popular>ul{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}
article.popular>ul>li{
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
article.popular>ul>li:nth-child(n+3)
{
  margin-top: 1%;
}
article.popular>ul>li a{
  display: block;
  margin-left: auto;
  margin-right: auto;
}
article.popular>ul.popular_1{
  margin-top: 20%;
}
article.popular>ul.popular_1>li{
  width: 50%;
}
article.popular>ul.popular_1>li:nth-child(odd) a
{
  margin-left: auto;
  margin-right: 2%;
}
article.popular>ul.popular_1>li:nth-child(even) a
{
  margin-left: 2%;
  margin-right: auto;
}
article.popular>ul.popular_1>li a{
  width: 92%;
}
article.popular>ul.popular_2{
  margin-top: 72%;
}
article.popular>ul.popular_2>li{
  width: 100%;
}
article.popular>ul.popular_2>li a{
  width: 94%;
}


/* article.map
------------------------------------------------------------*/
article.map{
  position: relative;
}
article.map>div{
  margin-top: 36%;
  position: absolute;
  top: 0;
  left: 50%;
  -webkit-transform: translateX( -50% );
      -ms-transform: translateX( -50% );
          transform: translateX( -50% );
  display: block;
  width: 92%;
}
article.map>div>div{
  position: relative;
  padding-top: 50%;
  width: 100%;
}
article.map>div>div>iframe{
  position: absolute;
  top: 0%;
  left: 0%;
  display: block;
  width: 100%;
  height: 100%;
}


/* article.stock
------------------------------------------------------------*/
article.stock{
  position: relative;
}
article.stock>img{
  display: block;
  width: 100%;
}
article.stock>ul{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}
article.stock>ul>li{
  width: 50%;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
article.stock>ul>li:nth-child(n+3)
{
  margin-top: 1%;
}
article.stock>ul>li:nth-child(odd) a
{
  margin-left: auto;
  margin-right: 1.5%;
}
article.stock>ul>li:nth-child(even) a
{
  margin-left: 1.5%;
  margin-right: auto;
}
article.stock>ul>li a{
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 90%;
}
article.stock>ul.stock_1{
  margin-top: 70%;
}
article.stock>ul.stock_2{
  margin-top: 30%;
}


/* コロナ対策のお願い
------------------------------------------------------------*/
#please
{
  position: relative;
}
#please .btn
{
  margin-top: 79%;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform:     translate(-50%, -50%);
      transform:     translate(-50%, -50%);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack:  justify;
      -ms-flex-pack: justify;
  justify-content:   space-between;
  width: 84%;
}
#please .btn a
{
  display: block;
}

/* two btn　ここから追加（0219）
------------------------------------------------------------*/
#tokusen
{
  position: relative;
}
.tokusen-btn .btn
{
  margin-top: 57%;
  margin-left: 0;
  position: absolute;
  top: 0;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform:     translate(-50%, -50%);
      transform:     translate(-50%, -50%);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack:  justify;
      -ms-flex-pack: justify;
  justify-content:   space-between;
  width: 85%;
}
.tokusen-btn .btn a
{
  display: block;
}

/* footer_sa
------------------------------------------------------------*/
.footer_sa
{
  position: relative;
}
.sa-btn .btn
{
  margin-top: 15%;
  margin-left: 0;
  position: absolute;
  top: 0;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform:     translate(-50%, -50%);
      transform:     translate(-50%, -50%);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack:  justify;
      -ms-flex-pack: justify;
  justify-content:   space-between;
  width: 87%;
}
.sa-btn .btn a
{
  display: block;
}

/* footer_ni
------------------------------------------------------------*/
.footer_ni
{
  position: relative;
}
.ni-btn .btn
{
  margin-top: 30%;
  margin-left: 0;
  position: absolute;
  top: 0;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform:     translate(-50%, -50%);
      transform:     translate(-50%, -50%);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack:  justify;
      -ms-flex-pack: justify;
  justify-content:   space-between;
  width: 87%;
}
.ni-btn .btn a
{
  display: block;
}