@charset "UTF-8";

/*   お問い合わせ（contact.css）   */

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

Main

------------------------------------------------- */
#Main {
	width: 100%;
	margin: 120px 0;
	position: relative;
}
@media screen and (max-width: 898px)  {
#Main {
	margin: 80px 0;
}
}


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

Contact（お問い合わせ）

------------------------------------------------- */
.Contact__wrp	{
	max-width: 1200px;
	width: 100%;
	margin: 0 auto;
	padding: 0 2%;
	position: relative;
}

/* 見出し（h2）
================================================== */
.Contact__wrp .h2	{
	text-align: center;
	margin-bottom: 100px;
}
@media screen and (max-width: 768px)  {
.Contact__wrp .h2 img	{
	height: 44px;
}
}
@media screen and (max-width: 480px)  {
.Contact__wrp .h2	{
	margin-bottom: 30px;
}
.Contact__wrp .h2 img	{
	height: 30px;
}
}
	
.Contact__Box	{
}

/* 入力フォーム
================================================== */
form.mail_form	{
 width:100%;
	margin:50px auto 0;
	font-style: normal;
	font-weight:400;
}
form.mail_form dl	{
 width:100%;
 overflow:hidden;
 border-bottom:1px solid #cccccc;
	margin: 0 0 40px;
	display: flex;
	flex-flow: row wrap;
}
form.mail_form dl dt	{
	flex-basis: 300px; 
 text-align:left;
 border-top:1px solid #cccccc;
	padding:40px 0;
	font-weight:normal;
}
form.mail_form dl dd	{
	flex-basis: calc(100% - 300px); 
 border-top:1px solid #cccccc;
	padding:40px 0;
}
form.mail_form dl dt:first-child,
form.mail_form dl dt:first-child+dd	{
 border:none;
 background:none;
	padding:20px 0 40px;
}
form.mail_form input	{
 border:2px solid #cccccc;
 border-radius:5px;
 background:#fafafa;
	height:50px;
	padding:7px 10px 10px 10px;
}
form.mail_form input:focus	{
 box-shadow:0px 0px 5px #cccccc;
	background-color:#ffffff;
	outline:0;
}
form.mail_form ul li	{
 list-style-type:none;
}
form.mail_form textarea#mail_contents_inq {
	width:100%;
 height:200px;
 border:2px solid #cccccc;
 border-radius:5px;
 background:#fafafa;
	padding:7px 10px 10px 10px;
	resize:none;
}
form.mail_form textarea#mail_address	{
	width:100%;
 height:100px;
 border:2px solid #cccccc;
 border-radius:5px;
 background:#fafafa;
	padding:7px 10px 10px 10px;
	resize:none;
}
form.mail_form textarea#mail_contents_inq:focus,
form.mail_form textarea#mail_address:focus	{
 box-shadow:0px 0px 5px #cccccc;
	background-color:#ffffff;
	outline:0;
}
form.mail_form input::-webkit-input-placeholder { /* WebKit, Blink, Edge */
  color:#999999 !important;
		font-size: 1.6rem !important;
		font-weight: normal !important;
}
form.mail_form input:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color:#999999 !important;
		font-size: 1.6rem !important;
		font-weight: normal !important;
}
::placeholder{ /* Others */
	 color:#999999 !important;
		font-size: 1.6rem !important;
		font-weight: normal !important;
}
@media screen and (max-width: 800px)  {
form.mail_form dl	{
 width:auto;
	margin: 0 0 30px;
	flex-flow: column wrap;
}


form.mail_form textarea#mail_contents_inq,
form.mail_form textarea#mail_address	{
 max-width:100%;
}
form.mail_form dl dt	{
	flex-basis: 100%; 
}
form.mail_form dl dd	{
	flex-basis: 100%; 
}
form.mail_form dl dt	{
 width:auto;
	padding:35px 0 10px;
	border-top:none;
	font-weight:500;
}
form.mail_form dl dd	{
 width:auto;
	border-top:none;
	padding:5px 0 0;
}
form.mail_form dl dt:first-child	{
 border:none;
 background:none;
	padding:1px 0 10px;
}
form.mail_form dl dt:first-child+dd	{
 border:none;
 background:none;
	padding:0 0 10px;
}
}
@media screen and (max-width: 480px)  {
form.mail_form input,
form.mail_form textarea#mail_contents_inq,
form.mail_form textarea#mail_address	{
	font-size:1.4rem;
}
form.mail_form input::-webkit-input-placeholder { 
		font-size: 1.4rem !important;
}
form.mail_form input:-ms-input-placeholder {
		font-size: 1.4rem !important;
}
::placeholder{
		font-size: 1.4rem !important;
}
}

/* 送信ボタン
================================================== */
#send_btn[type="submit"]{
 width : auto;
 height : auto;
 padding : 10px 100px;
 vertical-align : middle;
 color : #ffffff;
 background:#005bac;
 border : 1px solid #005bac;
 border-radius : 3px;
	font-style: normal;
 font-weight : 500;
	transition: .3s;
	position:relative;
	font-size: 2rem;
}
#send_btn[type="submit"]:hover{
 cursor : pointer;
 color : #333;
 background:	#fff;
 border : 1px solid #999;
}
#send_btn[type="submit"][disabled] {
 color : #ddd;
 background:#fff;
 border : 1px solid #cccccc;
	cursor:default;	
}
@media screen and (max-width: 768px)  {
#send_btn[type="submit"]{
	font-size: 1.8rem;
}
}
@media screen and (max-width: 480px)  {
#send_btn[type="submit"],
#send_btn[type="submit"][disabled]{
 width :	100%;
 padding : 15px 0px;
	font-size:1.6rem;
}
}


/*  必須/任意
================================================== */
/* 必須項目 */
.Font_Req {
	color:#E40003;
	margin:0 5px 0 0;
	font-weight:500;
}
.Font_Req.waku {
	color:#E40003;
	font-size:12px !important;
	text-align: center;
	padding: 0px 7px;
	border: 1px solid #E40003;
	border-radius: 4px;
}
.Font_Req.waku.blank {
	margin-left: 10px;
}

/* 任意項目 */
.Font_Any	{				
	margin:0 5px 0 0;
	font-weight:500;
}
.Font_Any.waku {
	font-size:12px !important;
	text-align: center;
	padding: 0px 7px;
	border: 1px solid #333333;
	border-radius: 4px;
}
.Font_Any.waku.blank {
	margin-left: 10px;
}

/* inputの幅
================================================== */
.Form_w01 {
	width:240px;
}
.Form_w02,.Form_w03 {
	width:100%;
}
.Form_w04 {
	width:150px;
}
.Form_w05 {
	width:100px;
}
@media screen and (max-width: 768px)  {
.Font_Req {
	font-weight:400;
}
.Form_w02 {
	max-width: 400px;
	width:100%;
}
}
/*@media screen and (max-width: 568px)  {
.Form_w02 {
 max-width:100%;
}
}*/
@media screen and (max-width: 480px)  {
.Font_Req.waku {				/*   必須項目   */
	line-height:1.2rem;
	font-size:1.2rem !important;
	padding: 1px 7px;
	font-weight:500 !important;
}
}


/*  添付ファイル
================================================== */
.attachment {
	margin-bottom: 20px;
}
.attachment label{
 display: inline-block;
 position: relative;
 background: #005bac;
	border:2px solid #005bac;
 color:#fff;
	font-weight: normal;
 font-size: 1.4rem;
 padding: 12px 20px;
 border-radius: 5px;
 /*transition: all 0.3s;*/
}
.attachment label:hover{
 background: #888;
	border:2px solid #888;
 transition: all 0.4s;
	cursor:pointer !important;
}
.attachment label input{
 position: absolute;
 left:0;
 top:0;
 opacity: 0;
 width: 100%;
 height: 100%;
}
.attachment label input:focus{
 box-shadow:0px 0px 5px #888;
	outline:5px;
}

.attachment .filename,
.attachment .filename02,
.attachment .filename03{
	width: 79%;
 border:2px solid #cccccc;
 border-radius:5px;
 background:#fafafa;
	height:50px;
	padding:10px 10px 10px 20px;
	display: inline-block;
	margin: 0 5px 0 0;
	color: #999999;
}

@media screen and (max-width: 1080px)  {
	.attachment label {
		margin-top: 10px;
}
	.attachment .filename,
	.attachment .filename02,
	.attachment .filename03 {
	width: 100%;
	/*margin: 0;
	padding:7px;
	font-size: 14px;*/
}
}
@media screen and (max-width: 800px)  {
.attachment:last-child {
		margin-bottom: 50px;
}
}
@media screen and (max-width: 480px)  {
.attachment:last-child {
		margin-bottom: 30px;
}
.attachment .filename,
.attachment .filename02,
.attachment .filename03{
	font-size: 1.4rem;
	padding:12px 10px 10px 10px;
}
}