@charset "utf-8";

/*====================================

----------------------------------
Color
----------------------------------

Main     : #ffffff
Accent   : #0043a7
Text     : #000000
sub      : #ffbb50
sub      : #16c76d
sub      : #4ac8f1

----------------------------------
Structure
----------------------------------

0. Reset
1. MainParts
1.1 Html + Body
1.2 Header
1.3 Header--PC
1.4 Header--SP
1.5 Footer
2. PageLayout
3. Parts
3.1 layout-class
3.2 table-layout
3.3 btn
3.4 panel
3.5 col
3.6 form
4. Underlayer page
4.1 contents-style

====================================*/


/*====================================

0. Reset

====================================*/
/* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126License: none (public domain)*/
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,time, mark, audio, video {margin: 0;padding: 0;border: 0;font-size: 100%;font: inherit;vertical-align: baseline;}/* HTML5 display-role reset for older browsers */article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}body {line-height: 1;}ol, ul {list-style: none;}blockquote, q {quotes: none;}blockquote:before, blockquote:after,q:before, q:after {content: '';content: none;}table {border-collapse: collapse;border-spacing: 0;}

/* link
------------------------------------------------------------ */
a {	overflow:hidden;	outline:none;	text-decoration: none;color: #000;}
a:link {}
a:visited {}
a:hover {}
a:active {}


/*====================================

1. MainParts

====================================*/

/* 1.1 Html + Body
====================================*/
html {font-size: 62.5%;}
body {
	font-size:1.6em;
	line-height: 1.6em;
	-webkit-text-size-adjust: 100%;
	color: #333333;
	position: relative;
}
@media print, screen and (min-width: 671px) and (max-width: 1000px) {
	body{font-size: 1.45em;}
}
@media print, screen and (max-width: 670px) {
	body { font-size:1.4em;}
}

/* font
------------------------------------------------------------ */
body {font-family: 'Roboto',"ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;}


/* 1.2 Header
====================================*/
header {}
.fixed {position: fixed;top:0;left:0;z-index:2;width: 100%;background-color: #fff;}

/* ===== header02 ===== */
.header02 {padding: 15px 0;}
.header02 img.logo {float: left;vertical-align: middle;}
.header02 nav {float: right;}
.header02 nav ul,
.header02 nav ul li {display: inline-block;}
.header02 nav .gnav1 {font-weight: bold;font-size: 1.5rem;margin-right: 1em;}
.header02 nav .gnav1 a {padding: .8em 1em;display: inline-block;}

/* 1.3 Header--PC
====================================*/
@media print, screen and (min-width: 671px) {
	.navbar-toggle {display: none;}

	/* ===== header01 ===== */
	.header01 {border-bottom: 1px solid #dddddd;padding: 15px 0;}
	.header01 p:nth-child(1) {font-size: 1.4rem;float: left;}
	.header01 p:nth-child(2) {font-size: 1.3rem;font-weight: normal;float: right;}
	.header01 p:nth-child(2) span {font-size: 2.2rem;font-weight: bold;vertical-align: middle;margin-right: .2em;}
	.header01 img.logo {vertical-align: middle;margin-left: 1em;}
	/* ===== header02 ===== */
	.header02 nav .gnav1 a {transition: .3s;}
	.header02 nav .gnav1 a:hover {opacity: .5;}

}

/* 1.4 Header--SP
====================================*/
@media print, screen and (max-width: 670px) {
	.header02 {padding: 10px 0 5px;}
	.header02 img.logo {width: auto;margin-top: 2px;max-height: 35px;}

	.header02 nav .gnav1 {position: absolute;width: 100%;background-color: #fff;left: 0;top: 0;}
	.header02 nav .gnav1 li {display: block;border-top: 1px solid #eee;text-align: center;}
	.header02 nav .gnav2 a {height: 35px;line-height: 35px;padding: 0 8px;font-weight: normal;}

	/* navbar-toggle
	----------------------*/
	.navbar-toggle { position: relative; width: 35px; height: 37px; border: 1px solid #ccc; box-sizing: border-box; background: none; vertical-align: top;padding: 0 8px;border-radius: 5px;}
	.navbar-toggle,.navbar-toggle span { display: inline-block; transition: all 0.4s; box-sizing: border-box; }
	.navbar-toggle span { position: absolute; left: 6px; width: 22px; height: 2px; background-color: #333;
	}
	.navbar-toggle span:nth-of-type(1) { top: 11px; }
	.navbar-toggle span:nth-of-type(2) { top: 23px; }
	.navbar-toggle span:nth-of-type(3) { bottom: 16px; }
	.navbar-toggle.active { -webkit-transform: rotate(360deg); -ms-transform: rotate(360deg); transform: rotate(360deg);}
	.navbar-toggle.active span:nth-of-type(1) { top: 8px; -webkit-transform: translateY(10px) rotate(-45deg); -ms--webkit-transform: translateY(10px) rotate(-45deg); transform: translateY(10px) rotate(-45deg); }
	.navbar-toggle.active span:nth-of-type(2) { top: 18px;-webkit-transform: translateY(0) rotate(45deg); -ms-transform: translateY(0) rotate(45deg); transform: translateY(0) rotate(45deg); }
	.navbar-toggle.active span:nth-of-type(3) { opacity: 0;}
}

/* 1.5 Footer
====================================*/

footer .tel {background-color: #eff1f4;padding: 4% 0 3%;}
footer .tel p:nth-child(1){color: #0043a7;font-size: 2rem;font-weight: bold;}
footer .tel p:nth-child(2){margin-top: 10px;}
footer .tel p:nth-child(2) span {font-size: 3.6rem;font-weight: bold;vertical-align: middle;margin-right: .2em;}

footer .copy {
	color: #fff;
	padding: 2em 0;
	font-size: 1.2rem;
	text-align: center;

	background: rgb(0,67,167);
	background: -moz-linear-gradient(left, rgb(0,67,167) 1%, rgb(0,118,167) 100%);
	background: -webkit-linear-gradient(left, rgb(0,67,167) 1%,rgb(0,118,167) 100%);
	background: linear-gradient(to right, rgb(0,67,167) 1%,rgb(0,118,167) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0043a7', endColorstr='#0076a7',GradientType=1 );
}

#pagetop {color: #eee;width: 50px;height: 50px;text-align: center;border-radius: 100%;font-size: 1.4rem;right: 10px;transition: .3s;}
#pagetop:before {content: '\f0d8';font-family: "Font Awesome 5 Free";font-weight: bold;display: block;color: rgba(255, 255, 255, 0.4);line-height: .5;margin-top: 10px;}
#pagetop:hover {opacity: .7;cursor: pointer;}


@media screen and (min-width: 671px) {
	footer {margin-top: 100px;min-width: 940px;}
}

@media screen and (max-width: 670px) {
	footer {margin-top: 50px;}
	footer .tel p:nth-child(1) {font-size: 1.6rem;}
	footer .tel p:nth-child(2) span{font-size: 2rem;display: block;}
	footer .copy {padding: 1em 0;}
}

/*====================================

3. Parts

====================================*/

/* 3.1 layout-class
====================================*/
img {max-width: 100%;}

.no-pc {display: none!important;}
.no-sp {display: block!important;}

/*txt*/
.txt-l { text-align:left!important; }
.txt-c { text-align:center!important; }
.txt-r { text-align:right!important; }

.font-bold {font-weight: bold;}

/*table-cell*/
.table { display:table;}
.table-cell {display:table-cell;vertical-align:middle;}

/*clearfix*/
.clearfix:after,
.inner:after,
.row:after{	content: "";	display: block;	clear: both;}

/*icon*/
.fa-phone.circle {background-color: #0043a7;color: #fff;border-radius: 2em;padding: 0.5em;font-size: 0.5em;vertical-align:middle;margin-bottom: 0.5em;margin-right: 0.5em;}

/*width*/
.w100{width: 100%;} .w90{width: 90%;} .w80{width: 80%;} .w70{width: 70%;} .w60{width: 60%;} .w50{width: 50%;} .w40{width: 40%;} .w30{width: 30%;} .w20{width: 20%;} .w10{width: 10%;}

/*bg*/
.bg-grad {
	background: rgb(0,67,167);
	background: -moz-linear-gradient(top, rgb(0,67,167) 1%, rgb(0,118,167) 100%);
	background: -webkit-linear-gradient(top, rgb(0,67,167) 1%,rgb(0,118,167) 100%);
	background: linear-gradient(to bottom, rgb(0,67,167) 1%,rgb(0,118,167) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0043a7', endColorstr='#0076a7',GradientType=1 );
}
@media print, screen and (min-width: 671px) {
	.inner {width: 100%;margin: auto;min-width: 940px; max-width: 1000px;}
}
@media print, screen and (max-width: 670px) {
	.inner {width: 92%;margin-left: 4%;margin-right: 4%; }

	.no-pc {display: block!important;}
	.no-sp {display: none!important;}
}

/* 3.2 table-layout
====================================*/
table.table {width: 100%;}
table.table th,table.table td {vertical-align: middle;padding: 2.5% 2%;}

@media print, screen and (max-width: 670px) {
	table.table th,table.table td {display: block;width: 96%;padding: 3% 2%;text-align: left;}
}


/* 3.3 btn
====================================*/
.btn {color: #fff;border-radius: 5px;font-weight: bold;padding: .8em 1.5em;display: inline-block;}
.btn-download {background-color: #0043a7;box-shadow: 0 2px 0 #001b43;
	display: flex;
    justify-content: center;
    align-items: center;
}
.gnav2 .btn-download{display: block;}
.btn-contact {background-color: #fb7e21;box-shadow: 0 2px 0 #c95e0e;}
.btn-back {background-color: #999;box-shadow: 0 2px 0 #666;}

.btn-block {display: block;text-align: center;}

.bt_min_text{font-size: 1.4rem; line-height: 1.2; display: block;}

.btn-box .inner{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.btn-box .inner a{	margin: 0 5px; padding: 2% 0;}

/*submit*/
input.btn {padding: 1em 2.5em;font-size: 1.8rem;border: none;}
input.btn:hover { cursor:pointer;}
input.btn:disabled {box-shadow: none;background-color: #ccc;}

@media print, screen and (min-width: 671px) {
	.btn {transition: .1s;}
	.btn:hover { box-shadow: none;transform: translate3d(0, 2px, 0);}
	input.btn:disabled:hover {transform: none; cursor: default;}
}
@media print, screen and (max-width: 670px) {
	input.btn {padding: .6em 1.5em;font-size: 1.6rem;}
	.btn-box .inner a{	margin: 1% auto;}
}


/* 3.4 panel
====================================*/
.panel {border: 1px solid #ddd;border-radius: 5px;margin-bottom: 5%;}
.panel-heading {border-bottom: 1px solid #ddd;padding: 2% 4%;}
.panel-body {padding: 4%;}


/* 3.5 col
====================================*/
.row + .row {margin-top: 2%;}

@media print, screen and (min-width: 671px) {
	[class^="col-"]{float: left;margin-right: 2%;}
	.col-2{width: 49%;}
	.col-3{width: 32%;}
	.col-3:nth-child(3n),.col-2:nth-child(2n){margin-right: 0;}
	.col-5{width: 18%;}
}


/* 3.6 form
====================================*/
/*placeholder*/
input::-webkit-input-placeholder,textarea::-webkit-input-placeholder{font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo,  "ＭＳ Ｐゴシック", sans-serif;opacity: .8;}
input:-moz-placeholder,textarea:-moz-placeholder{font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo,  "ＭＳ Ｐゴシック", sans-serif;opacity: .8;}
input::-moz-placeholder,textarea::-moz-placeholder{font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo,  "ＭＳ Ｐゴシック", sans-serif;opacity: .8;}
input:-ms-input-placeholder,textarea:-ms-input-placeholder {font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo,  "ＭＳ Ｐゴシック", sans-serif;opacity: .8;}

/*form-group*/
.form-group {padding: 1% 0;position: relative;}
.form-control {
	display: inline-block;
	padding: 1%;
	margin-left: 0.5%;
	font-size: 1.4rem;
	line-height: 1.42857143;
	color: #555;
	background-color: #fff;
	background-image: none;
	border: 1px solid #ddd;
	border-radius: 4px;
	-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
	box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
	-webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
	-o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
	transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
	font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo,  "ＭＳ Ｐゴシック", sans-serif;
}
.form-control:focus{
	border-color: #66afe9;
	outline: 0;
	-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
	box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6)
}

/*radio,checkbox*/
.checkbox-group label {
	display: inline-block;
	border: 1px solid #ddd;
	border-radius: 5px;
	padding: 0.6em;
	margin-right: 0.5em;
	margin-bottom: 0.5em;
	cursor: pointer;
	position: relative;
	font-size: 1.4rem;
}
.checkbox-group label.check {background-color: #fdd89d;}
.checkbox-group input:disabled {background-color: #eee;}

@media screen and (min-width: 671px) {
	.checkbox-group label {transition: .3s;}
	.checkbox-group label:hover {background-color: #fdd89d;}
}

/*====================================

4. Underlayer page

====================================*/

/* 4.1 form-page
====================================*/
.form-page main h1 {background: url(../img/h1-form-bg.jpg) center no-repeat;background-size: cover;font-size: 2.6rem;text-align: center;padding: 2em 0;font-weight: bold;margin-bottom: 50px;}
.form-page main h3 {font-size: 2.6rem;text-align: center;font-weight: bold;margin-bottom: 30px;padding-top: 40px;}

.form-page form table {margin-bottom: 5%;}
.form-page form th,.form-page form td {border: 1px solid #eeeeee;text-align: left;padding: 1.5% 2%;word-break: break-all;}
.form-page form th {background-color: #f6f8fb;font-weight: bold;font-size: 1.5rem;}

.form-page form .req {
	float: right;
	color: #fff;
	font-size: 1.2rem;
	background: #fb4e4e;
	line-height: 1;
	padding: .3em;
}
.form-page form .recommend { font-size: .8em;}
.form-page .kiyaku { overflow: auto; height: 200px; background-color: #f6f8fb;border-radius: 5px;font-size: 1.4rem;padding: 1em;text-align: left;margin: 20px 0;
}
.form-page form .error {color: #fb4e4e;font-size: 0.8em;}

.form-page .sample {padding-bottom: 30px;}
.form-page .sample > div{	background-color: #f6f8fb;border: 1px solid #eee;border-radius: 5px;padding: 1em 0;width: 48%;float: left;box-sizing: border-box;}
.form-page .sample > div + div {margin-left: 4%;}
.form-page .sample p {margin-bottom: 1em;}
.form-page .sample img {max-width: 92%;margin: 0 4%;}

/*download*/
.form-page .dl-btn {margin: 40px 0 20px;}
.form-page .dl-btn + p {border: 1px solid #666;font-size: 1.4rem;padding: .5em 0;}
.form-page .dl-list li {margin-bottom: 2%;}
.form-page .dl-list a {display: table;width: 100%;background-color: #f6f8fb;box-sizing: border-box;border: 1px solid #eeeeee;border-radius: 5px;padding: 1em;color: #0043a7;}
.form-page .dl-list li p:nth-child(1) {width: 38%;}
.form-page .dl-list li p {display: table-cell;vertical-align: middle;padding-left: 1em;}
.form-page .bot-txt {width: fit-content;margin: auto;}
.form-page #dl03 + ul li a span {display: block;font-size:14px;color: #333;}

.form-page .privacy-panel a{text-decoration:underline;color:#0043a7;}
.form-page .privacy-panel p{margin-bottom:10px;}

@media screen and (min-width: 671px) {
	.form-page main .inner {max-width: 850px;margin: auto;}
	.form-page main h1 {min-width: 940px;}
	.form-page form th {width: 30%;min-width: 230px;}

	.form-page .dl-list li a{transition: .3s;}
	.form-page .dl-list li a:hover {background-color: #e1e9f5;}
}

@media screen and (max-width: 670px) {
	.form-page main h1 {font-size: 2rem;line-height: 1.4em;padding: 1em;margin-bottom: 30px;}
	.form-page main h3{font-size: 2rem;margin-bottom: 20px;}
	.form-page form th,.form-page form td {padding: 2% 2%;}
	.form-page form td {border-bottom: none;border-top: none;}
	.form-page form td:last-child {border-bottom: 1px solid #eee;}
	form .w30,form .w70 {width: 94%;}

	/*download*/
	.form-page .dl-btn li {width: 49%;float: left;margin-right: 2%;}
	.form-page .dl-btn li:nth-child(2n) {margin-right: 0;}
	.form-page .dl-btn li a{padding-left: 0;padding-right: 0;font-weight: normal;}

}

/* 241216 */
.pdf_down {text-align: center;}
.pdf_box {display: flex;justify-content: center;font-size: 18px;font-weight: bold;}
.pdf_box img {display: flex;align-items: center;width: 80px;}
.pdf_box {display: flex;align-items: center;}
.pdf_box p {border-radius: 6px;background: #fb7e21;color: #fff;padding: 6px 20px;transition: .1s;    box-shadow: 0 2px 0 #c95e0e;}
.pdf_box p:hover {box-shadow: none;transform: translate3d(0, 2px, 0);}
.contact_txt {margin: 30px auto 0;width: fit-content;}
.contact_mail {color: rgb(0,67,167);}
.contact_mail:hover {color: rgb(0,118,167);}