@charset "utf-8";

/* ++++++++++++++++++++++++++++++++++++++++

	/dog/honda-car/Nbox/custom/ for SP

++++++++++++++++++++++++++++++++++++++++ */

@media screen and (max-width: 768px){

#contents_area {
	background-image: url(../image/bg_sp.jpg);
}


/* ----------------------------------------
	section_title
---------------------------------------- */

#section_title {
	padding: 103.2% 0 8%;
	background-image: url(../image/title_sp.png);
}


/* ----------------------------------------
	section_info
---------------------------------------- */

#section_info {
	background-image: url(../image/info_bg_sp.png);
}

#profile ul,
#profile li {
	background-image: url(../image/profile_border.png);
}
#profile ul {
	width: 48.63%;
	margin: 0 4.83% 0 5.31%;
}
#profile li {
	padding-left: 6.95%;
}

#profile .photo {
	width: 33.81%;
	margin-top: -5.95%;
}

#profile .size {
	width: 84.7%;
	margin-left: 10.78%;
}

#bag li:nth-child(1) img {
	width: 67.47%;
	margin-left: 11.75%;
}
#bag li:nth-child(2) img {
	width: 58.77%;
	margin-left: 17.39%;
}


/* ----------------------------------------
	section_reason
---------------------------------------- */

.section_reason .photo.deco:before,
.section_reason .photo .deco>div:before {
	background: #e1f5f7;
}

.photo_size .slick-dots li button {
	background: #693264;
}

.photo_size .slick-dots .slick-active button {
	border-color: #693264;
}

/* secion_reason01
---------------------------------------- */

#section_reason01 {
	padding-bottom: 34%;
	background-image: url(../image/reason01_bg_sp.png);
}

#section_reason01 h3 {
	width: 51%;
}

/* [data-num='1'] */

#section_reason01 [data-num='1'] {
	padding-bottom: 22.4%;
	background-image: url(../image/reason01_bg01_sp.png);
}

#section_reason01 [data-num='1'] [data-photo='1']>ul {
	width: 97.2%;
	margin: 0 0 12% 1.6%;
	padding-right: 8.66%;
}
#section_reason01 [data-num='1'] [data-photo='1']>ul>div {
	padding-top: 15.31%;
}
#section_reason01 [data-num='1'] [data-photo='1']>ul>div:before {
	left: 6.77%;
	bottom: -4.25%;
	width: 27.1%;
	padding-top: 27.1%;
}
#section_reason01 [data-num='1'] [data-photo='1']>ul>div:after {
	right: 34.71%;
	top: 0;
	width: 6.17%;
	padding-top: 17.77%;
	background-image: url(../image/reason01_photo01_01_deco_sp.png);
}

#section_reason01 [data-num='1'] [data-photo='2'] {
	width: 60%;
	margin-left: 10%;
	padding-bottom: 5.86%;
}
#section_reason01 [data-num='1'] [data-photo='2']:before {
	right: -4.44%;
	top: 63.14%;
	width: 26.66%;
	padding-top: 26.66%;
}
#section_reason01 [data-num='1'] [data-photo='2']:after {
	right: -12.66%;
	bottom: 0;
	width: 16.88%;
	padding-top: 30.88%;
	background-image: url(../image/reason01_photo01_02_deco_sp.png);
}

/* [data-num='2'] */

#section_reason01 [data-num='2'] {
	margin-bottom: 4%;
	padding-bottom: 15.2%;
	background-image: url(../image/reason01_bg02_sp.png);
}

#section_reason01 [data-num='2'] [data-photo='1'] {
	width: 82.66%;
	margin: 0 0 4% 4.66%;
	padding-top: 9.2%;
}
#section_reason01 [data-num='2'] [data-photo='1']:before {
	right: -3.22%;
	top: 8.92%;
	width: 29.03%;
	padding-top: 29.03%;
}
#section_reason01 [data-num='2'] [data-photo='1']:after {
	right: 30.48%;
	top: 0;
	width: 4.03%;
	padding-top: 13.38%;
	background-image: url(../image/reason01_photo02_01_deco_sp.png);
}

#section_reason01 [data-num='2'] [data-photo='2'] {
	width: 54.66%;
	margin-left: 37.33%;
}
#section_reason01 [data-num='2'] [data-photo='2']:before {
	left: -4.87%;
	bottom: -4.87%;
	width: 29.26%;
	padding-top: 29.26%;
}

/* [data-num='3'] */

#section_reason01 [data-num='3'] {
	padding-bottom: 21.6%;
	background-image: url(../image/reason01_bg03_sp.png);
}

#section_reason01 [data-num='3'] [data-photo='1']>ul {
	width: 80%;
	margin: 4.8% auto 14%;
}
#section_reason01 [data-num='3'] [data-photo='1']>ul>div:before {
	right: -3.33%;
	bottom: -3.38%;
	width: 30%;
	padding-top: 30%;
}
#section_reason01 [data-num='3'] [data-photo='1']>ul>div:after {
	right: -6%;
	top: -23.05%;
	width: 74.5%;
	padding-top: 139.33%;
	background-image: url(../image/reason01_photo03_01_deco_sp.png);
}

#section_reason01 [data-num='3'] [data-photo='2'] {
	width: 52%;
	margin: 3.2% 0 0 10%;
}
#section_reason01 [data-num='3'] [data-photo='2']:before {
	left: -5.12%;
	bottom: -5.88%;
	width: 30.76%;
	padding-top: 30.76%;
}

/* [data-num='4'] */

#section_reason01 [data-num='4'] {
	margin-top: -4.8%;
	padding-bottom: 16.4%;
	background-image: url(../image/reason01_bg04_sp.png);
}

#section_reason01 [data-num='4'] [data-photo='1']>ul {
	width: 80%;
	margin: 0 auto 12.4%;
}
#section_reason01 [data-num='4'] [data-photo='1']>ul>div {
	padding-top: 11%;
}
#section_reason01 [data-num='4'] [data-photo='1']>ul>div:before {
	left: -3.33%;
	top: 5.19%;
	width: 30%;
	padding-top: 30%;
}
#section_reason01 [data-num='4'] [data-photo='1']>ul>div:after {
	left: 42.5%;
	top: 0;
	width: 9.33%;
	padding-top: 17%;
	background-image: url(../image/reason01_photo04_01_deco_sp.png);
}

#section_reason01 [data-num='4'] [data-photo='2'] {
	width: 80%;
	margin: 0 auto 3.2%;
}
#section_reason01 [data-num='4'] [data-photo='2']:before {
	right: -3.33%;
	top: -4.76%;
	width: 30%;
	padding-top: 30%;
}

#section_reason01 [data-num='4'] [data-photo='3']>ul {
	width: 80%;
	margin: 6.66% auto;
}
#section_reason01 [data-num='4'] [data-photo='3']>ul>div:before {
	left: -3.33%;
	bottom: -4.59%;
	width: 20%;
	padding-top: 20%;
}

/* column */

#section_reason01 .column {
	margin-top: 3.2%;
	background-image: url(../image/reason01_column_bg_sp.png);
}

/* secion_reason02

---------------------------------------- */

#section_reason02 {
	margin-top: -9.6%;
}
#section_reason02 h3 {
	width: 51%;
}

/* [data-num='1'] */

#section_reason02 [data-num='1'] {
	padding-bottom: 15.2%;
}

#section_reason02 [data-num='1'] [data-photo='1'] {
	margin-bottom: 13px;
	padding-top: 13%;
}
#section_reason02 [data-num='1'] [data-photo='1']:before {
	left: -3.33%;
	top: 12.66%;
	width: 30%;
	padding-top: 30%;
}
#section_reason02 [data-num='1'] [data-photo='1']:after {
	left: 47.5%;
	top: 0;
	width: 13.33%;
	padding-top: 18.83%;
	background-image: url(../image/reason02_photo01_01_deco_sp.png);
}

#section_reason02 [data-num='1'] [data-photo='1'] .notes {
	position: absolute;
	right: 0;
	top: 100%;
	margin-top: 4px;
	line-height: 1;
}

#section_reason02 [data-num='1'] .list li:nth-child(1) .photo+p {
	width: 200%;
	left: -50%;
}

#section_reason02 [data-num='1'] .list li:nth-child(1) .name {
	white-space: nowrap;
}

#section_reason02 [data-num='1'] [data-photo='2']:before {
	right: -3.33%;
	top: -5.26%;
	width: 30%;
	padding-top: 30%;
}

/* [data-num='2'] */

#section_reason02 [data-num='2'] {
	padding-bottom: 20%;
}

#section_reason02 [data-num='2'] [data-photo='1'] {
	width: 80%;
	margin: 3.2% auto;
	padding-top: 4%;
}
#section_reason02 [data-num='2'] [data-photo='1']:before {
	left: 47.5%;
	top: 2.04%;
	width: 30%;
	padding-top: 30%;
}
#section_reason02 [data-num='2'] [data-photo='1']:after {
	right: 15.5%;
	top: 0;
	width: 13%;
	padding-top: 26.66%;
	background-image: url(../image/reason02_photo02_01_deco_sp.png);
}
#section_reason02 [data-num='2'] [data-photo='1'] sup {
	position: absolute;
	left: 100%;
	bottom: 4%;
	z-index: 1;
	margin-left: 3px;
}


/* ----------------------------------------
	section_accessory
---------------------------------------- */

#section_accessory {
	padding: 9.6% 0 .4%;
	background-image: url(../image/accessory_bg_sp.jpg);
}

#section_accessory .section_inner {
	padding-bottom: 12.8%;
	background-image: url(../image/accessory_bg_inner_sp.png);
}

#section_accessory .heading p {
	width: 82.66%;
}

#section_accessory .btn,
#section_car .btn {
	background: #693264;
}


/* ----------------------------------------
	section_car
---------------------------------------- */

#section_car {
	padding-top: 3.2%;
}
#section_car h3 {
	width: 87.2%;
	margin-left: 6%;
}

/* car_price
---------------------------------------- */

#car_price h4 {
	color: #693264;
}

/* car_spec
---------------------------------------- */

#car_spec_table th {
	color: #693264;
}

}