@charset "utf-8";
/* ------------------------------
 見出し&テキスト
------------------------------ */
/* -- TOP H1 -- */
.contentsHome h1 {
	font-size: 2.4rem;
	font-weight: bold;
	margin-bottom: 25px;
}

/* -- TOP H2 -- */
.contentsHome h2 {
	font-size: 3.4rem;
	font-weight: bold;
	line-height: 1.4;
	text-align: center;
	margin-bottom: 30px;
	padding-bottom: 0;
	padding-top: 20px;
	border-bottom: none;
	position: relative;
}
.contentsHome h2 span {
	font-family: 'Montserrat', sans-serif;
	font-size: 1.5rem;
	font-weight: normal;
	color: #828A91;
	display: block;
}
.contentsHome h2::before {
	content: "";
	display: block;
	width: 40px;
	height: 3px;
	background: #337AC4;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	margin: auto;
}

/* -- H1 -- */
.headering h1,
.headering p {
	font-size: 2.6rem;
	font-weight: bold;
	line-height: 1.4;
	text-align: center;
	color: #fff;
	position: relative;
	z-index: 2;
}
.headering h1 span,
.headering p span {
	font-size: 1.6rem;
	display: block;
}

/* -- H2 -- */
h2 {
	font-size: 2.4rem;
	font-weight: bold;
	border-bottom: solid 3px #CDD6DD;
	padding-bottom: 15px;
	margin-bottom: 50px;
}

/* -- H3 -- */
h3 {
	font-size: 2rem;
	font-weight: bold;
	line-height: 1.3;
	margin-bottom: 25px;
}
.lineL-h3 h3 {
	padding-left: 18px;
	border-left: solid 6px #337AC4;
}

/* -- H4 -- */
h4 {
	font-size: 1.6rem;
	font-weight: bold;
	line-height: 1.3;
	padding-left: 15px;
	margin-bottom: 10px;
	position: relative;
}
h4::before {
	content: "";
	font-size: 70%;
	background:#337AC4;
	position: absolute;
	top: 5px;
	left: 0;
	width: 9px;
	height: 9px;
	border-radius: 100%;
}

/* -- メインリード -- */
.mainLead {
	font-size: 2.2rem;
	font-weight: bold;
	line-height: 1.4;
	margin-bottom: 20px;
}

/* ------------------------------
 スマホ用コード（見出し）
------------------------------ */
@media screen and (max-width: 767px) {
	/* -- TOP H1 -- */
	.contentsHome h1 {
		font-size: 2rem;
		margin-bottom: 15px;
	}
	/* -- TOP H2 -- */
	.contentsHome h2 {
		font-size: 2.2rem;
		margin-bottom: 20px;
	}
	.contentsHome h2 span {
		font-size: 1rem;
	}
	

	/* -- H1 -- */
	.headering h1,
	.headering p {
		font-size: 2.2rem;
	}
	.headering h1 span,
	.headering p span {
		font-size: 1.5rem;
	}
	/* -- H2 -- */
	h2 {
		font-size: 2rem;
		padding-bottom: 10px;
		margin-bottom: 20px;
		border-bottom-width: 2px;
	}
	/* -- H3 -- */
	h3 {
		font-size: 1.7rem;
		margin-bottom: 10px;
	}
	
	/* -- メインリード -- */
	.mainLead {
		font-size: 2rem;
	}
}

/* ------------------------------
 ボックス
------------------------------ */
/* -- 横並びボックス（flexbox） --- */
.flexBox {
	display: flex !important;
	flex-flow: row wrap;
}
.flexBox::after {
	display: none;
}
.flexBox > * {
	width: 100%;
}
/* -- 横並びボックス（flexbox） センター揃え --- */
.flexBox.fb-tac {
	justify-content: center;
}
/* -- 横並びボックス（flexbox） 縦センター揃え --- */
.flexBox.fb-vac {
	align-items: center;
}
/* -- 横並びボックス（flexbox） 左右別れ --- */
.flexBox.fb-btw {
	justify-content: space-between;
}
/* ------------------------------
 横幅グリッド PC用限定CSS
------------------------------ */
@media print, screen and (min-width: 768px) {
	.w49p {
		width: 49%;
	}
	
	/* -- 1/2 --- */
	.w546,
	.w1-2 {
		width: 546px;
	}
	.cms_fl.w546,
	.cms_fl.w1-2,
	.fl.w546,
	.fl.w1-2 {
		margin-right: 48px;
	}
	.cms_fr.w546,
	.cms_fr.w1-2,
	.fr.w546,
	.fr.w1-2 {
		margin-left: 0;
	}

	/* -- 1/3 --- */
	.w350,
	.w1-3 {
	    width: 350px;
	}
	/* -- 2/3 --- */
	.w745,
	.w2-3 {
	    width: 745px;
	}
	.cms_fl.w350,
	.cms_fl.w1-3,
	.fl.w350,
	.fl.w1-3,
	.cms_fl.w745,
	.cms_fl.w2-3,
	.fl.w745,
	.fl.w2-3 {
		margin-right: 45px;
	}
	.cms_fr.w350,
	.cms_fr.w1-3,
	.fr.w350,
	.fr.w1-3,
	.cms_fr.w745,
	.cms_fr.w2-3,
	.fr.w745,
	.fr.w2-3 {
		margin-left: 45px;
	}

	/* -- 1/4 --- */
	.w258,
	.w1-4 {
		width: 258px;
	}
	/* -- 3/4 --- */
	.w846,
	.w3-4 {
		width: 846px;
	}
	.cms_fl.w258,
	.cms_fl.w1-4,
	.fl.w258,
	.fl.w1-4,
	.cms_fl.w846,
	.cms_fl.w3-4,
	.fl.w846,
	.fl.w3-4 {
		margin-right: 36px;
	}
	.cms_fr.w258,
	.cms_fr.w1-4,
	.fr.w258,
	.fr.w1-4,
	.cms_fr.w846,
	.cms_fr.w3-4,
	.fr.w846,
	.fr.w3-4 {
		margin-left: 36px;
	}

	/* -- 1/5 --- */
	.w208,
	.w1-5 {
		width: 208px;
	}
	.w4-5 {
		width: 907px;
	}
	.cms_fl.w208,
	.cms_fl.w1-5,
	.fl.w208,
	.fl.w1-5 {
		margin-right: 25px;
	}
	.cms_fr.w208,
	.cms_fr.w1-5,
	.fr.w208,
	.fr.w1-5 {
		margin-left: 25px;
	}

	
	/* -- サイドあり ボックス幅 -- */
	/* 1/2 */
	.mainContents .w1-2 {
		width: 403px;
	}
	.mainContents .cms_fl.w1-2,
	.mainContents .fl.w1-2 {
		margin-right: 40px;
	}
	.mainContents .cms_fr.w1-2,
	.mainContents .fr.w1-2 {
		margin-left: 40px;
	}
	/* 1/3 */
	.mainContents .w1-3 {
		width: 258px;
	}
	.mainContents .cms_fl.w1-3,
	.mainContents .fl.w1-3 {
		margin-right: 36px;
	}
	.mainContents .cms_fr.w1-3,
	.mainContents .fr.w1-3 {
		margin-left: 36px;
	}
	
	/* 2/3 */
	.mainContents .w2-3 {
		width: 552px;
	}
	.mainContents .cms_fl.w2-3,
	.mainContents .fl.w2-3 {
		margin-right: 35px;
	}
	.mainContents .cms_fr.w2-3,
	.mainContents .fr.w2-3 {
		margin-left: 35px;
	}
	
	/* flexbox 1/3 */
	.mainContents .flexBox .w1-3:not(:nth-child(3n)) {
		margin-right: 36px;
	}
	/* flexbox 1/2 */
	.mainContents .flexBox .w1-2:not(:nth-child(2n)) {
		margin-right: 40px;
	}

	/* cms_block */
	.cms_block {
		width: 1140px;
	}
	.mainContents .cms_block,
	.wide.cms_block {
		width: 100%;
	}
	.wide.cms_block > * {
		width: 1140px;
		margin-left: auto;
		margin-right: auto;
	}

	/* -- その他 --- */
	.w195 {
		width: 195px;
	}

	/* -- 横並びボックス（flexbox） --- */
	/* flexbox 1/3 */
	.flexBox .w1-3:not(:nth-child(3n)) {
		margin-right: 45px;
	}
	/* flexbox 1/4 */
	.flexBox .w1-4:not(:nth-child(4n)) {
		margin-right: 36px;
	}
	/* flexbox 1/5 */
	.flexBox .w1-5:not(:nth-child(5n)) {
		margin-right: 25px;
	}
	/* flexbox 1/2 */
	.flexBox .w1-2:not(:nth-child(2n)) {
		margin-right: 48px;
	}
	
	.flexBox .cms_text:last-child,
	.flexBox .cms_image:last-child {
		margin-bottom: 40px;
	}

	/* flexbox 順番 */
	.order1 {
		order: 1;
	}
	.order2 {
		order: 2;
	}
	
	/* flexbox 上下分け */
	.mHeight {
		display: flex;
		flex-flow: column;
		justify-content: space-between;
	}
}
/* ------------------------------
 スマホ用コード
------------------------------ */
@media screen and (max-width: 767px) {
	/* -- 横並びボックス（flexbox） --- */
	/* -- 1/4 --- */
	/* -- 1/5 --- */
	.w1-4,
	.w258,
	.w1-5,
	.w208 {
		width: 49%;
	}
	.w1-4.fl,
	.w258.fl,
	.w1-5.fl,
	.w208.fl,
	.w258.cms_fl,
	.w208.cms_fl {
		float: left !important;
		margin-right: 2%;
	}
	.w1-4.fr,
	.w258.fr,
	.w1-5.fr,
	.w208.fr,
	.w258.cms_fr,
	.w208.cms_fr {
		float: right !important;
	}
	
	/* flexbox 1/4 */
	/* flexbox 1/5 */
	.flexBox .w1-4:not(:nth-child(2n)),
	.flexBox .w1-5:not(:nth-child(2n)) {
		margin-right: 2%;
	}
	
	/* -- 横幅100％ --- */
	.sp100 .w1-4,
	.sp100 .w1-5,
	.sp100 .w258,
	.sp100.w258,
	.w1-4.sp100,
	.w1-5.sp100 {
		width: 100%;
		margin-right: 0 !important;
		float: none !important;
	}
	
	/* -- その他 --- */
	.cms_block {
		margin-left: 5%;
		margin-right: 5%;
	}
}
/* ------------------------------
 横幅グリッド PC用限定CSS
------------------------------ */
@media print, screen and (min-width: 768px) {
	.scroller .mCSB_draggerContainer {
		display: none !important;
	}
	/* 横スクロールがつく */
	.scroller {
		width: auto !important;
		overflow: auto !important;
	}
	.scroller table {
		width: 1140px !important;
	}
	.mainContents .scroller table {
		width: 846px !important;
	}
}
/* ------------------------------
 テーブル
------------------------------ */
/* デフォルト */
table {
	width: 100%;
	border-top: 1px solid #D9DCDE;
	border-right: 1px solid #D9DCDE;
}
table th,
table td {
	font-size: 1.5rem;
	padding: 14px 20px;
	text-align: left;
	vertical-align: middle;
	border-bottom: 1px solid #D9DCDE;
	border-left: 1px solid #D9DCDE;
}
table th {
	font-weight: bold;
	background: #eff4f7;
}
table thead th {
	padding-top: 10px;
	padding-bottom: 10px;
	font-weight: 500;
	text-align: center;
}
.td-tac table td {
	text-align: center;
}


/* 左右線無テーブル */
.linetb table {
	border-right: none;
	border-top: dotted 1px #D9DCDE;
}
.linetb.notop table {
	border-top: none;
}
.linetb table th,
.linetb table td {
	font-size: 1.6rem;
	padding: 22px 10px;
	vertical-align: top;
	border-left: none;
	border-bottom: dotted 1px #D9DCDE;
}
.linetb table th {
	background: none;
}
.linetb table tr > *:first-child {
	width: 21%;
}
.linetb table thead th {
	padding: 22px 0;
}
.colorBg .linetb table {
	border-top-color: #828a91;
}
.colorBg .linetb table th,
.colorBg .linetb table td {
	border-bottom-color: #828a91;
}
/* ------------------------------
 スマホ用コード（テーブル）
------------------------------ */
@media screen and (max-width: 767px) {
	table th,
	table td {
		padding: 15px;
	}
	/* 左右線無テーブル */
	.linetb table th,
	.linetb table td {
		padding: 15px 5px;
	}
	.linetb table thead th {
		padding: 15px 5px;
	}

	/* 横スクロールがつく */
	.scroller {
		width: 100% !important;
    	overflow: auto !important;
    	padding-left: 0em;
    	padding-right: 0em;
	}
	.scroller .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
		background: #337AC4;
	}
	.scroller table {
		width: 1000px !important;
	}
	.scroller table th,
	.scroller table td {
		padding: 7px;
	}
	.mainContents .scroller table {
		width: 846px !important;
	}
	.scroller .mCSB_horizontal.mCSB_inside > .mCSB_container {
		margin-bottom: 0;
	}
	
	/* レスポンシブ */
	.res table th {
		width: auto !important;
		display: block;
		padding: 10px;
		border-bottom: none;
	}
	
	.res table td {
		width: auto !important;
		display: block;
		padding: 10px;
	}

	.res.linetb table th,
	.res.linetb table tbody tr > td:first-child {
		border-bottom: none !important;
	}
	.res.linetb table th {
		padding-bottom: 0;
	}
}


/* ------------------------------
 線
------------------------------ */
.borderBox {
	border: solid 1px #E1E6EB;
}
.borderTop {
	border-top: dotted 1px #D9DCDE;
	padding-top: 30px;
}

/* ------------------------------
 スマホ用コード
------------------------------ */
@media screen and (max-width: 767px) {
	
}

/* ------------------------------
 背景色
------------------------------ */
.colorBg {
	padding: 30px;
	background: #EEF0F2;
}
.wide.colorBg {
	padding-left: 0;
	padding-right: 0;
}

/* ------------------------------
 リスト
------------------------------ */
/*  ノーマルリスト */
.list ul li {
	line-height: 1.5;
	padding: 0 0 0 11px;
	position: relative;
	border: none;
}
.list ul li:not(:last-child) {
	margin-bottom: 5px;
}
.list ul li::before {
	content: "";
	width: 6px;
	height: 6px;
	border-radius: 100%;
	background: #333;
	vertical-align: top; 
	position: absolute;
	top: .5em;
	left: 0;
}
.checklist ul li .list ul li::after {
	display: none;
}

/* 横並びリスト */
.inline ul {
	display: flex;
	flex-flow: row wrap;
}
.inline.list-tac ul {
	justify-content: center;
}
.inline ul li:not(:last-child) {
	margin-right: 15px;
}

/* 数字リスト */
ol li {
	list-style-type:none;
	list-style-position:inside;
	counter-increment: cnt;
	padding-left: 1.5em;
	position: relative;
}
ol li:before {
	content: counter(cnt)".";
	margin-right: 10px;
	position: absolute;
	top: 0;
	left: 0;
}
/* 注釈リスト */
.notes ol li {
	padding-left: 2.5em;
}
.notes ol li:before {
	content: "*"counter(cnt);
}

/* ------------------------------
 アイコン
------------------------------ */
.noicon::after {
	display: none !important;
}
.icon-tel {
	line-height: 1.4;
}
.icon-tel::before {
	content: "";
	width: 34px;
	height: 34px;
	display: inline-block;
	margin-right: 5px;
	margin-bottom: -3px;
	background: url(https://www.yamaha.com.cn/yamahafinetech/shared/img/icon_tel.png) no-repeat 0 0 / cover;	
}
/* ------------------------------
 お問合せ
------------------------------ */
/* -- MAIL -- */
.contact_mailBox {
	color: #fff;
	text-align: center;
	padding: 25px;
	border-radius: 6px;
	background: #f57c00 url(https://www.yamaha.com.cn/yamahafinetech/shared/img/mailbox_bg.png) no-repeat right center;
}
.contact_mailBox ul li::before {
	background-color: #fff;
}
.contact_mailBox .imgBox {
	height: 80px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 15px;
}
.contact_mailBox.btn-r a {
	color: #337AC4;
	padding: 9px 30px 9px 15px;
	background: #fff;
	min-width: 220px;
}
.contact_mailBox.btn-r a::after {
	content: '\f105';
	font-size: 2rem;
	color: #337AC4;
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}
.contact_mailBox.btn-r a[target="_blank"]::after {
	background: none;
}
.contact_mailBox.btn-r a:focus,
.contact_mailBox.btn-r a:hover {
	background: #337AC4;
	color: #fff;
}
.contact_mailBox.btn-r a:focus::after,
.contact_mailBox.btn-r a:hover::after {
	color: #fff;
}
/* -- TEL -- */
.contact_telBox {
	padding: 30px;
	border-radius: 6px;
	background: #eef0f2 url(https://www.yamaha.com.cn/yamahafinetech/shared/img/telbox_bg.png) no-repeat center center;
}
/* ------------------------------
 スマホ用コード
------------------------------ */
@media screen and (max-width: 767px) {
	/* -- TEL -- */
	.contact_telBox {
		padding: 20px;
	}
}
/* ------------------------------
 ボタン
------------------------------ */
/* ノーマル */
.btn a {
	font-size: 1.7rem;
	font-weight: bold;
	overflow: hidden;
	text-align: center;
	color: #fff;
	text-decoration: none;
	background: #337AC4;
	padding: 10px 25px;
	min-width: 258px;
	display: inline-block;
	vertical-align: bottom;
	position: relative;
	z-index: 2;
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}
.btn a::after,
.btn-r a::after,
.cms_block .cms_link.btn a:not(.cms_blank)::after,
.cms_block .cms_link.btn-r a:not(.cms_blank)::after {
	content: '\f105';
	font-family: 'FontAwesome';
	font-weight: normal !important;
	font-size: 3rem;
	height: 18px;
	line-height: .5;
	color: #fff;
	position: absolute;
	top: 0;
	bottom: 0;
	right: 15px;
	margin: auto;
}
.btn a:focus,
.btn a:hover,
.btn-black a:focus,
.btn-black a:hover,
.btn-purple a:focus,
.btn-purple a:hover {
	opacity: .7;
}
.btn a[target="_blank"]:after,
.btn-r a[target="_blank"]:after {
	background: url(https://www.yamaha.com.cn/wm/img/icon/blank_w.png) no-repeat 0 0 / cover;
}

/* お問合せ */
/* ダウンロード */
.btn-black a {
	font-size: 1.7rem;
	font-weight: bold;
	text-decoration: none;
	overflow: hidden;
	text-align: center;
	color: #fff;
	padding: 12px;
	min-width: 350px;
	background: #333;
	display: inline-block;
	position: relative;
}
.btn-black.contact a::before,
.btn-orange.contact a::before,
.btn-black.dl a::before {
	content: '';
	display: inline-block;
	margin-right: 10px;
}
.btn-black.contact a::before,
.btn-orange.contact a::before {
	width: 18px;
	height: 14px;
	background: url(https://www.yamaha.com.cn/yamahafinetech/shared/img/icon_mail.png) no-repeat 0 0 / cover;
}
.btn-black.dl a::before {
	width: 18px;
	height: 13px;
	background: url(https://www.yamaha.com.cn/yamahafinetech/shared/img/icon_dl.png) no-repeat 0 0 / cover;
}
.btn-black a.cms_blank::after,
.btn-black a[target="_blank"]:after,
.btn-black.cms_link a::after,
.btn-orange a.cms_blank::after,
.btn-orange a[target="_blank"]:after,
.btn-orange.cms_link a::after,
.btn.btn-purple a::after,
.btn-purple a.cms_blank::after,
.btn-purplea[target="_blank"]:after,
.btn-purple.cms_link a::after {
	display: none;
}

/* 角Rボタン */
.btn-r a,
.btn-orange a {
	font-size: 1.7rem;
	font-weight: bold;
	text-decoration: none;
	overflow: hidden;
	text-align: center;
	color: #fff;
	min-width: 350px;
	border-radius: 40px;
	display: inline-block;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
	position: relative;
	z-index: 2;
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}
.btn-r a {
	padding: 12px 30px 12px 15px;
	background: #337AC4;
}
/* お問合せ 角Rオレンジ */
.btn-orange a {
	padding: 12px;
	background: #f67c01;
}
.btn-r a:focus,
.btn-r a:hover {
	background: #00349d;
}
.btn-orange a:focus,
.btn-orange a:hover {
	background: #ed5500;
}
/* 紫グラデボタン */
.btn-purple a {
	font-size: 1.8rem;
	font-weight: bold;
	text-decoration: none;
	overflow: hidden;
	text-align: center;
	color: #fff;
	padding: 12px;
	min-width: 350px;
	background: linear-gradient(90deg, #5500cc 0%, #9000cc 100%);
	display: inline-block;
	position: relative;
}
/* 大きいボタン */
.big a {
	font-size: 2.4rem;
	min-width: 457px;
	padding: 15px;
}
/* 横並びボタン */
.inline-btn {
	display: flex;
	justify-content: center;
	flex-flow: row wrap;
	text-align: center;
}
.inline-btn p + p {
	margin-top: 0;
}
/* ------------------------------
 PC用限定CSS
------------------------------ */
@media print, screen and (min-width: 768px) {
	.inline-btn .w1-3  {
		margin-right: 45px;
	}
	.inline-btn .w1-3 a {
		min-width: 350px;
	}
	
	.mainContents .inline-btn .w1-4 {
		margin-right: 36px;
	}
	.mainContents .inline-btn .w1-4 a {
		min-width: 258px;
	}
}

/* ------------------------------
 スマホ用コード
------------------------------ */
@media screen and (max-width: 767px) {
	.btn a,
	.btn-black a,
	.btn-r a,
	.btn-orange a,
	.btn-purple a {
		font-size: 1.6rem;
		min-width: 270px;
	}
	.inline-btn .w1-4 {
		width: 100%;
	}
	.inline-btn .w1-3:not(:last-child),
	.inline-btn .w1-4:not(:last-child) {
		margin-bottom: 10px;
	}
	/* 紫グラデボタン */
	.btn-purple a {
		width: 100%;
	}
}
/* ------------------------------
 スマホ用コード
------------------------------ */
@media screen and (max-width: 320px) {
	.colorBg.btn-black a,
	.colorBg .btn-black a {
		min-width: 230px;
	}
}
/* ------------------------------
 youtube埋め込み
------------------------------ */
/* .movie {
	position: relative;
	width: 100%;
}
.movie:before {
	content:"";
	display: block;
	padding-top: 56.25%;
}
.movie iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
} */
