@charset "UTF-8";
/* CSS Document */
@import url("css-smacss/style-base.css");
@import url("css-smacss/style-layout.css");
@import url("css-smacss/style-module.css");
@import url("css-smacss/style-theme.css");
@import url("css-smacss/style-state.css");

/****************************************************
** レスポンシブデザイン用メディアクエリ（モバイルファースト
****************************************************/

body {
	margin: 0;
	font-family: Hiragino Kaku Gothic ProN, ヒラギノ角ゴ ProN, Hiragino Kaku Gothic Pro, ヒラギノ角ゴ Pro, "メイリオ", "Meiryo", "verdana", sans-serif;
	text-align: center;
}

/************************FAQページ************************/
#container {
	width: 100%;
}
h1 {
	font-size: 25px;
	font-weight: bold;
	padding: 50px 0;
}
.faqMenu {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	width: 90%;
	margin: 0 auto 50px;
}
.faqMenu a {
	width: 100%;
	text-decoration: none;
	color: #000;
}
.faqMenu a:visited {
	color: #000;
}
.faqMenu a li {
	background: repeating-linear-gradient(-45deg, #e6e8e3, #e6e8e3 5px, #fff 5px, #fff 10px);
	font-weight: bold;
	margin: 0 0 30px;
	padding: 20px 0;
	border-radius: 40px;
}
.faqMenu a li span {
	font-size: 18px;
}

/*768px以上*/
@media screen and (min-width: 768px) {
	h1 {
		font-size: 35px;
		padding: 75px 0;
	}
	.faqMenu {
		width: 90%;
		margin: 0 auto 50px;
	}
	.faqMenu a {
		width: 48%;
	}
	.faqMenu a li {
		padding: 25px 0;
		border-radius: 55px;
	}
	.faqMenu a li span {
		font-size: 18px;
	}
}

/*1023px以上*/
@media screen and (min-width: 1024px) {
	h1 {
		font-size: 40px;
		padding: 75px 0;
	}
	#container {
		width: 890px;
		margin: 0 auto;
	}
	.faqMenu {
		width: 90%;
		margin: 0 auto 50px;
	}
	.faqMenu a li span {
		font-size: 20px;
	}
}
/************************FAQページ************************/


/************************タリーズギターオンラインについて************************/
.header {
	background: repeating-linear-gradient(-45deg, #e6e8e3, #e6e8e3 5px, #fff 5px, #fff 10px);
	margin: 0 0 50px;
}
.header h1 {
	width: 90%;
	margin: 0 auto;
}
.accodionBox {
	width: 90%;
	margin: 0 auto 10px;
}
.accodionBox .accodionBtn {
	color: #000;
	cursor: pointer; 
	border: none;
	position: relative;
	width: 100%;
	margin: 0 0 10px;
	padding: 15px;
	min-height: 70px;
}
.accodionBox:nth-child(odd) .accodionBtn {
	background: #E0E2DB;
}
.accodionBox:nth-child(even) .accodionBtn {
	background: #EEEFEB;
}
.accodionBox .accodionBtn h2 {
	width: 90%;
	font-size: 14px;
	text-align: left;
}
.accodionBox .accodionBtn .arrow {
	position: absolute;
	top: 15%;
	right: 3%;
	width: 15%;
	height: 70%;
	background-color: #FFF;
}
.accodionBox .accodionBtn .arrow:after {
	content: "";
	position: absolute;
	right: 32%;
	top: 25%;
	z-index: 100;
	-webkit-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
	display: block;
	width: 28%;
	height: 28%;
	border-top: solid 5px #6C5135;
	border-right: solid 5px #6C5135;
	-webkit-transform: rotate(135deg);
	transform: rotate(135deg);
}
.accodionBox .accodionBtn.open .arrow:after {
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
	top: 40%;
}
.accodionBox .panel {
	text-align: left;
	padding: 15px;
	border: solid 1px;
}
/*768px以上*/
@media screen and (min-width: 768px) {
	.header {
		margin: 0 0 75px;
	}
	.header h1 {
		padding: 50px 0;
	}
	.accodionBox {
		margin: 0 auto 15px;
	}
	.accodionBox .accodionBtn {
		width: 100%;
		margin: 0 0 10px;
		padding: 25px;
	}
	.accodionBox .accodionBtn h2 {
		font-size: 18px;
	}
	.accodionBox .accodionBtn .arrow {
		top: 10%;
		right: 1.5%;
		width: 9%;
		height: 80%;
	}
	.accodionBox .accodionBtn .arrow:after {
		right: 30%;
		top: 25%;
		width: 28%;
		height: 28%;
	}
	.accodionBox .panel {
		font-size: 15px;
		padding: 20px;
	}
}

/*1023px以上*/
@media screen and (min-width: 1024px) {
	.header h1 {
		padding: 50px 0;
	}
	.accodionBox {
		width: 800px;
	}
	.accodionBox .accodionBtn {
		width: 100%;
		margin: 0 0 10px;
		padding: 25px;
	}
	.accodionBox .accodionBtn h2 {
		font-size: 19px;
	}
	.accodionBox .accodionBtn .arrow {
		top: 6px;
		right: 8px;
		width: 65px;
		height: 65px;
	}
	.accodionBox .accodionBtn .arrow:after {
		right: 19px;
		top: 15px;
		width: 21px;
		height: 21px;
	}
	.accodionBox .accodionBtn.open .arrow:after {
		top: 27px;
	}
	.accodionBox .panel {
		font-size: 15px;
		padding: 20px;
	}
}
/************************タリーズギターオンラインについて************************/