@charset "utf-8";
/* 標準可変メディア
メモ : 可変メディアでは、HTML からメディアの高さおよび幅の属性を削除する必要がある
http://www.alistapart.com/articles/fluid-images/ 
*/
img, object, embed, video {
width:auto!important; max-width: 100%; height: auto;
}
/* IE 6 では最大幅がサポートされていないため、デフォルトで幅 100% に設定される */
.ie6 img { width:100%; height: auto;}

.fsEn { font-family: 'Roboto Condensed', sans-serif;}



/* デスクトップレイアウト : 769 px ～最大 1232 px。モバイルレイアウトとタブレットレイアウトからスタイルを継承。 */

@media print, screen and (min-width: 768px) {

html { font-size: 62.5%;}
body { font-size: 1.8rem;}


.wrap { width: 100%; margin: auto; padding: 0;}
.w1200 { width: 1200px; margin: auto;}
.w1000 { width: 1000px; margin: auto;}
.w960 { width: 960px; margin: auto;}
.w900 { width: 900px; margin: auto;}
.w850 { width: 850px; margin: auto;}

.pc { display: block;}
.sp { display: none;}
.pcBr { display: inline-block;}
.spBr { display: none;}

/*#totop { position: fixed; bottom: 80px; right: 40px;}
#totop a { display: block; width: 40px; height: 40px; background: #000; text-align: center; line-height: 40px; cursor: pointer;}
#totop a:hover {}
#totop a i { color: #FFF;}*/

.pdTB60 { padding: 60px 0;}
.pdTB40 { padding: 40px 0;}

.is-hidden { visibility: hidden; opacity: 0; height: 0; padding: 0 !important; margin: 0 !important; border: none;}
.more { text-align: center; margin: 30px 0 0;}
.more button { display: inline-block; background: #1e86bb; color: #FFF; padding: 10px 50px; border: none;}

.ankerLink { margin-top: -150px; padding-top: 150px;}


/*header
----------------------------------------*/
/*header { width: 100%; background: #FFF; border-bottom: solid 1px #CCC; position: fixed; z-index: 2000;}
header .w1200 { display: flex; justify-content: space-between; padding: 20px 20px; height: 100%;}
header .w1200 h1 { width: 260px;}
header .w1200 h1 a { display: block;}
header .w1200 h1 a img { width: 100%; height: auto;}

header .w1200 .headerR { width: 820px; display: flex; justify-content: flex-end;}
header .w1200 .headerR .headerMenu { margin: 0 20px 0 0;}
header .w1200 .headerR .headerMenu .htop { font-size: 1.2rem; margin: 0 10px 10px 0;}
header .w1200 .headerR .headerMenu .htop ul { list-style: none; display: flex; justify-content: flex-end;}
header .w1200 .headerR .headerMenu .htop ul li {}
header .w1200 .headerR .headerMenu .htop ul li a { display: block; padding: 3px 10px;}
header .w1200 .headerR .headerMenu .gnav { font-size: 1.8rem; font-weight: 600; letter-spacing: 0.1rem;}
header .w1200 .headerR .headerMenu .gnav ul { list-style: none; display: flex; justify-content: flex-end;}
header .w1200 .headerR .headerMenu .gnav ul li { border-right: 1px solid #000;}
header .w1200 .headerR .headerMenu .gnav ul li:last-of-type { border-right: none;}
header .w1200 .headerR .headerMenu .gnav ul li a { display: block; padding: 2px 20px;}
header .w1200 .headerR .headerContact { background: #086DB0; padding: 0 15px; display: flex; align-items: center;}
header .w1200 .headerR .headerContact a { display: block; height: 100%; color: #FFF;}*/

.menu_wrap .service_menu .has-drawer .drawer-menu ul li a img {
width: 40px!important;
height: 40px;
margin: 0 8px 0 0;
}
.menu_wrap .service_menu .has-drawer .drawer-menu ul li a img.deal { width: 47px!important; }
.menu_wrap .service_menu .has-drawer .drawer-menu ul li a img.highway { width: 47px!important; }
.menu_wrap .service_menu .has-drawer .drawer-menu ul li a img.user_guide { height: 37px!important; }






/*footer
----------------------------------------*/
/*footer { padding: 50px 0 0; margin: 0 0 50px; background: #F9FAF8;}
footer .col4 { padding: 0 20px 80px;}
footer .col4 > ul { list-style: none; display: flex; justify-content: space-between;}
footer .col4 > ul > li { width: 23%;}
footer .col4 > ul > li h3 { font-size: 1.8rem; padding: 0 10px 15px; border-bottom: solid 1px #999;}
footer .col4 > ul > li h3 span { position: relative;}
footer .col4 > ul > li h3 span::before { content: ""; width: 10px; height: 10px; display: inline-block; border-right: solid 1px #666; border-top: solid 1px #666; position: absolute; top: 10px; right: -40px; transform: rotate(45deg);}
footer .col4 > ul > li h3 span::after { content: ""; width: 40px; height: 1px; background: #666; display: inline-block; position: absolute; top: 15px; right: -40px;}
footer .col4 > ul > li h3 span { background: #F9FAF8; padding: 0 20px 0 0; position: relative; z-index: 10;}
footer .col4 > ul > li > ul { list-style: none; padding: 10px 10px 0;}
footer .col4 > ul > li > ul li {}
footer .col4 > ul > li > ul li a { font-size: 1.4rem; white-space: nowrap;}
footer .logo { text-align: center; margin: 0 0 70px;}
footer .logo img { width: 200px; height: auto; display: inline-block;}
.cp { text-align: center; background: #0F67A5; color: #FFF; font-size: 1.2rem; padding: 10px 0;}*/






/*SNS
----------------------------------------*/
/*.sns { background: #d3d3d3; padding: 20px 0;}
.sns ul { list-style: none; display: flex; justify-content: center;}
.sns ul li { margin: 0 20px;}
.sns ul li a { display: block; text-align: center;}
.sns ul li a img { width: 40px; height: 40px;}
.sns ul li a:hover img { transform: scale(1.2);}
.sns ul li a .currentColor { fill: #0f67a5;}*/





/*comHeader
----------------------------------------*/
.comHeader { padding: 10px 0 30px;
background: #00B4DB;  /* fallback for old browsers */
background: -webkit-linear-gradient(to right, #0083B0, #00B4DB);  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to right, #0083B0, #00B4DB); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}
.comHeader .pankuzu { list-style: none; margin: 20px 0 0; display: flex; justify-content: flex-end; position: relative; }
.comHeader .pankuzu li { color: #FFF; font-size: 1.2rem;}
.comHeader .pankuzu li::after { font-family: "Font Awesome 5 Free"; content: "\f054"; font-weight: 900; padding: 0 10px; color: #fff; }
.comHeader .pankuzu li:last-of-type::after { content: none;}
.comHeader .pankuzu li a { color: #FFF;}
.comHeader h2 { margin: 0 0 20px; color: #FFF; text-shadow: 0 2px 2px #000;}
.comHeader h2 a { color: #FFF;}
.comHeader img {}





/*common
----------------------------------------*/
.contents { padding: 0 0 80px;}

a.blank {}
a.blank::after { content: ""; background: url("../images2/common/icon-blank.png") 0 0 no-repeat; width: 12px; height: 10px; margin: 0 0 0 10px; display: inline-block;}

a.iconPdf {}
a.iconPdf::after { content: ""; background: url("../images2/common/icon-pdf.png") 0 0 no-repeat; width: 30px; height: 10px; margin: 0 0 0 10px; display: inline-block;}

.ttl { text-align: center; padding: 0 0 50px;}
.ttl h2 { font-size: 2.6rem; letter-spacing: 0.2rem;}
.ttl p { font-size: 1.8rem; color: #999999;}

.ttlLineB { border-bottom: solid 1px #CCC; position: relative; padding: 10px 0; margin: 0 0 50px;}
.ttlLineB::before { content: ""; position: absolute; width: 200px; height: 3px; bottom: -2px; left: 0; background: #0f67a5; z-index: 1;}

.comCol3 { list-style: none; display: flex; flex-wrap: wrap;}
.comCol3 li { margin: 0 0 60px 30px; width: 380px;}
.comCol3 li:nth-child(3n+1) { margin-left: 0;}

.ttl01 { font-size: 2.4rem; padding: 5px 50px; position: relative; margin: 0 0 50px;}
.ttl01::before { content: ""; position: absolute; top: 0; left: 0; bottom: 0; width: 5px; background: #096D97;}
.ttl01::after { content: ""; position: absolute; top: 0; left: 8px; bottom: 0; width: 2px; background: #096D97;}




/*arrow
----------------------------------------*/
a.btn_arrow { display: block;}
a.btn_arrow::after { content: "\f0a9"; font-family: "Font Awesome 5 Free"; font-weight: 900; margin: 0 0 0 10px; color: #1e86bb;}




/*sys_newsList
----------------------------------------*/
/*.sys_newsList {}
.sys_newsList ul { list-style: none; margin: 0 0 50px; padding: 0;}
.sys_newsList ul li { padding: 5px 0; }
.sys_newsList ul li dl { display: flex; margin: 0;}
.sys_newsList li dl dt { width: 240px; margin: 0 0 0 0; }
.sys_newsList li dl dt .day {}
.sys_newsList li dl dt .mark { font-size: 1.2rem; line-height: 24px; width: 80px; height: 24px; text-align: center; display: inline-block; float: right;}
.sys_newsList li dl dd { margin: 0 0 0 50px; width: 910px;}*/

.fot { text-align: center;}
.fot p { font-size: 1.4rem; margin: 0 0 20px;}
.fot .paging {}
.fot .paging span { margin: 0 4px;}
.fot .paging .disabled { display: none;}
.fot .paging span.current { display: inline-block; width: 30px; height: 30px; text-align: center; line-height: 30px; border: solid 1px #333; background: #333; color: #FFF;}
.fot .paging span a { display: inline-block; width: 30px; height: 30px; text-align: center; line-height: 30px; border: solid 1px #333; color: #333;}
.fot .paging span a:hover { display: inline-block; width: 30px; height: 30px; text-align: center; line-height: 30px; border: solid 1px #333; background: #333; color: #FFF;}
.fot .paging span a.prev { width: auto; border: none; white-space: nowrap;}
.fot .paging span a.next { width: auto; border: none; white-space: nowrap;}
.fot .paging span a.prev:hover  { background: #FFF; color: #333;}
.fot .paging span a.next:hover  { background: #FFF; color: #333;}

.sys_newsDetail {}
.sys_newsDetail .hed { position: relative; width: 100%; border-bottom: solid 2px #086DB0; padding: 20px 50px; margin: 50px 0 0; box-sizing: border-box;}
.sys_newsDetail .hed h2 { font-size: 2.4rem; margin: 0 150px 0 0;}
.sys_newsDetail .hed .sub { position: absolute; top: 0; right: 50px; text-align: center; padding: 10px; background: #086DB0; border-radius: 5px;}
.sys_newsDetail .hed .sub .cate { color: #FFF; margin: 0 0 10px}
.sys_newsDetail .hed .sub .day { background: #FFF; font-size: 1.4rem; padding: 5px; border-radius: 3px;}
.sys_newsDetail .comment { padding: 50px; margin: 0 0 0; overflow: hidden;}
.sys_newsDetail .comment .img { float: right; width: 500px; margin-left: 30px;}
.sys_newsDetail .comment .img img { width: 100%; margin: 0 0 30px;}
.sys_newsDetail .comment .txt { width: auto;}

.sys_newsDetail .wnlink a { padding: 10px 50px;}
.sys_newsDetail .wnlink a::after { content: ""; background: url("../images2/common/icon-blank.png") 0 0 no-repeat; width: 12px; height: 10px; margin: 0 0 0 10px; display: inline-block;}

.sys_newsDetail a.pdf_icon { padding: 10px 50px;}
.sys_newsDetail a.pdf_icon .kb { margin: 0 10px; color: #666;}
.sys_newsDetail a.pdf_icon::after { content: ""; background: url("../images2/common/icon-pdf.png") 0 0 no-repeat; width: 30px; height: 10px; margin: 0 0 0 10px; display: inline-block;}

.sys_newsDetail .btn { text-align: center; padding: 100px 0 50px;}
.sys_newsDetail .btn a { display: inline-block; padding: 10px; width: 400px; text-align: center; background: #1e86bb; color: #FFF; }


}




/* モバイルレイアウト : 480 px およびそれ以下. */
/*sp*/
@media only screen and (max-width: 767px) {

html { font-size: 55.0%;}
body { font-size: 1.6rem;}



.wrap { width: 100%; margin: auto;}
.w1200 { width: 100%; margin: auto;}
.w1000 { width: 100%; margin: auto;}
.w960 { width: 100%; margin: auto;}
.w900 { width: 100%; margin: auto;}
.w850 { width: 100%; margin: auto;}

.pc { display: none;}
.sp { display: block;}
.pcBr { display: none;}
.spBr { display: inline-block;}

/*#totop { position: fixed; bottom: 80px; right: 30px; z-index: 1000;}
#totop a { display: block; width: 30px; height: 30px; background: #000; text-align: center; cursor: pointer; line-height: 30px;}
#totop a:hover {}
#totop a i { color: #FFF;}*/

.pdTB60 { padding: 10% 0;}
.pdTB40 { padding: 6% 0;}

.is-hidden { visibility: hidden; opacity: 0; height: 0; padding: 0 !important; margin: 0 !important; border: none;}
.more { text-align: center; margin: 30px 0 0;}
.more button { display: inline-block; background: #1e86bb; color: #FFF; padding: 10px 50px; border: none;}


/*header
----------------------------------------*/
/*header { width: 100%; height: auto; position: relative; z-index: 20;}
header h1 { width: 220px; padding: 20px 0 5px 20px;}
header h1 a { height: 100%; display: block;}
header h1 a img { width: auto; height: 100%; vertical-align: top;}
header ul { position: absolute; top: 5px; right: 0; padding: 12px; box-sizing: border-box;}
header ul li { width: 50px; height: 50px; position: absolute; top: 5px; right: 70px; padding: 10px; box-sizing: border-box;}
header ul li i { font-size: 3.0rem;}

header .spMenu { width: 50px; height: 50px; position: absolute; top: 5px; right: 10px; padding: 14px 10px; box-sizing: border-box;}
header .spMenu .menu-trigger,
header .spMenu .menu-trigger span { display: inline-block; transition: all .4s; box-sizing: border-box; cursor: pointer;}
header .spMenu .menu-trigger { position: relative; width: 30px; height: 22px; }
header .spMenu .menu-trigger span { position: absolute; left: 0; width: 100%; height: 2px; background-color: #000;}
header .spMenu .menu-trigger span:nth-of-type(1) { top: 0; }
header .spMenu .menu-trigger span:nth-of-type(2) { top: calc( 100% / 2 - 1px); }
header .spMenu .menu-trigger span:nth-of-type(3) { bottom: 0; }*/

.menu .service_menu .has-drawer .drawer-menu ul li a img {
width: 30px!important;
height: 30px;
margin: 0 5px 0 0;
}


/*sp menu
----------------------------------------*/
/*.header-inner { position: fixed; top: 0; width: 100%; height: 100%; margin: 0; background: #086db0; z-index: 10000; overflow-y: scroll; box-sizing : border-box;}
.header-inner .spMenu .menu-trigger.active,
.header-inner .spMenu .menu-trigger.active span { display: inline-block; transition: all .4s; box-sizing: border-box; }
.header-inner .spMenu .menu-trigger.active { position: relative; width: 40px; height: 34px; }
.header-inner .spMenu .menu-trigger.active span { position: absolute; left: 0; width: 100%; height: 2px; background-color: #FFF;}
.header-inner .spMenu .menu-trigger.active { position: fixed; top: 30px; right: 20px;}
.header-inner .spMenu .menu-trigger.active span { position: absolute; left: 0; width: 100%; height: 2px; background-color: #FFF;}
.header-inner .spMenu .menu-trigger.active span:nth-of-type(1) { -webkit-transform: translateY(10px) rotate(-45deg); transform: translateY(10px) rotate(-45deg); }
.header-inner .spMenu .menu-trigger.active span:nth-of-type(2) { left: 50%; opacity: 0; -webkit-animation: active-menu-bar02 .8s forwards; animation: active-menu-bar02 .8s forwards; }
.header-inner .spMenu .menu-trigger.active span:nth-of-type(3) { top: 110%; -webkit-transform: translateY(-27px) rotate(45deg); transform: translateY(-27px) rotate(45deg); }
.header-inner .main { padding: 100px 0 0;}
.header-inner .main > ul { list-style: none; margin: 0 5% 40px; padding: 0 0 10px;}
.header-inner .main > ul > li { text-align: left; font-size: 1.8rem; background: #FFF; margin: 0 0 20px; padding: 10px 10px; box-shadow: 0px 10px 10px -5px rgba(0,0,0,0.5);}
.header-inner .main > ul > li > a { font-size: 2.0rem; color: #000; display: block; position: relative;}
.header-inner .main > ul > li > a::after { content: "\f061"; font-family: "Font Awesome 5 Free"; font-weight: 900; color: #999; margin: 0 0 0 20px; font-size: 1.6rem;}
.header-inner .main > ul > li > ul { list-style: none; padding: 5px 0 0; margin: 5px 0 0; border-top: dotted 1px #333;}
.header-inner .main > ul > li ul li { width: 90%; padding: 0 1em; position: relative; margin: 2px 0;}
.header-inner .main > ul > li ul li::after { content: "\f054"; font-family: "Font Awesome 5 Free"; font-weight: 900; color: #1e86bb; position: absolute; left: 0.3rem; top: 0.5rem; font-size: 1.2rem;}
.header-inner .main > ul > li ul li a { font-size: 1.4rem; color: #666; display: block;}
.header-inner .main p { text-align: center; padding: 30px 0 30px; background: #FFF;}
.header-inner .main p a{ width: 24px;display: inline-block}*/

.sp_list .has-drawer .drawer-menu ul li a img {
width: 30px!important;
height: 30px;
margin: 0 5px 0 0;
}







/*footer
----------------------------------------*/
/*footer { padding: 50px 0 0; margin: 0 0 50px; background: #F9FAF8;}
footer .col4 { padding: 0 20px 80px;}
footer .col4 > ul { list-style: none; display: flex; justify-content: space-between;}
footer .col4 > ul > li { width: 23%;}
footer .col4 > ul > li h3 { font-size: 1.8rem; padding: 0 10px 15px; border-bottom: solid 1px #999; position: relative;}
footer .col4 > ul > li h3::before { content: ""; width: 10px; height: 10px; display: inline-block; border-right: solid 1px #666; border-top: solid 1px #666; position: absolute; top: 10px; right: 10px; transform: rotate(45deg);}
footer .col4 > ul > li h3::after { content: ""; width: 80%; height: 1px; background: #666; display: inline-block; position: absolute; top: 15px; right: 10px;}
footer .col4 > ul > li h3 span { background: #F9FAF8; padding: 0 20px 0 0; position: relative; z-index: 10;}
footer .col4 > ul > li > ul { list-style: none; padding: 10px 10px 0;}
footer .col4 > ul > li > ul li {}
footer .col4 > ul > li > ul li a { font-size: 1.4rem;}
footer .logo { text-align: center; margin: 0 0 70px;}
footer .logo img { width: 200px; height: auto; display: inline-block;}
.cp { text-align: center; background: #0F67A5; color: #FFF; font-size: 1.2rem; padding: 10px 0;}*/






/*SNS
----------------------------------------*/
/*.sns { background: #d3d3d3; padding: 20px 0;}
.sns ul { list-style: none; display: flex; justify-content: center;}
.sns ul li { margin: 0 10px;}
.sns ul li a { display: block; text-align: center;}
.sns ul li a img { width: 30px; height: 30px;}
.sns ul li a .currentColor { fill: #0f67a5;}*/





/*comHeader
----------------------------------------*/

.comHeader { padding: 10px 0 30px;
background: #00B4DB;  /* fallback for old browsers */
background: -webkit-linear-gradient(to right, #0083B0, #00B4DB);  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to right, #0083B0, #00B4DB); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}
.comHeader { padding: 30px 0 30px;}
.comHeader .pankuzu { list-style: none; margin: 20px 0 10px; display: none; justify-content: flex-start;}
.comHeader .pankuzu li { color: #c8c8c8; font-size: 1.2rem;}
.comHeader .pankuzu li::after { font-family: "Font Awesome 5 Free"; content: "\f054"; font-weight: 900; padding: 0 10px;}
.comHeader .pankuzu li:last-of-type::after { content: none;}
.comHeader .pankuzu li a { color: #c8c8c8;}
.comHeader h2 { margin: 0 0 0; text-align: center; color: #FFF; text-shadow: 0 2px 2px #000; padding: 0 10%;}
.comHeader h2 a { color: #FFF;}
.comHeader img {}




/*cont
----------------------------------------*/
.contents { padding: 0 0 80px;}

a.blank {}
a.blank::after { content: ""; background: url("../images2/common/icon-blank.png") 0 0 no-repeat; width: 12px; height: 10px; margin: 0 0 0 10px; display: inline-block;}

a.iconPdf {}
a.iconPdf::after { content: ""; background: url("../images2/common/icon-pdf.png") 0 0 no-repeat; width: 30px; height: 10px; margin: 0 0 0 10px; display: inline-block;}

.ttl { text-align: center; padding: 0 0 50px;}
.ttl h2 { font-size: 2.0rem; letter-spacing: 0.2rem;}
.ttl p { font-size: 1.4rem; color: #999999;}

.ttl01 { font-size: 2.0rem; padding: 5px 30px; position: relative; margin: 0 0 5%;}
.ttl01::before { content: ""; position: absolute; top: 0; left: 0; bottom: 0; width: 5px; background: #096D97;}
.ttl01::after { content: ""; position: absolute; top: 0; left: 8px; bottom: 0; width: 2px; background: #096D97;}

.comCol3 { list-style: none; display: flex; flex-wrap: wrap;}
.comCol3 li { margin: 0 auto 10%; max-width: 380px;}






/*table_scroll
----------------------------------------*/
.scroll {}
.scroll table { width: 100%;}
.scroll { overflow: auto; white-space: nowrap;}
.scroll::-webkit-scrollbar { height: 5px;}
.scroll::-webkit-scrollbar-track { background: #F1F1F1;}
.scroll::-webkit-scrollbar-thumb { background: #BCBCBC;}






.sys_newsDetail {}
.sys_newsDetail .hed { position: relative; width: auto; border-bottom: solid 2px #086DB0; padding: 20px 0; margin: 50px 2% 0; box-sizing: border-box;}
.sys_newsDetail .hed h2 { font-size: 2.4rem; margin: 0 100px 0 0;}
.sys_newsDetail .hed .sub { position: absolute; top: 0; right: 0; text-align: center; padding: 10px; background: #086DB0; border-radius: 5px;}
.sys_newsDetail .hed .sub .cate { color: #FFF; margin: 0 0 10px}
.sys_newsDetail .hed .sub .day { background: #FFF; font-size: 1.4rem; padding: 5px; border-radius: 3px;}
.sys_newsDetail .comment { padding: 50px 2%; margin: 0 0 0;}
.sys_newsDetail .comment .img { width: auto; margin: 20px 10% 0;}
.sys_newsDetail .comment .img img { width: 100%; margin: 0 0 30px;}

.sys_newsDetail .wnlink a { padding: 10px 2%;}
.sys_newsDetail .wnlink a::after { content: ""; background: url("../images2/common/icon-blank.png") 0 0 no-repeat; width: 12px; height: 10px; margin: 0 0 0 10px; display: inline-block;}

.sys_newsDetail a.pdf_icon { padding: 10px 2%;}
.sys_newsDetail a.pdf_icon .kb { margin: 0 10px; color: #666;}
.sys_newsDetail a.pdf_icon::after { content: ""; background: url("../images2/common/icon-pdf.png") 0 0 no-repeat; width: 30px; height: 10px; margin: 0 0 0 10px; display: inline-block;}

.sys_newsDetail .btn { text-align: center; padding: 100px 0 50px;}
.sys_newsDetail .btn a { display: inline-block; padding: 10px; width: 400px; text-align: center; background: #1e86bb; color: #FFF; }




}