@charset "utf-8";

.hidden-fields-container {
	display: none!important;
}
/* 入力エリアの親要素がある場合（例: .form-item） */
.form-item {
    margin-bottom: 20px;
    position: relative;
}

/* エラーメッセージをふわっと表示 */
.err-msg {
    color: #d93025;
    font-size: 13px;
    margin-top: 5px;
    display: flex;
    align-items: center;
}

/* メッセージの前に「！」マークを自動でつける */
.err-msg:not(:empty)::before {
    content: "!";
    display: inline-block;
    width: 16px;
    height: 16px;
    background: #d93025;
    color: #fff;
    border-radius: 50%;
    text-align: center;
    line-height: 16px;
    margin-right: 5px;
    font-size: 11px;
}

/* 入力中のフォーカス色をエラー時だけ変える */
.is-error:focus {
    box-shadow: 0 0 0 3px rgba(217, 48, 37, 0.2);
    outline: none;
}


/*===============================================
●画面の横幅が769px以上
===============================================*/
@media screen and (min-width : 769px ){
#pc------------------------------------------- {
}
#contact {
	margin-top: 180px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 80px;
}
#contact h1.lowerttl em {
	font-size: 48px!important;
	margin-top: 30px;
}
#contact h1.lowerttl span {
	font-size: 60px!important;
}
#contact h1+p {
	font-size: 18px;
	line-height: 3em;
}
#contact .inner {
	width: 1000px;
	margin-left: auto;
	margin-right: auto;
	text-align: left;
	border-top: 1px solid #000;
	border-bottom: 1px solid #000;
	margin-top: 20px;
	padding-top: 15px;
}
#contact .inner th {
	font-size: 18px;
	text-align: left;
	width: 200px;
	vertical-align: top;
	padding-top: 25px;
}
#contact .inner td {
	padding-top: 15px;
	padding-bottom: 15px;
	font-size: 18px;
}
#contact .inner td input[type="text"],
#contact .inner td input[type="tel"],
#contact .inner td select,
#contact .inner td input[type="email"]
{
	border: 1px solid #000;
	height: 50px;
	padding-left: 20px;
	padding-right: 20px;
	font-size: 18px;
	width: 100%;
}
#contact .inner td li+li {
	margin-top: 30px;
}
#contact .inner td dl {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}
#contact .inner td dl dt {
	width: 90px;
}
#contact .inner td dl dd {
	width: 710px;
}
#contact .inner td dl dd+dt,
#contact .inner td dl dd+dt+dd
{
	margin-top: 30px;
}
#contact .inner td textarea {
	border: 1px solid #000;
	padding-left: 20px;
	padding-right: 20px;
	font-size: 18px;
	width: 100%;
	height: 300px;
}
#contact .inner input[type="submit"] {
	background-color: #003951;
	color: #fff;
	width: 300px;
	height: 60px;
	margin-left: auto;
	margin-right: auto;
	display: block;
	border-radius: 5px;
	font-size: 18px;
	cursor: pointer;
	margin-bottom: 40px;
	margin-top: 25px;
	transition: 0.3s;
}
#contact .inner input[type="submit"]:hover {
	opacity: 0.7;
	transition: 0.3s;
}
#contact .inner .btn-dummy {
background: none;      /* 背景色を消す（または transparent ） */
  border: none;          /* 枠線（凹凸の正体）を消す */
  padding: 0;            /* 内側の余白をリセット */
  cursor: pointer;       /* マウスを乗せた時に指マークにする（重要！） */
  outline: none;         /* クリック時の青い枠線を消す（※アクセシビリティに注意） */
	background-color: #003951;
	color: #fff;
	width: 300px;
	height: 60px;
	margin-left: auto;
	margin-right: auto;
	display: block;
	border-radius: 5px;
	font-size: 18px;
	cursor: pointer;
	margin-bottom: 40px;
	margin-top: 25px;
	transition: 0.3s;
	background-image: none;
	box-shadow: none;
}
#contact .inner .btn-dummy:hover {
	opacity: 0.7;
	transition: 0.3s;
}

#contact h2 {
	font-size: 24px;
	font-weight: bold;
	margin-top: 30px;
	margin-bottom: 20px;
}
#contact h2+p {
	font-size: 36px;
}
#contact h2+p img {
	width: 42px;
	position: relative;
	top: 2px;
}
#contact h2+p a {
	color: #000000;
	text-decoration: none;
}
}



/*===============================================
●画面の横幅が768pxまで
===============================================*/
@media screen and (max-width:768px){
	
/*===============================================
●sp-tablet
===============================================*/
#sptablet------------------------------------------- {
}
#contact {
	margin-top: 15vw;
	width: 90%;
	margin-left: auto;
	margin-right: auto;
}
#contact h1+p {
	line-height: 1.8em;
}
#contact .inner {
	width: 90%;
	margin-left: auto;
	margin-right: auto;
	text-align: left;
	border-top: 1px solid #000;
	border-bottom: 1px solid #000;
	margin-top: 5vw;
	padding-top: 5vw;
}
#contact .inner th {
	text-align: left;
	width: 100%;
	display: block;
}
#contact .inner td {
	width: 100%;
	display: block;
	padding-top: 2vw;
	padding-bottom: 7vw;
}
#contact .inner td input[type="text"],
#contact .inner td input[type="tel"],
#contact .inner td select,
#contact .inner td input[type="email"]
{
	border: 1px solid #000;
	height: 50px;
	padding-left: 5%;
	padding-right: 5%;
	width: 100%;
	font-size: 3.5vw;
}
#contact .inner td li+li {
	margin-top: 30px;
}
#contact .inner td dl {
}
#contact .inner td dl dt {
	margin-top: 3vw;
}	
#contact .inner td dl dd {
	margin-top: 2vw;
}
#contact .inner td textarea {
	border: 1px solid #000;
	padding-left: 20px;
	padding-right: 20px;
	width: 100%;
	height: 50vw;
}
#contact .inner input[type="submit"],
#contact .inner .btn-dummy
{
background: none;      /* 背景色を消す（または transparent ） */
  border: none;          /* 枠線（凹凸の正体）を消す */
  padding: 0;            /* 内側の余白をリセット */
  cursor: pointer;       /* マウスを乗せた時に指マークにする（重要！） */
  outline: none;         /* クリック時の青い枠線を消す（※アクセシビリティに注意） */
	background-color: #003951;
	color: #fff;
	width: 100%;
	height: 15vw;
	margin-left: auto;
	margin-right: auto;
	display: block;
	border-radius: 5px;
	font-size: 4vw;
	cursor: pointer;
	margin-bottom: 12vw;
	margin-top: 5vw;
	transition: 0.3s;
}
#contact .inner input[type="submit"]:hover,
#contact .inner .btn-dummy:hover
{
	opacity: 0.7;
	transition: 0.3s;
}




#contact h2 {
	font-size: 4.5vw;
	font-weight: bold;
	margin-top: 5vw;
	margin-bottom: 5vw;
}
#contact h2+p {
	font-size: 8vw;
	margin-bottom: 15vw;
}
#contact h2+p img {
	width: 7vw;
	position: relative;
	top: 1vw;
	margin-right: 2vw;
}
#contact h2+p a {
	color: #000000;
	text-decoration: none;
}
}



/*===============================================
●画面の横幅が400pxまで
===============================================*/
@media screen and (max-width:400px){
/*===============================================
●sp400
===============================================*/
#sp400------------------------------------------- {
}
}



/*===============================================
●画面の横幅が320pxまで
===============================================*/
@media screen and (max-width:320px){
/*===============================================
●sp320
===============================================*/
#sp320------------------------------------------- {
}
}



/*===============================================
●画面の横幅が481pxから768pxまで
===============================================*/
@media screen and (min-width:481px) and (max-width:768px) {
/*===============================================
●tablet
===============================================*/
#tab------------------------------------------- {
}

}