*{
	box-sizing: border-box;
}
img { max-width: 100%; height: auto; }
.pTB2 { padding: 2rem 0; }
.pTB3 { padding: 3rem 0; }
.text-right { text-align: right; }
.text-bold { font-weight: bold; }

.warpper-line-blue{ padding: 22px 0 0;}
.warpper-line-blue .head-title .text-head img { margin-top: 0; }
@import url('https://fonts.googleapis.com/css?family=Prompt&display=swap');

.warrper-blue{background: #e4f7fe;}
.warrper-white{background: #ffffff;}
.top-line{background: url(../images/curve-bottom.png) repeat-x top; height: 30px;}
.footer-line{background: url(../images/curve-top.png) repeat-x bottom; margin: 0 0 20px; height: 30px;}
.line-orange { display: block; width: 100%; height: 5px; background: url(../images/line-orange.png) repeat-x; }



/* banner top */
.banner-top { text-align: center; margin-bottom: 3rem; }

/* content no1 */
.content-no1 { display: block; }
.color-box { background: #fff; margin: 0 auto 3rem; }
.box-title { background: url(../images/bg-title-color.png) top left; text-align: center; padding: 6px; font-size: 20px; font-weight: bold; color: #fff; position: relative; }
.box-title.title-blue { background-color: #38acfc; position: relative; }
.box-title.title-blue::after { content: '';  border-top: 25px solid #5fc7fd; border-left: 15px solid transparent; border-right: 15px solid transparent; position: absolute; left: 48%; bottom: -25px; }
.box-title.title-orange { background-color: #fc9c38; position: relative; }
.box-title.title-orange::after { content: '';  border-top: 25px solid #fdbb5f; border-left: 15px solid transparent; border-right: 15px solid transparent; position: absolute; left: 48%; bottom: -25px; }
.box-title.title-violet { background-color: #c141dc; position: relative; }
.box-title.title-violet::after { content: '';  border-top: 25px solid #d346eb; border-left: 15px solid transparent; border-right: 15px solid transparent; position: absolute; left: 48%; bottom: -25px; }


.text-no1 { padding: 3rem; }
.text-topic { font-size: 18px; text-align: center; }
.text-topic .text-red { color: #f90000; border-bottom: 4px solid #fcff00; }
.text-topic .text-red strong { font-size: 26px; }
.box-yellow { background: #fffddf; display: table; width: 100%; font-size: 16px; margin-top: 12px; }
.box-yellow .left { display: table-cell; width: 180px; padding: 14px ; text-align: right; vertical-align: middle; }
.box-yellow .left strong { background: #0090ff; color: #fff; padding: 4px; text-align: center; display: block; }
.box-yellow .right { display: table-cell; padding: 14px; text-align: left; vertical-align: middle; }
.box-yellow ul { display: block; }
.box-yellow ul li { display: inline-block; padding: 4px 8px; }

/* set plus */
.setplus { display: flex; flex-wrap: wrap; width: 100%; justify-content: center; }
.setplus .set-topic { padding: 1.5rem 1rem; text-align: center; font-size: 14px; font-weight: bold; color: #000; background: #fff; }
.setplus .text-red { color: #f90000; border-bottom: 4px solid #fcff00; }
.setplus .text-red strong { font-size: 26px; }
.setplus .sub-title-set { display: block; text-align: left; color: #fe711c; font-weight: bold; padding: 4px; }
.setplus .sub-title-set small { float: right; color: #000; font-size: 12px; }
.setplus .content-set { padding: 8px; }
.setplus .content-set ul { display: flex; flex-wrap: wrap; padding: 8px; }
.setplus .content-set ul li { display: block; width: 50%; padding: 0 4px; text-align: left; }

.set-yellow { display: block; width: 48%; margin: 2rem 1%; background: #fffddf; }
.set-yellow .title-yellow { background: url(../images/curve-yellow.jpg); font-size: 20px; font-weight: bold; text-align: center; color: #fc7938; padding: 6px; }

.set-orange { display: block; width: 48%; margin: 2rem 1%;  background: #fffddf;  }
.set-orange .title-orange { background: url(../images/curve-orange.jpg); font-size: 20px; font-weight: bold; text-align: center; color: #ffffff; padding: 6px; }

/* set-premium */
.set-premium { background: #fffddf; display: block; padding: 12px; text-align: center; margin-top: 3rem; position: relative; }
.set-premium .more { display: inline-block; position: absolute; top: -24px; left: 5%; }
.set-premium .text-blue { font-size: 20px; font-weight: bold; color: #0045ad; border-bottom: 3px solid #fcff00; margin: 4px 2%; display: inline-block; }

/* set point */
.title-setpoint { text-align: center; border-top: 1px solid #000; border-bottom: 1px solid #000; font-size: 20px; color: #0081f9; padding: 18px 8px; position: relative; }
.title-setpoint::before { content:''; background: url(../images/line-dot.png) repeat-x; height: 5px; width: 100%; position: absolute; top: 0; left: 0; }
.title-setpoint::after { content:''; background: url(../images/line-dot.png) repeat-x; height: 5px; width: 100%; position: absolute; bottom: 0; left: 0; }

.setpoint { background: url(../images/bg-dot.jpg); padding-right: 4px; padding-bottom: 4px; }
.content-setpoint { background: #fff; margin: 2rem auto 0; padding: 12px; }
.title-point { position: relative; font-size: 18px; font-weight: bold; padding: 8px 12px 12px 65px; }
.title-point .number { position: absolute; top: -12px; left: 0; }

.graph { display: flex; flex-wrap: wrap; justify-content: center; }
.graph .graph-blue { display: block; width: 48%; margin: 18px 1%; text-align: center; }
.graph .graph-pink { display: block; width: 48%; margin: 18px 1%; text-align: center; }
.graph .graph-blue .text-tell { color: #007be4; }
.graph .graph-pink .text-tell { color: #ff5570; }
.text-tell { background: #f3f2f2; display: inline-block; padding: 4px 18px; position: relative; border-radius: 32px; margin-bottom: 20px; }
.text-tell::after { content: ''; width: 0; height: 0; border-right: 20px solid #f3f2f2; border-top: 5px solid #f3f2f2; border-left: 5px solid transparent; border-bottom: 20px solid transparent; position: absolute; bottom: -18px; left: 12%; }

.lease { display: flex; flex-wrap: wrap; margin: 18px auto; }
.lease .lease-number { width: 33.33%; display: block; padding: 12px; text-align: center; }
.lease .lease-number img { margin-bottom: 8px; }
.lease .title-lease { font-size: 16px; font-weight: bold; color: #0055ac; text-align: left; }
/* item car */
.title-item-car { font-size: 24px; font-weight: bold; color: #fff; padding: 12px; border-top: 1px solid #000; border-bottom: 1px solid #000; position: relative; box-shadow: inset 0px 1px 0px #fff; }
.title-item-car strong { font-size: 34px; }
.title-item-car span { font-size: 20px; }
.title-item-car small { font-size: 11px; }
.title-item-car.popular-model { background: #f89326; }
.title-item-car.popular-model::after { content: ''; background: url(../images/line-dot-green.jpg) repeat-x; width: 100%; height: 5px; position: absolute; left: 0; bottom: -6px; }
.title-item-car.popular-car { background: #1f9ef6; }
.title-item-car.popular-car::after { content: ''; background: url(../images/line-dot-pink.jpg) repeat-x; width: 100%; height: 5px; position: absolute; left: 0; bottom: -6px; }
.title-item-car.high-grade { background: #b83dd7; }
.title-item-car.high-grade::after { content: ''; background: url(../images/line-dot-yellow.jpg) repeat-x; width: 100%; height: 5px; position: absolute; left: 0; bottom: -6px; }

.item-car { display: block; margin: 2rem auto; }
.item-car ul { display: flex; flex-wrap: wrap; }
.item-car ul li { width: 23%; margin: 12px 1%;  border: 3px solid #e8e8e8; border-radius: 12px; padding: 12px; text-align: center;  }
.item-car .logo-car {display: block;text-align: left;width: 50%; color:#ea2b2e;font-family: 'Prompt', sans-serif;    font-weight: 900;
    font-size: 18px;
    height: 25px;}
.item-car .images-car  { padding: 12px; }
.item-car .name-car { height: 65px; overflow: hidden; font-size: 13px; }
.item-car .name-car strong { display: block; font-size: 15px; }
.item-car .price-car { text-align: left; font-size: 12px; }
.item-car .price-car strong { font-size: 15px; display: inline-block;  }
.item-car .bonus { font-size: 12px; color: #f70000; text-align: left; }
.item-car .bonus strong { font-size: 15px; display: inline-block; }
.item-car .bonus .line-red { background: url(../images/line-dot-red.jpg) repeat-x; width: 100%; height: 2px; display: block; margin: 4px auto; }

.item-car ul.item-orange li { box-shadow: 3px 3px 0 #fff4d2; }
.item-car ul.item-blue li { box-shadow: 3px 3px 0 #d2f4ff; }
.item-car ul.item-violet li { box-shadow: 3px 3px 0 #f4d4ff; }

/* contact */
.box-contact{ display:table; width: 100%; text-align: center; }
.box-contact a{ color: #fff;}
.box-contact .tel{ background: url(../images/pattern-tile-darkblue.png); width: 50%; display: table-cell; padding: 15px;}
.box-contact .tel span{ display: inline-block; width: 200px; vertical-align: middle; font-size: 24px; font-weight: bold;}
.box-contact .tel small{ display: block; font-size: 12px; font-weight: normal;}
.box-contact .mail{ background: url(../images/pattern-tile-blue.png); width: 50%; display: table-cell; padding: 15px;}
.box-contact .mail span{ display: inline-block; width: 60%; vertical-align: middle; font-size: 22px; font-weight: bold;}
.contact-top{ display: none;}

.sp-only{ display:none;}

@media(max-width:860px) {
	.setplus .content-set ul li { width: 100%; }
	.set-orange .title-orange { font-size: 16px; }
	.set-yellow .title-yellow { font-size: 16px; }

	.text-tell { padding: 4px 8px; }

	.item-car ul li { width: 31.33%; }
}

@media(max-width:768px){
	.box-contact .mail span{ font-size: 18px;  width: 80% !important;}

	.set-premium { padding: 12px 12px 12px 130px;}
}

@media(max-width:720px) {
	.set-yellow,
	.set-orange { width: 100%; margin: 12px auto; }
	.setplus .content-set ul li { width: 50%; }

	.graph .graph-blue,
	.graph .graph-pink { width: 100%; margin: 12px auto; }

	
	.lease .lease-number { font-size: 12px; }

	.sp-only{ display:block;}

}

@media(max-width:580px){
	.lease .lease-number { width: 100%; margin: 12px auto; }

	.item-car ul li { width: 48%; }



	.box-contact{ display: block;}
	.box-contact .tel, .box-contact .mail{ display: none; width: 100%;}
	
}

@media(max-width:490px) {
	.warpper-line-blue .head-title .text-head h2 { font-size: 22px; }

	.box-yellow { display: block; }
	.box-yellow .left,
	.box-yellow .right { display: block; width: 100%; padding: 14px 14px 0;   }

	.setplus .content-set ul li { width: 100%; }

	.set-premium { padding: 12px; }
	.set-premium .more { position: relative; top: 0; left: 0; }

	.title-item-car { font-size: 20px; }
	.title-item-car strong { font-size: 30px; }
	.title-item-car span { font-size: 16px; }

}

@media(max-width:420px) {
	.text-no1 { padding: 3rem 1rem; }

	.box-title { font-size: 18px; }
	.text-topic { font-size: 16px; }
	.box-yellow { font-size: 14px; }

	.title-point { font-size: 16px; }

	.set-orange .title-yellow,
	.set-orange .title-orange { font-size: 15px; }

	.item-car ul li { padding: 8px; }
	.item-car .price-car strong  { font-size: 13px; }
	.item-car .bonus strong { font-size: 13px; }

	.pTB3 { padding: 1rem 0; }

}