@charset "UTF-8";

/* --------------------------------------------------
 * Index
 * --------------------------------------------------
 */



/*TOYOTA Regular FONT*/
@font-face {
  font-family: "toyotaDisplay";
  src: url('../fonts/toyotadisplay_rg.eot');
  src: url('../fonts/toyotadisplay_rg.eot?#iefix') format('embedded-opentype'),
       url('../fonts/toyotadisplay_rg.woff') format('woff'),
       url('../fonts/toyotadisplay_rg.ttf') format('truetype'),
       url('../fonts/toyotadisplay_rg.svg#toyota_displayregular') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'toyotaDisplay';
  src: url('../fonts/toyotadisplay_bd.eot');
  src: url('../fonts/toyotadisplay_bd.eot?#iefix') format('embedded-opentype'),
       url('../fonts/toyotadisplay_bd.woff') format('woff'),
       url('../fonts/toyotadisplay_bd.ttf') format('truetype'),
       url('../fonts/toyotadisplay_bd.svg#toyota_displaybold') format('svg');
  font-weight: bold;
  font-style: normal;
}



/* container ---------- */
body {
	font-family: toyotaDisplay,"Microsoft Yahei","微软雅黑","宋体";
	background: #fff;
	color: #202020;
	-webkit-text-size-adjust: none;
}

.cf{display:table; content:''; clear:both;}
.orange_video{width:100%;}
.orange_video video{width:100%; padding:0; margin:0;}
#wrapper {
	position: relative;
	/*display: none;*/
	width: 100%;
}
#wrapper.mask {
	position: fixed;
	overflow: hidden;
}

/* img */
img {
	vertical-align: bottom;
}
.bgimg {
	display: block;
	text-indent: 200%;
	white-space: nowrap;
	overflow: hidden;
}
.bb {
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
}


/* --------------------------------------------------
 * FONT
 * --------------------------------------------------
 */

.f_nunito_R {
	/*font-family: 'Nunito', sans-serif;*/
	font-weight: 300;
}
.f_nunito_B {
	/*font-family: 'Nunito', sans-serif;*/
	font-weight: 700;
}



/* --------------------------------------------------
 * LAYER
 * --------------------------------------------------
 */

#header { z-index: 900; }
#drawer { z-index: 800; }
#article { z-index: 0; }
#footer { z-index: 0; }



/* --------------------------------------------------
 * HEADER
 * --------------------------------------------------
 */
#header {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 50px;
	background: #fff;
	text-align: center;
}
	#header_container {
		position: relative;
	}
		#header h1 {
			position: relative;
			text-align: center;
			display: block;
			width: 100%;
			height: 50px;
		}
			#header h1 span,
			#header h1 a {
				display: block;
				height: 50px;
				background-image: url(/mobile/asset/img/header/logo03.png);
				background-repeat: no-repeat;
				background-position: center;
				background-size: 130px auto; text-indent:-10000px;
			}
			/*#header h1 a.type02 {
				background-image: url(../img/header/logo02.png);
			}*/
			
			
			#header h1.newlogo2019 a{background-image: url(/mobile/asset/img/header/logo03.png); background-size: 200px auto;}
			#header h1.newlogo a{background-image: url(/mobile/asset/img/header/logo02.jpg); background-size: 130px auto;}
		/*
		#header_btn_menu {
			position: absolute;
			left: 0;
			top: 0;
			display: block;
			width: 50px;
			height: 50px;
			background-image: url(../img/header/btn_menu.png);
			background-repeat: no-repeat;
			background-size: 50px auto;
		}
		#header_btn_menu.focus {
			background-image: url(../img/header/btn_menu_on.png);
		}
		*/
		#btn_menu {
			position: absolute;
			left: 0;
			top: 0;
			display: block;
			width: 50px;
			height: 50px;
		}
			#btn_menu_container {
				position: relative;
			}
				.btn_menu_item {
					position: absolute;
					left: 0;
					top: 0;
					display: block;
					width: 50px;
					height: 50px;
					background-repeat: no-repeat;
					background-size: 50px auto;
				}
				#btn_menu_item01 { background-image: url(../img/header/btn_menu_top.png); }
				#btn_menu_item02 { background-image: url(../img/header/btn_menu_bottom.png); }
				#btn_menu_item03 { background-image: url(../img/header/btn_menu_middle.png); }
				#btn_menu_item04 { display: none; background-image: url(../img/header/btn_menu_middle.png); }



/* --------------------------------------------------
 * DRAWER
 * --------------------------------------------------
 */
#drawer {
	position: absolute;
	left: 0;
	/*top: 50px;*/
	display: none;
	width: 100%;
	background: #fff;
}
	#drawer_container {
		position: relative;
	}
		/* first node */
		#drawer .first_node {
			position: relative;
			z-index: 802;
			border-bottom: 1px solid #f3f3f3;
		}
			#drawer .first_node > li {
				/*padding: 0 10px;*/
				border-top: 1px solid #f3f3f3;
			}
				#drawer .first_node > li > a {
					display: table;
					width: 100%;
					color: #202020;
					-webkit-tap-highlight-color: #fff;
				}
				#drawer .first_node > li > a.focus {
					font-weight: bold;
					background-color: #000;
					color: #fff;
				}
					#drawer .first_node > li > a > span {
						display: table-cell;
						height: 42px;
						font-size: 13px;
						text-align: center;
						vertical-align: middle;
					}



/* --------------------------------------------------
 * ARTICLE
 * --------------------------------------------------
 */
#article {
	position: relative;
	width: 100%;
	padding-top: 50px;
}
	
	/*
	 * TITLE
	 */
	.article_title {
		padding-top: 30px;
	}
		.article_title .ttl {
			padding-top: 18px;
			padding-bottom: 16px;
			background-image: url(../img/article_border_red.png);
			background-repeat: no-repeat;
			background-position: center top;
			background-size: 30px auto;
		}
			.article_title .ttl .cn {
				display: block;
				font-size: 19px;
				font-weight: bold;
				letter-spacing: 0.25em;
				text-align: center;
			}
			.article_title .ttl .en {
				display: block;
				font-size: 13px;
				font-weight: normal;
				letter-spacing: 0.12em;
				text-align: center;
			}

	/*
	 * CONTENT
	 */
	.article_content {
		
	}



/* --------------------------------------------------
 * VIDEO
 * --------------------------------------------------
 */
#video {
	position: fixed;
	left: 0;
	top: 0;
	z-index: 90000;
	display: none;
	width: 100%;
}
	#video_container {
		position: relative;
		width: 100%;
	}
		/* close */
		#video_close {
			position: absolute;
			right: 10px;
			top: 10px;
			z-index: 90002;
			display: block;
			width: 40px;
			height: 40px;
			background-image: url(../img/btn_close_wht.png);
			background-repeat: no-repeat;
			background-size: 40px auto;
		}
		/* content */
		#video_content {
			position: absolute;
			left: 0;
			top: 0;
			z-index: 90002;
			box-sizing: border-box;
			-moz-box-sizing: border-box;
			-webkit-box-sizing: border-box;
			width: 100%;
			padding: 0 20px;
		}
		/* bg */
		#video_bg {
			position: relative;
			z-index: 90001;
			width: 100%;
			background: rgba(0,0,0,0.9);
		}



/* --------------------------------------------------
 * FOOTER
 * --------------------------------------------------
 */
#footer {
	position: relative;
	width: 100%;
}
	
	/*
	 * PAGETOP
	 */
	#footer .pagetop {
		padding:  10px 0;
	}
		#footer .pagetop a {
			display: table;
			margin: 0 auto;
			padding: 0 20px;
		}
			#footer .pagetop a span {
				display: table-cell;
				height: 40px;
				padding-left: 20px;
				background-image: url(../img/btn_pagetop_blk.png);
				background-repeat: no-repeat;
				background-position: left;
				background-size: 14px auto;
				font-size: 11px;
				font-weight: bold;
				color: #202020;
				vertical-align: middle;
			}
	/* black */
	#footer .pagetop.blk {
		background-color: #000;
	}
		#footer .pagetop.blk a {
		}
			#footer .pagetop.blk a span {
				background-image: url(../img/btn_pagetop_wht.png);
				color: #fff;
			}
	
	/*
	 * LINKS
	 */
	#footer_links {
		border-top: 1px solid #e2e2e2;
	}
		#footer_links li {
			display: table;
			width: 100%;
			border-bottom: 1px solid #e2e2e2;
		}
			#footer_links li a {
				display: table-cell;
				height: 40px;
				font-size: 11px;
				color: #202020;
				text-align: center;
				vertical-align: middle;
			}
		#footer_links li.focus {

		}
			#footer_links li.focus a {
				background-color: #000;
				font-weight: bold;
				color: #fff;
			}
	
	/*
	 * OFFICIAL
	 */
	#footer_official {
		padding-top: 18px;
		border-top: 1px solid #e2e2e2;
	}
		#footer_official dt {
			height: 15px;
			background-image: url(../img/official/ttl.png);
			background-repeat: no-repeat;
			background-position: center;
			background-size: 150px auto;
			text-align: center;
		}
		#footer_official dd {
			padding: 16px 0;
		}
			#footer_official dd ul {
				display: table;
				width: 100%;
			}
				#footer_official dd li {
					display: table-cell;
					width: 50%;
					border-left: 1px solid #e2e2e2;
					text-align: center;
				}
				#footer_official dd li:first-child {
					border-left: none;
				}
					#footer_official dd li a {
						display: table;
						margin: 0 auto;
					}
						#footer_official dd li a span {
							display: table-cell;
							height: 30px;
							padding-left: 36px;
							background-repeat: no-repeat;
							background-position: left;
							background-size: 30px auto;
							font-size: 12px;
							font-weight: bold;
							color: #202020;
							vertical-align: middle;
						}
						#footer_official dd li#footer_official_01 a span {
							background-image: url(../img/official/icon_01.png);
						}
						#footer_official dd li#footer_official_02 a span {
							background-image: url(../img/official/icon_02.png);
						}
	
	/*
	 * SNS
	 */
	#footer_sns {
		border-top: 1px solid #e2e2e2;
	}
		#footer_sns dt {
			padding-top: 18px;
			font-size: 14px;
			font-weight: bold;
			text-align: center;
		}
		#footer_sns dd {
			padding: 12px 0 20px 0;
		}
			#footer_sns dd ul {
				display: table;
				margin: 0 auto;
			}
				#footer_sns dd li {
					display: table-cell;
					padding: 0 10px;
				}
	
	/*
	 * BANNER
	 */
	#footer_banners {
		
	}
		#footer_banners ul {
			display: table;
			width: 100%;
			padding: 10px 0;
			border-top: 1px solid #e2e2e2;
		}
			#footer_banners li {
				display: table-cell;
				width: 50%;
				border-left: 1px solid #e2e2e2;
				text-align: center;
			}
			#footer_banners li:first-child {
				border-left: none;
			}
			#footer_banners li.full {
				width: 100%;
			}
	
	/*
	 * BOTTOM
	 */
	#footer_bottom {
		background-color: #000;
	}
		/* contact */
		#footer_contact {
			padding: 15px;
		}
			#footer_contact dl {
				margin-top: 9px;
				font-size: 9px;
				color: #fff;
				line-height: 2.0;
			}
			#footer_contact dl a{
				color: #fff;
			}
			#footer_contact dl:first-child {
				margin-top: 0;
			}
				#footer_contact dt {
					font-weight: bold;
				}
				#footer_contact dd {

				}
					#footer_contact dd a {
						color: #fff;
					}
		/* menu */
		#footer_menu {
			border-top: 1px solid #1b1b1b;
		}
			#footer_menu ul {
				display: table;
				margin: 0 auto;
			}
				#footer_menu li {
					display: table-cell;
				}
				#footer_menu li a {
					display: block;
					padding: 15px 18px;
					font-size: 12px;
					color: #747474;
				}
		/* copyright */
		#footer small {
			display: block;
			padding: 15px;
			border-top: 1px solid #1b1b1b;
			font-size: 7px;
			color: #747474;
			line-height: 2.0;
		}


/*全网站跟随nav*/
.follow_nav{width:40px; position:fixed; bottom:30px; right:0; z-index:1000000;}
.follow_nav a{display:block; width:100%; height:40px; margin-bottom:2px; text-align:center; line-height:50px;}
.follow_nav a img{width:100%;}





/********************导航改版*********20190724******************/
#drawer{height:100%; overflow:hidden; overflow-y:scroll;}
#drawer .level_1 li{width:100%; font-size:13px; padding-left:5%; box-sizing:border-box;}
#drawer .level_1 li a{display:block; width:100%; line-height:42px; color:#202020; -webkit-tap-highlight-color:#fff;}

#drawer .level_2 li a{color:#666; line-height:26px;}
#drawer .level_3 li a{color:#999;}

#drawer .level_2,
#drawer .level_3{display:none;}

#drawer li.menu_btn{border-top: 1px solid #f3f3f3;}

#drawer .txt1{width:100%; position:relative;}
#drawer .txt1 span{display:block; width:12px; height:12px; position:absolute; top:15px; right:5%; z-index:2;}
#drawer .txt1 span img{display:block; width:100%;}

#drawer .level_2 .txt2{width:100%; position:relative;}
#drawer .level_2 .txt2 span{display:block; width:10px; height:10px; position:absolute; top:9px; right:5.5%; z-index:2;}
#drawer .level_2 .txt2 span img{display:block; width:100%;}

#drawer .level_3 .txt3{width:100%; position:relative;}
#drawer .level_3 .txt3 span{display:block; width:10px; height:10px; position:absolute; top:9px; right:5.5%; z-index:2;}
#drawer .level_3 .txt3 span img{display:block; width:100%;}


#drawer .txt1 span .rote,
#drawer .level_2 .txt2 span .rote,
#drawer .level_3 .txt3 span .rote{
transition:transform 1s;
}

#drawer .txt1 span .rote,
#drawer .level_2 .txt2 span .rote,
#drawer .level_3 .txt3 span .rote{
position:absolute; left:0; top:0;
transform: rotate(0deg);
-webkit-transform: rotate(0deg);
}

#drawer li.on .txt1 span .rote,
#drawer li.on .txt2 span .rote.rotein,
#drawer li.on .txt3 span .rote.rotein2{
transform: rotate(90deg);
-webkit-transform: rotate(90deg);
}