@charset "utf-8";
/* CSS Document */


ul {
	list-style: none;}
body {
	font-family: 'Noto Sans JP', sans-serif;
	color: #333;
	font-weight: 700;
	font-size:16px;
}	

a {
	text-decoration: none;}

/*--ヘッダー----------------------------------------------*/

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



/*--メイン------------------------------------------------*/

.contact-wrapper {
	padding: 7% 10%;
	font-weight: 400;
	color: #333;
}

/*------コンタクト_ヘッダー--------------------------------------------------*/

.contact-header {
	text-align: center;
	margin-bottom: 80px;}

h1 {
	font-family: 'Kiwi Maru', serif;
	font-weight: normal;
	color: #00a201;
    letter-spacing: 5px;}

.title-ruby {
	color: #333333;
    letter-spacing: 3px;
    font-weight: 300;
    font-size: 1.2em;
    margin: 0 0 40px;}

h2 {
	font-size: 1.2em;
    font-weight: normal;}

.asterisk {
	text-align: left;
    font-size: 0.9em;
	font-weight: 400;
    letter-spacing: 0;
    color: #333333;
	display: inline-block;
	padding-bottom: 40px;
	position: relative;}

.asterisk:before {
  content: '';
  position: absolute;
  left: 50%;
  bottom: -15px;/*線の上下位置*/
  display: inline-block;
  width: 160px;/*線の長さ*/
  height: 3px;/*線の太さ*/
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);/*位置調整*/
  background-color: #00a201;/*線の色*/
  border-radius: 2px;/*線の丸み*/}

/*------フォーム------------------------------------------*/

table {
	width: 100%;
	padding: 0 10%;
}

table p {
	font-size: 1em;
	font-weight: 600;
	color: #333;
}

table th, table td {
	padding: 15px 0;
	font-size: 0.9em;
	font-weight: 600;
	color: #333;
	letter-spacing: 0.1em;
}
	
.item-list {
	font-size: 0.9em;
	letter-spacing: 4px;
	text-align: left;
	width: 35%;
	vertical-align: top;

}

.must {
	background-color: #e53c0f;
    color: white;
    text-align: center;
    padding: 3px 9px;
    border-radius: 5px;
    letter-spacing: 3px;
    margin-right: 10px;
	font-size: 0.9em;
	font-weight: bold;}

.box {
	font-family: inherit;
	width: 100%;
    box-sizing: border-box;
    padding: 8px;
    border-radius: 4px;
    border: 1px solid #ccc;
    appearance: none;
	-webkit-appearance: none;
    -moz-appearance: none;
    }

.box02 {
	font-family: inherit;
    width: 100%;
	box-sizing: border-box;
	height: 150px;
    padding: 8px;
    border-radius: 4px;
    border: 1px solid #ccc;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;}

input::placeholder,
textarea::placeholder {
	font-size: 16px;
	font-weight: 400;
	letter-spacing: 2px;
	color:#999;}
	

.btn-wrapper {
	text-align: center;}

.btn {
	background-color: #00a201;
    color: white;
    letter-spacing: 5px;
    text-align: center;
    padding: 10px 15px;
    width: 30%;
    border-radius: 5px;
	border: none;}

.no-spin::-webkit-inner-spin-button,
.no-spin::-webkit-outer-spin-button {
    -webkit-appearance: none !important;
    margin: 0 !important;
    -moz-appearance:textfield !important;}


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


/*--フッター----------------------------------------------*/

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



/* タブレット向けレイアウト */
@media screen and (max-width: 960px) {
	
	
	.pc { display: none !important; }
	.tab { display: block !important;
			width: 100%;}	
	.sp { display: none !important; }
	.tab-sp { display: inline-block !important; }
	
	
	/*--メイン------------------------------------------------*/

	.contact-wrapper {
		padding: 7% 7%;}
	
	.contact-header {
		margin-top: 60px;}
	
	
	/*------フォーム------------------------------------------*/

	table {
		padding: 0;}
	table th, table td {
		display: block;}
	
	table td {
		padding: 10px 0px 25px;}
	
	.item-list {
	letter-spacing: 2px;
	width: 100%;
	padding: 0;
	
}
	
	.must {
		font-size: 0.7em;}
	
	.contact-form ::placeholder {
		color: #b3b3b3;}
	
	.box {
		background-color: #fcfcfc;}
	
	.box02 {
	/* [disabled]background-color: #fcfcfc; */
}
		
	.btn {
		width: 80%;}

}



/* スマホ向けレイアウト */
@media screen and (max-width: 560px) {
	
	
	.pc { display: none !important; }
	.tab { display: none !important;}	
	.sp { display: block !important;}
	.tab-sp { display: inline-block !important; }
	
	body {
	font-size:16px;
}
	/*--メイン------------------------------------------------*/

	.contact-wrapper {
		padding: 7% 4%;}
	
	.contact-header {
		margin: 80px 0 45px;}
	
	h1 {
		font-size: 1.6em;}
		
	.title-ruby {
		font-size: 1em;
		margin-bottom: 30px;}
	
	h2 {
		font-size: 1em;}
	
	.asterisk {
		font-size: 0.8em;}
	
	/*------フォーム------------------------------------------*/
	

	.btn {
		width: 100%;}

}