@charset "UTF-8";

body { }
img { width:auto; max-width:100%;}
.flexBox { display: flex; justify-content: space-between; flex-wrap: wrap;}
.flexBox > * { flex-grow:0; flex-shrink: 1;}

/*ACTIVE MEGA-MENU*/
.btnBoxActive { background-color:#1fa3cf; }

/* HEADER */
#commonHeaderWrapper { width:100%; top:0; left:0; box-sizing:border-box; z-index:1000; border-bottom:#1fa3cf solid 3px; }
#commonHeader { width:100%; max-width:1120px; box-sizing:border-box; padding: 0 20px; margin:0 auto; }
#commonHeader h1 { width:120px; float:left; padding:20px 0 0 10px; box-sizing:border-box; line-height:1.1;}
#commonHeader h1 img[src*=".svg"] {width: 100%; height:auto; vertical-align:top; margin:0; padding:0; line-height:1; }
#commonHeader .btnBox { width:926px; float:right; padding:0 10px 0 0; box-sizing:border-box; }
#commonHeader .btnBox ul { display:flex; flex-wrap:no-wrap; justify-content:space-between; }
#commonHeader .btnBox ul li { flex-grow:0; flex-shrink:1; flex-basis:136px; align-self:center; }
#commonHeader .btnBox ul li:nth-of-type(4),
#commonHeader .btnBox ul li:nth-of-type(5),
#commonHeader .btnBox ul li:nth-of-type(6) { flex-basis:164px; margin:0;  }
#commonHeader .btnBox ul li a { transition:all 0.5s ease-in-out 0s; display:block; position:relative; }
#commonHeader .btnBox ul li a img { position:relative; z-index:10; }
#commonHeader .btnBox ul li:nth-of-type(1) a:hover,
#commonHeader .btnBox ul li:nth-of-type(2) a:hover,
#commonHeader .btnBox ul li:nth-of-type(3) a:hover  { background:#1fa3cf; }
#commonHeader .btnBox ul li:nth-of-type(4) a,
#commonHeader .btnBox ul li:nth-of-type(5) a,
#commonHeader .btnBox ul li:nth-of-type(6) a { background:url(../img/common/bg_header_04.png) no-repeat; background-size:100% 100%; }
#commonHeader .btnBox ul li:nth-of-type(4) a:after { content:' '; display:block; position:absolute; top:0; left:0; width:100%; height:100%; z-index:1; background:url(../img/common/bg_header_01.png) no-repeat; background-size:100% 100%; transition:all 0.5s ease-in-out 0s; }
#commonHeader .btnBox ul li:nth-of-type(5) a:after { content:' '; display:block; position:absolute; top:0; left:0; width:100%; height:100%; z-index:1; background:url(../img/common/bg_header_02.png) no-repeat; background-size:100% 100%; transition:all 0.5s ease-in-out 0s;}
#commonHeader .btnBox ul li:nth-of-type(6) a:after { content:' '; display:block; position:absolute; top:0; left:0; width:100%; height:100%; z-index:1; background:url(../img/common/bg_header_03.png) no-repeat; background-size:100% 100%; transition:all 0.5s ease-in-out 0s;}
#commonHeader .btnBox ul li:nth-of-type(4) a:hover:after,
#commonHeader .btnBox ul li:nth-of-type(5) a:hover:after,
#commonHeader .btnBox ul li:nth-of-type(6) a:hover:after { opacity:0; }

/* SMART PHONE HEADER */
#spHeader { display:none; }
#spHeader.active { display:none; }
#spHeader .logoBox { }
#spHeader .logoBox img { width:100%; height:auto; }
#spNavi { display:none; }
#spNavi.active { display:none; }
#spNaviWrapper.active { display:none; }

/* BREAD CRUMBS */
#breadCrumbs { background:#e0e4e5; margin-top: 20px;}
#breadCrumbs ul { display:block; box-sizing:border-box; width:100%; max-width:1120px; padding:0 20px; margin:0 auto; }
#breadCrumbs ul li { display:block; float:left; }
#breadCrumbs ul li a { display:block; background:#7e7e7e; background-size:auto 100%; font-size:12px; padding:1em 1em 1em 2em; line-height:1.1; color:#fff; font-weight:bold; text-decoration:none; position:relative; }
#breadCrumbs ul li:nth-of-type(1)  a { padding:1em; }
#breadCrumbs ul li a:hover { color:#fff; text-decoration:underline; }
#breadCrumbs ul li a:after { content:' '; display:block; width:9px; height:100%; position:absolute; left:100%; top:0; background:url(../img/common/bg_breadcrumbs_01.png) no-repeat; background-size:100% 100%; z-index:20; }
#breadCrumbs ul li span { display:block; background:#1fa3cf url(../img/common/bg_breadcrumbs_02.png) right no-repeat; background-size:auto 100%; font-size:12px; padding:1em 2em 1em 2em; line-height:1.1; color:#fff; font-weight:bold; text-decoration:none; }

/* CONTENT */
#commonContent { padding:0 0 0 0; }
#commonContent .content { width:100%; max-width:1120px; box-sizing:border-box; padding:0 20px; margin:0 auto; }
#commonContent .content.titleBox { padding:80px 20px 60px 20px;position:relative; }
#commonContent .content.titleBox h2 { font-size:30px; font-weight:bold; color:#000; line-height:1.1;  }
#commonContent .content.titleBox h2 span { display:block; font-size:16px; color:#e3b64b; line-height:1.1; padding:0.5em 0 0 0; margin:0.5em 0 0 0; }
#commonContent .content.titleBox h2 span:before { content:' '; width:5em; background:#e3b64b; height:2px; display:block; margin:0 0 0.5em 0;}
#commonContent .content p.attention { font-size:12px; line-height:1.5em; display:block; }
#commonContent .content ul.attention { }
#commonContent .content ul.attention li { display:block; position:relative; padding:0 0 0 1em; }
#commonContent .content ul.attention li:before {  content:'※'; position:absolute; top:0; left:0; }
#commonContent #mainColumn { width:calc(100% - 270px); float:left; }
#commonContent #subColumn { width:250px; float:right; border-radius:5px; overflow:hidden; }
#commonContent #subColumn h3 {  background:#7e7e7e; color:#fff; font-size:16px; padding:1.75em 0.87em 1.75em 1.75em; font-weight:bold; margin-bottom:0;}
#commonContent #subColumn > ul { }
#commonContent #subColumn > ul > li { border-bottom:#fff solid 1px; }
#commonContent #subColumn > ul > li a { background:#f5f5f5 url(../img/common/bg_sidebar_02.png) 0.8em center no-repeat; background-size:auto 1em; color:#333; text-decoration:none; display:block; padding:2em 1em 2em 2em; font-size:14px; }
#commonContent #subColumn > ul > li a.active,
#commonContent #subColumn > ul > li a:hover { background:#1fa3cf url(../img/common/bg_sidebar_01.png) 0.8em center no-repeat; background-size:auto 1em; color:#fff; text-decoration:none; }

/* FOOTER BNR */
#footerBnr { }
#footerBnr ul { width:100%; max-width:1120px; box-sizing:border-box; padding:15px; margin:0 auto; text-align:center; font-size:0px; }
#footerBnr ul li { margin:5px; display:inline-block; }
#footerBnr ul li a { display:block; }

#footerMutualLink { border-top:#f1f1f1 solid 2px;  }
#footerMutualLink ul { width:100%; max-width:1120px; box-sizing:border-box; padding:0; margin:0 auto; text-align:center; font-size:0px; }
#footerMutualLink ul li { display:inline-block; margin:5px; }
#footerMutualLink ul li a { display:block; transition:opacity 0.5s linear 0s; }
#footerMutualLink ul li a:hover { opacity:0.7; }


/* FOOTER */
#footerWrapper { border-top:#00b9ef solid 1px; }
#footer { width:100%; max-width:1120px; box-sizing:border-box; padding:20px; margin:0 auto; }
#footer .logoBox { width:21.29%; float:left; margin:0 1.85% 0 0; }
#footer .addressBox { width:65.14%; float:left; padding:0.5em 175px 0.5em 0; box-sizing:border-box; position:relative; }
#footer .addressBox .reformBNR { position:absolute; right:0; top:0.5em; width:175px; }
#footer .addressBox h3 {  font-size:24px; color:#00b9ef; font-weight:bold; margin:0 0 0.5em 0; }
#footer .addressBox p { font-size:14px; line-height:1.5; }
#footer .linkBox { width:34.18%; float:right; padding:0.5em 0; }
#footer .linkBox ul { text-align:right; font-size:0px; }
#footer .linkBox ul li { display:inline-block; font-size:12px; margin:0 0 0 1.5em; }
#footer .linkBox ul li a { display:block; background:url(../img/common/bg_footer_01.png) left  center no-repeat; background-size:7px auto; padding:0 0 0 1em; color:#000; text-decoration:none; }
#footer .linkBox ul li a:hover { color:#999; text-decoration:none; }
#footer .linkBox .copyright { font-size:12px; text-align:right; display:block; }

/* 404 */
.notFoundContent { }
.notFoundContent p { font-size:14px; line-height:2em; margin:0 auto 40px auto; }

/* TITLE and FONT STYLE SETTING */
.bearTitle01 { background:#eef4e8; color:#558f1b; font-weight:bold; font-size:18px; padding:1.5em 1em; line-height:1.1; margin:0 0 1.5em 0; }
.blueTitle01 { color:#1fa3cf; font-weight:bold; font-size:18px; margin:0 0 1em 0; }



@media screen and (max-width:1120px) {
/* HEADER */
#commonHeader h1 { width:10.71%; }
#commonHeader .btnBox { width:82.67%; }
#footer .addressBox h3 {  font-size:2.4vw; }
#footer .addressBox p { font-size:1.2vw; }
#footer .linkBox ul li a { font-size:1vw; }
#footer .linkBox .copyright { font-size:1vw; }
}
@media screen and (max-width:768px) {
body { padding:14.24vw 0 0 0; position:relative; }

/* HEADER */
#commonHeader { display:none; }
#spHeader { display:block; box-sizing:border-box; padding:3vw; background:#fff; position:fixed; top:0; left:0; width:100%; z-index:99999998; box-shadow:0 0 3px 3px rgba(0,0,0,0.2); }
#spHeader.active {  display:block; }
#spHeader .logoBox { width:18vw; float:left; }
#spHeader .menuBtn { width:8.24vw; height:8.24vw; float:right; position:relative; background:url(../img/common/btn_spmenu_01.png) no-repeat; background-size:100% 100%; }
#spHeader.active .menuBtn { width:8.24vw; height:8.24vw; float:right; position:relative; background:url(../img/common/btn_spmenu_02.png) no-repeat; background-size:100% 100%; }
#spNavi { position:fixed; top:14.24vw; left:0; width:100%; background:rgba(255,255,255,0.8); box-sizing:border-box; padding:3vw; z-index:99999999; }
#spNavi.active { display:block; }
#spNavi ul { }
#spNavi ul li { border-bottom:#fff solid 1px; }
#spNavi ul li:last-of-type { border-bottom:none; }
#spNavi ul li a { display:block; color:#333; font-size:3vw; text-align:center; text-decoration:none; padding:2vw 0; font-weight:bold; }
#spNavi ul li a:hover { background:#00b9ef; color:#fff; text-decoration:none; }
#spNaviWrapper { display:none; position:fixed; z-index:99999997; width:100%; height:100%; background:rgba(0,0,0,0.2); top:0; left:0; }
#spNaviWrapper.active { display:block; }

/* BREAD CRUMBS */
#breadCrumbs { background:#e0e4e5; display:none; }

/* FOOTER */
#footer .logoBox { width:50%; max-width:240px; margin:0 auto 20px auto; float:none; }
#footer .addressBox { width:100%; float:none; text-align:center; padding:10px 0; }
#footer .addressBox .reformBNR { position:static; margin:10px auto 0 auto; }
#footer .addressBox h3 { font-size:4vw; }
#footer .addressBox p {  font-size:2.5vw; }
#footer .linkBox { width:100%; float:none; }
#footer .linkBox ul { text-align:center; }
#footer .linkBox ul li { margin:0 1em; }
#footer .linkBox ul li a { padding:1em 0 1em 1em; font-size:2.5vw; }
#footer .linkBox .copyright { font-size:2vw; text-align:center; }

/* TITLE and FONT STYLE SETTING */
.bearTitle01 { font-size:14px;  }

}