@charset "utf-8";

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
common
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* ----------------------------------------------------
element base setting (common)
---------------------------------------------------- */
body { color: #000; line-height: 1.5;  background: #fff;}
a { color: #1e84b9;  text-decoration: none;}
a:hover { text-decoration: underline;}
.clickable a, .clickable a:hover { color: #333;}
.flex {display: flex; display:-webkit-flex; justify-content: space-between; flex-wrap: wrap;}
.ff-serif {font-family: 'Noto Serif JP', serif;}

header{position: relative; z-index: 1!important;}
.headBg{background:url("../img/bg-visual.jpg") no-repeat 0 0; background-size: cover; height: 40vw; max-height: 600px;}
header h1{position: absolute; top: 35px; left: 5%; z-index: 2; width: 159px;}
header h2{position: absolute; top: 380px; left: 5%; z-index: 2; font-family: futura-pt-condensed, sans-serif; font-weight: 700; font-style: italic; color: #004e98; font-size: 12rem; text-shadow: 3px 3px 0px #fff; line-height: 8.9rem; letter-spacing: 1rem;}
header .mainRead{background: #21a4ec; background: -webkit-gradient(linear, left top, left bottom, from(#002779), to(#21a4ec)); background: -webkit-linear-gradient( #002779 0%, #21a4ec 100%); background: linear-gradient( #002779 0%, #21a4ec 100%); position: relative; padding: 120px 0 180px 0;}
header .mainRead::before{content: ""; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background-image: radial-gradient(#ffffff 2%, transparent 9%), radial-gradient(#ffffff 2%, transparent 9%); background-position: 0 0, 6px 6px; background-size: 12px 12px;}
header .mainRead h3{width:80%; max-width: 1200px; margin: 0 auto 30px auto; padding: 0; text-align: center; color: white; font-size: 3.0rem; line-height: 5.7rem; font-weight: 600;}
header .mainRead p{width:80%; max-width: 1200px; margin: 0 auto; padding: 0; text-align: center; color: white; font-size: 1.8rem; line-height: 3.7rem;}

/*#mainAria{width: 86%; max-width: 1300px; margin: 0 auto; display: block; background-color: white; position: relative; z-index: 99;}
.mainInner{width: 92%; max-width: 1200px; background-color: white; top: -80px; left: 50%; position: absolute; transform: translateX(-50%);}*/

#mainAria{width: 86%; max-width: 1300px; margin: -80px auto 0 auto; display: block; background-color: white; position: relative; z-index: 99;}
.mainInner{width: 92%; max-width: 1200px; margin: 0 auto; padding-top: 80px;}

.gfBox{display:flex; display:-webkit-flex; justify-content: space-between; margin-bottom: 120px;}
.gfBox h4{font-family: futura-pt, sans-serif; font-weight: 600; font-style: normal; font-size: 2.4rem; letter-spacing: 0.3rem; position: relative; padding-top: 25px; width: 18%;}
.gfBox h4::before{content: ""; position: absolute; top: 0; left: 0; width: 25px; height: 2px; background-color: #00287a;}
.gfBox h4 span{font-family: inherit; font-weight: normal; font-size: 1.8rem; letter-spacing: 0.3rem; color: #00287a; display: block;}
.gfBox table{width: 80%;}
.gfBox table th{width: 28%; background-color: #f6f6f6; border-top: 1px solid #dddddd; text-align: left; vertical-align: top; font-size: 1.8rem; padding: 25px;}
.gfBox table td{width: 72%; border-top: 1px solid #dddddd; font-size: 1.6rem; line-height: 2.6rem; padding: 25px;}
.gfBox p{width: 80%;}
.gfBox p img{width: 100%;}

.entryBut{display:flex; display:-webkit-flex; justify-content: center; margin-bottom: 120px;}
.entryBut span{background: #004e98; text-align: center; color: white; font-size: 2.4rem; letter-spacing: 0.3rem; padding: 10px 100px;}

/* corp bottom */
#corporateBtn {position: fixed; right: 5%; top: 2.5rem; width: 14rem; height: 3.5rem; z-index: 90;}
#corporateBtn a {display: flex; width: 100%; height: 100%; align-items: center; justify-content: center; background: #444; color: #fff; border-radius: 30px;}

/* ----------------------------------------------------
footer (common)
---------------------------------------------------- */
footer{background-color:black; padding: 10px 0;}
footer p{color: #5e5e5e; font-size: 1.4rem; text-align: center;}

.bt-prapa{display:block; text-align: center;}


/* ----------------------------------------------------
entry (common)
---------------------------------------------------- */
#entry header {padding: 30px 60px;}
#entry header h1 {position: relative; top: inherit; left: inherit;}
#entry #mainAria {margin: -100px auto 120px auto; max-width: 1200px;}
#entry .entryVisual {display: flex; display: -webkit-flex; justify-content: center; align-items: center; height: 240px; margin-bottom: 60px; background: rgb(0,39,121); background: linear-gradient(180deg, rgba(0,39,121,1) 0%, rgba(33,164,236,1) 100%);}
#entry .entryVisual .entryTxtVisual {text-align: center; color: #fff; font-weight: 600; font-size: 2.6rem;}
#entry .entryVisual .entryTxtVisual  h2 {font-size: 4rem; font-family: futura-pt-condensed, sans-serif;  font-weight: 700; }
#entry .entryVisual .entryTxtVisual p {margin: 0;}
#entry .required, #entry .error {color: #ff0000;}
#entry .entryForm {margin-top: 60px;}
#entryTable {width: 100%; font-size: 1.6rem; table-layout: fixed; border-bottom: 1px solid #dddddd; margin-bottom: 80px;}
#entryTable tr {border-top: 1px solid #dddddd;}
#entryTable th {width: 23%; vertical-align: top; padding: 20px; background: #f6f6f6; text-align: left; font-size: 1.8rem;}
#entryTable td {padding: 20px;}
#entryTable .listRadio, #entryTable .entryItem, #entryTable .entryAddress {margin: 0;}
#entryTable .entryExample {margin-bottom: 5px; color: #666;}
#entryTable .linkPostCode {margin-left: 10px;}
#entryTable .listRadio.listInline li {display: inline-block; margin-right: 30px;}
#entryTable .listRadio.listInline li:last-child {margin-right: 0;}
#entryTable .entryAddress li {margin:  0 0 10px;}
#entryTable .entryAddress li:last-child {margin-bottom: 0;}
#entryTable .entryItem dd {position: relative; padding: 5px 0 30px 100px;}
#entryTable .entryItem dt {position: absolute; padding-top: 8px; }
#entryTable .listRadio input {margin-right: 5px;}
#entryTable input[type="text"] {margin: 0 5px;}
#entryTable .inputXS{width: 100px;}
#entryTable .inputM {width: 60%;}
#entryTable .inputL {width: 100%;}
#entryTable textarea {width: 100%; height: 200px;}
#entryTable select {height: 30px;}
#entry .btnForm {text-align: center; margin:  0 auto 0;}
#entry .flxBtn {display: flex; display: -webkit-flex; justify-content:center; flex-wrap: wrap;}
#entry .btnForm input {border: none;  font-size: 2rem; font-weight: 600;}
#entry .btnConfirm {display: block; margin: 0 15px;}
#entry .btnForm .btnSubmit {background: #004e98; color: #fff; padding: 20px 60px;height: 70px;}
#entry .btnForm .btnBack {background: #999; color: #fff; padding: 20px 20px; height: 70px;}
#entry .alignC{text-align: center;}
#entry .entryThanks {text-align: center;}
#entry .btnEtnryBack {margin: 40px auto 0; width: 240px;}
#entry .btnEtnryBack  a {display: block; background: #004e98; color: #fff; padding: 15px;}

#entryTable td .confTableInr {
	margin-bottom: 0;
	border: none !important;
}
#entryTable td .confTableInr tr {
	border: none;
}
#entryTable td .confTableInr th,
#entryTable td .confTableInr td {
	background: #fff;
	font-weight: normal;
	padding: 5px;
	display: table-cell !important;
	width: auto !important;
}

.entryNote{width:90%; margin: 0 auto; padding-top: 30px;}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
pcSetting
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

@media (min-width:768px) {
/* ----------------------------------------------------
common(pc)
---------------------------------------------------- */
/* hover */
a:hover { opacity: .65;	filter: alpha(opacity=65);  text-decoration: none;	transition: all 0.2s ease-in-out;}
a img:hover {  opacity: .65; filter: alpha(opacity=65);	transition: all 0.2s ease-in-out;}
.clickable:hover {filter: alpha(opacity=65) ;	opacity: .65;transition: all 0.2s ease-in-out;}
.br_spOnly{display: none;}
.br_pcOnly{display: block;}
}




@media (max-width: 1500px) {
header h2{top: 25.333vw; font-size: 8vw; text-shadow: 3px 3px 0px #fff; line-height: 5.933vw; letter-spacing: 0.667vw;}
header .mainRead{padding: 8vw 0 12vw 0;}
header .mainRead h3{margin:0 auto 2vw auto; font-size: 2vw; line-height: 3.8vw;}
header .mainRead p{font-size: 1.2vw; line-height: 2.467vw;}
.gfBox h4{font-size: 1.6vw; letter-spacing: 0.2vw; padding-top: 1.667vw;}
.gfBox h4 span{font-size: 1.2vw; letter-spacing: 0.2vw;}
.gfBox table th{font-size: 1.2vw; padding: 1.667vw;}
.gfBox table td{font-size: 1.067vw; line-height: 1.733vw; padding: 1.667vw;}

}





/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
tabletSetting
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

@media (max-width: 1200px) and (min-width: 768px) {
header h1{top: 2.917vw; width: 13.25vw;}
header .mainRead h3{margin: 0 auto 2.5vw auto; font-size: 2.5vw; line-height: 4.75vw;}
header .mainRead p{font-size: 1.5vw; line-height: 3.083vw;}
#mainAria{margin: -6.667vw auto 0 auto;}
.mainInner{padding-top: 6.667vw;}
.gfBox{margin-bottom: 10vw;}
.gfBox h4{font-size: 2vw; letter-spacing: 0.25vw; padding-top: 2.083vw;}
.gfBox h4::before{width: 2.083vw;}
.gfBox h4 span{font-size: 1.5vw; letter-spacing: 0.25vw;}
.gfBox table th{font-size: 1.5vw; padding: 2.083vw;}
.gfBox table td{font-size: 1.333vw; line-height: 2.167vw; padding: 2.083vw;}

.entryBut{margin-bottom: 10vw;}
.entryBut span{font-size: 2vw; letter-spacing: 0.25vw; padding: 0.833vw 8.333vw;}
	
/* corp bottom */
#corporateBtn {right: 5%; top: 2vw; width: 11.6vw; height: 3.2vw;}	
	
/* ----------------------------------------------------
footer (common)
---------------------------------------------------- */
footer{background-color:black; padding: 10px 0;}
footer p{color: #5e5e5e; font-size: 1.4rem; text-align: center;}


/* ----------------------------------------------------
entry (<1200)
---------------------------------------------------- */
#entry header {padding: 2.5vw 5vw;}
#entry #mainAria {margin: 0 auto 10vw; }
#entry .entryVisual {height: 20vw; margin-bottom: 5vw;}
#entry .entryVisual .entryTxtVisual {font-size: 2.16vw;}
#entry .entryVisual .entryTxtVisual  h2 {font-size: 3.3vw;}
#entry .entryForm {margin-top: 5vw;}
#entryTable { font-size: 1.3vw; margin-bottom: 6.6vw;}
#entryTable th {padding: 1.66vw; font-size: 1.3vw;}
#entryTable td {padding: 1.66vw;}
#entryTable .entryExample {margin-bottom: 0.4vw; }
#entryTable .linkPostCode {margin-left: 0.83vw;}
#entryTable .listRadio.listInline li { margin-right: 2.5vw;}
#entryTable .entryAddress li {margin:  0 0 0.83vw;}
#entryTable .entryItem dd {padding: 0.4vw 0 0.4vw 8.3vw;}
#entryTable .entryItem dt {padding-top: 0.66vw; }
#entryTable .listRadio input {margin-right: 0.4vw;}
#entryTable input[type="text"] {margin: 0 0.4vw;}
#entryTable .inputXS{width: 8.3vw;}
#entryTable textarea { height: 16vw;}
#entryTable select {height: 2.5vw;}
#entry .btnForm input {font-size: 1.66vw; }
#entry .btnConfirm {margin: 0 1.25vw;}
#entry .btnForm .btnSubmit {padding: 1.66vw 5vw; height: 5.8vw;}
#entry .btnForm .btnBack { padding: 1.66vw ; height: 5.8vw;}
#entry .btnEtnryBack {margin: 3.3vw auto 0; width: 20vw;}
#entry .btnEtnryBack  a {padding: 1.25vw;}

}


/*━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
spSetting
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

@media (max-width: 767px) {
.br_spOnly{display: block;}
.br_pcOnly{display: none;}
.spNone{display: none;}

  
.headBg{background-size: cover; height: 70vw; max-height: 600px; background-position: 45% top;}
header h1{top: 4.563vw; width: 20.73vw;}
header h2{top: 53.544vw; font-size: 12.645vw; text-shadow: 2px 2px 0px #fff; line-height: 9.4vw; letter-spacing: 1.304vw;}
header .mainRead{padding: 15.645vw 0 15.468vw 0;}
header .mainRead h3{margin: 4vw auto 2vw auto; font-size: 4.8vw; line-height: 7.432vw;}
header .mainRead p{font-size: 3.4vw; line-height: 6.824vw;}
#mainAria{width: 90%; margin: 0 auto;}
.mainInner{width: 100%; padding-top: 10.43vw;}
.gfBox{margin-bottom: 15.645vw; flex-flow: column;}
.gfBox h4{font-size: 4.8vw; letter-spacing: 0.391vw; padding-top: 3.259vw; width: 100%; margin-bottom: 5vw;}
.gfBox h4::before{width: 3.259vw;}
.gfBox h4 span{font-size: 2.8vw; letter-spacing: 0.391vw;}
.gfBox table{width: 100%;}
.gfBox table th{width: 100%; font-size: 3.868vw; padding: 3.259vw; display: block;}
.gfBox table td{width: 100%; font-size: 3.6vw; line-height: 6.39vw; padding: 3.259vw; display: block;}
.gfBox p{width: 100%;}
	
.entryBut{margin-bottom: 15.645vw;}
.entryBut span{font-size: 4.8vw; letter-spacing: 0.391vw; padding: 2.304vw 13.038vw;}

/* corp bottom */
#corporateBtn {right: 3.8vw; width: 25vw; height: 7vw; top: 3.8vw; font-size: 3.6vw;}

/* ----------------------------------------------------
entry (sp)
---------------------------------------------------- */
#entry header {padding: 6vw 12vw;}
#entry #mainAria {margin: 0 auto 10vw;}
#entry .entryVisual {height: 40vw; margin-bottom: 12vw; }
#entry .entryVisual .entryTxtVisual { font-size: 5vw;}
#entry .entryVisual .entryTxtVisual  h2 {font-size: 7vw; }
#entry .entryForm {margin-top: 10vw;}
#entryTable {font-size: 4vw; margin-bottom: 10vw;}
#entryTable th, #entryTable td {width: 100%; display: block;padding: 4vw; font-size: 4vw;}
#entryTable td {padding: 4vw 0; }
#entryTable .entryExample {margin-bottom: 1vw;}
#entryTable .linkPostCode {margin-left: 1vw;}
#entryTable .listRadio.listInline li {margin-right: 6vw;}
#entryTable .entryAddress li {margin:  0 0 2vw;}
#entryTable .entryItem dd {padding:0; margin: 0 0 2vw;}
#entryTable .entryItem dt {position: relative; padding-top: 0; margin-bottom: 0;}
#entryTable .listRadio input {margin-right: 1vw;}
#entryTable input[type="text"] {margin: 0 1vw;}
#entryTable .inputXS{width: 25vw ;}
#entryTable .inputM {width: 100%;}
#entryTable textarea {height: 40vw;}
#entryTable select {height: inherit;}
#entry .flxBtn {flex-direction: column-reverse;}
#entry .btnForm input {font-size: 5vw; width:  100% }
#entry .btnConfirm {margin: 0;}
#entry .btnForm .btnSubmit { padding: 5vw;height: inherit;}
#entry .btnForm .btnBack {padding: 5vw; height: inherit;}
#entry .entryThanks {text-align: left;}
#entry .btnEtnryBack {margin: 5vw auto 0; width: 100%;}
#entry .btnEtnryBack  a {padding: 4vw; text-align: center;}

}