@charset "UTF-8";

#root p{
font-size: 130%;
color: rgba(1, 88, 162, 1);
font-weight: bold;
}

.commBlc{
max-width:1000px;
padding:0 2%;
margin:0 auto;
position:relative;
}

.commBlc h1{
font-size: 200%;
padding: 8% 5%;
font-weight: bold;
background-color:rgba(1, 88, 162, 1);
color:#fff;
}

.commBlc h3{
font-size: 140%;
padding: 5% 2%;
font-weight: bold;
color:rgba(1, 88, 162, 1);
}


.clearFix:after{
content:"";
clear:both;
display:block;
}

.marginBtmMiddle{
margin-bottom:4%;
}

.bigInformation{
box-sizing: border-box;
position: absolute;
top: 50px;
left: 5%;
right: 5%;
min-height: calc(100vh - 100px);
z-index: 90;
padding: 5%;
background: rgba(255,255,255,0.85);
box-shadow: 1px 1px 3px rgba(0,0,0,0.8);
font-size: 150%;
}
.bigInformation .ttl{
font-size: 150%;
font-weight: bold;
color: #e00;
text-align: center;
margin: 0 0 5%;
}
.bigInformation .txt{
text-align: left;
margin: 0 0 5%;
}
.bigInformation .outro{
text-align: right;
}


/* Clear --------------- */
.clear{
clear:both;
}

/* Hide --------------- */
.hidden{
position:absolute;
text-indent:-9999px;
overflow:hidden;
}

.disnon{
display:none;
}

/* PDF icon --------------- */
.icnPdf{
vertical-align:bottom;
margin:0px 3%;
}

.hideBr br{
display: none;
}

.hideClass{
display: none;
}

/* --------------------------------------------------
 Text
-------------------------------------------------- */
.txtCenter{
text-align: center;
}

.txtLine{
margin:0 0 2%;
}

.txtBig{
font-size:115%;
}

.txtBiger{
font-size:140%;
}

.txtSmall{
font-size:85%;
}

.txtRed{
color:#e60000;
}

.txtWeight{
font-weight: bold;
}

@media screen and (max-width: 600px) {
.txtForSp{
text-align:left !important;
}

.txtForSp br{
display:none !important;
}
}

/* --------------------------------------------------
 required
-------------------------------------------------- */
.required,
.nRequired{
background-color:#f74b4b;
color:#fff;
display:inline-block;
font-size:12px;
margin:0 5px;
padding:0;
text-align:center;
line-height:23px;
width:40px;
border-radius:5px;
}

.nRequired{
background-color:#999;
}

.errorTxt{
font-weight: bold;
color: rgb(255,0,0);
}

.bottomPad{
margin-bottom: 5%;
}

#contents{
margin-bottom: 40px;
}

#listStyle01{
background-color: rgb(255, 255, 255);
}

#listStyle01 ul{
width: 100%;
max-width: 1000px;
margin: 0 auto;
}

#listTtl{
float: left;
display: table;
width: 50%;
text-align: center;
background: url(../img/common/erabu_04.jpg) no-repeat center top rgb(255,255,255);
background-size: cover;
}

#listTtl > h1{
display: table-cell;
vertical-align: middle;
font-size: 130%;
font-weight: bold;
color: rgb(255,255,255);
}

#listTtl > h1 > span{
font-size: 140%;
color: rgb(255,219,0);
}

#listLnk{
float: left;
width: 50%;
}

#listLnk > ul{
background-color: rgb(255,255,255);
width: calc(100% - 10px);
padding: 2% 5px;
}

#listLnk > ul > li{
float:left;
text-align: center;
width: 25%;
margin-top: 1%;
padding: 2% 0;
box-sizing: border-box;
}

#listLnk > ul > li p{
width: calc(100% - 10px);
padding: 5px 5px 0;
}

#listLnk > ul > li > a{
text-decoration: none;
display: block;
}

#listLnk > ul > li > a > img{
width: 50%;
}

.blcComm{
margin: 3% auto;
}

@media screen and (max-width: 1000px) {
.bridgeForm{
width: 100% !important;
}

#listTtl{
width: 40%;
}

#listLnk{
width: 60%;
}
}

@media screen and (max-width: 768px) {
#listTtl{
float: none;
width: 100%;
padding: 20% 0;
}

#listTtl > h1{
font-size: 180%;
}

#listLnk{
float: none;
width: 100%;
}

#listLnk > ul > li{
width: 20%;
}
}

@media screen and (max-width: 600px) {
#listLnk > ul > li{
width: 25%;
}
}

@media screen and (max-width: 480px) {
#listTtl{
font-size: 100%;
}

#listTtl > h1 {
    font-size: 160%;
}

#listLnk > ul > li{
width: 33.3%;
}
}

#blcErabu00{
padding-bottom: 2%;
}

#blcErabu00 > ul{
text-align: right;
width: 100%;
max-width: 1000px;
margin: 0 auto;
}

#blcErabu00 > ul > li{
display: inline-block;
font-size: 80%;
}

#blcErabu00 > ul > li > a{
display: inline-block;
font-size: 80%;
}

#blcErabu00 > ul > li:not(:nth-last-child(1)):after{
content: '>';
margin: 0 10px;
}

#blcErabu00 > h1{
text-align: center;
font-size: 180%;
font-weight: bold;
color: rgb(1,88,162); 
padding: 2% 0 0 0;
}
#blcErabu00 > h2{
text-align: center;
font-size: 90%;
color: rgb(68,68,68);
}

#linkBt{
height: 70px;
background: url('../img/common/bg_01.jpg') repeat top left;
padding: 1% 0;
}

#linkBt > div{
position: relative;
text-align: center;
width: 300px;
height: 50px;
border: 1px solid rgb(255,255,255);
box-sizing: border-box;
margin: 10px auto;
}

#linkBt > div > a{
display: block;
text-decoration: none;
line-height: 50px;
color: rgb(255,255,255);
}

#linkBt > div:before{
position: absolute;
content: '^';
color: transparent;
background: url('../img/common/list.png') no-repeat top left;
top: 20px;
left: 23px;
}

#linkDiv{
width: 100%;
max-width: 1000px;
margin: 10px auto;
}

#linkDiv > div{
position: relative;
margin: 0 auto;
}

.linkTohead{
position: absolute;
text-align: center;
font-size: 90%;
width: 100px;
height: 100px;
border-radius: 100%;
border: 3px solid rgb(1,88,162);
box-sizing: border-box;
background-color: rgb(255,255,255);
padding-top: 30px;
top: -70px;
right: 0;
}

.linkTohead.clearTop{
top: 0;
}

.linkTohead:after{
position: absolute;
content: '^';
width: 10px;
height: 10px;
color: transparent;
background: url('../img/common/list_02.png') no-repeat center center;
top: 2%;
left: 43%;
}

.contErabu{
float:left;
width: 40%;
padding: 4%;
box-sizing: border-box;
}

.contErabu > img{
margin-left: 20%;
}

.contErabu > p{
font-size: 70%;
margin-top: 4px;
}

.contErabu > p >span{
font-size: 120%;
font-weight: bold;
}

.linkLink{
float:left;
width: 60%;
padding: 2%;
box-sizing: border-box;
}

.listLink{
float: left;
width: 35%;
margin-top: 8%;
}

.listLink > li{
font-size: 130%;
color: rgb(1,88,162);
margin-bottom: 5%;
}

.listLink > li > a{
text-decoration: none;
font-size: 80%;
}

@media screen and (max-width: 768px) {
.hideBr br{
display: block !important;
}

.contErabu{
float: none;
width: 100%;
padding: 0 20%;
box-sizing: border-box;
}

.contErabu > img{
width: 30%;
margin: 0 35% !important;
}

.contErabu > p:nth-of-type(1){
text-align: center;
}

.contErabu > p{
font-size: 80%;
}

.contErabu > p > span{
font-size: 120%;
}

.contErabu > img{
margin-left: 28%;
}

.linkLink{
float: none;
width: 100%;
margin-top: 3%;
}

.listLink{
width: 50%;
margin-top: 0;
}
}

@media screen and (max-width: 600px) {
.linkTohead{
font-size: 70%;
width: 80px;
height: 80px;
border: 2px solid rgb(1,88,162);
padding-top: 27px;
top: 0;
right: 2%;
}
}

@media screen and (max-width: 480px) {
.contErabu{
padding: 0 2%;
}
}


.cateGroup{
width: 100%;
max-width: 1000px;
margin: 2% auto;
}

.cateGroup > li{
float: left;
width: 30.3%;
margin: 1% 1.5%;
border: 1px solid rgb(226,226,226);
box-sizing: border-box;
background-color: rgb(255,255,255);
}

.cateGroup > li a{
text-decoration: none;
}

.cateGroup > li > h3{
text-align: center;
display: table-cell;
vertical-align: middle;
width: 500px;
height: 60px;
line-height: 1.3em;
font-size: 120%;
font-weight: bold;
color: rgb(255,255,255);
border: 1px solid rgb(226,226,226);
box-sizing: border-box;
}

.cataBlc .ttl{
display: block;
text-align: center;
font-size: 120%;
font-weight: bold;
color: rgb(255,255,255);
background-color: rgb(1,88,162);
padding: 2%;
}

.cateGroup.longList{
width: 47% !important;
}

.cateGroup.longList ul {
float: left;
width: 42%;
padding: 2% 0 !important;
box-sizing: border-box;
}

.cateGroup.col3 > li{
width: 97%;
text-align: left;
}

.cateGroup.col3 > li > h3{
width: 1000px;
}

.cateGroup.col3 > li .groupBox{
display: inline-block;
width: calc(29.3% - 4px);
margin: 2%;
vertical-align: top;
}

.cateGroup.col3 > li .groupBox > .ttl{
display: table;
width: 100%;
text-align: center;
height: 60px;
margin: 0 auto 2%;
}

.cateGroup.col3 > li .groupBox > .ttl > h4{
display: table-cell;
vertical-align: middle;
font-size: 130%;
font-weight: bold;
color: rgb(1,88,162);
padding: 0 2%;
}

.cateGroup > li:nth-child(1) > h3{
background: url('../img/index/img_04.jpg') no-repeat top center;
background-size: cover;
}

.cateGroup > li:nth-child(2) > h3{
background: url('../img/index/img_05.jpg') no-repeat top center;
background-size: cover;
}

.cateGroup > li:nth-child(3) > h3{
background: url('../img/index/img_06.jpg') no-repeat top center;
background-size: cover;
}

.cateGroup > li:nth-child(4) > h3{
background: url('../img/index/img_07.jpg') no-repeat top center;
background-size: cover;
}

.cateGroup > li:nth-child(5) > h3{
background: url('../img/index/img_08.jpg') no-repeat top center;
background-size: cover;
}

.cateGroup > li:nth-child(6) > h3{
background: url('../img/index/img_09.jpg') no-repeat top center;
background-size: cover;
}

.cateGroup > li:nth-child(7) > h3{
background: url('../img/index/img_10.jpg') no-repeat top center;
background-size: cover;
}

.cateGroup > li:nth-child(8) > h3{
background: url('../img/index/img_11.jpg') no-repeat top center;
background-size: cover;
}

.cateGroup > li:nth-child(9) > h3{
background: url('../img/index/img_12.jpg') no-repeat top center;
background-size: cover;
}

.cateGroup > li:nth-child(10) > h3{
background: url('../img/index/img_13.jpg') no-repeat top center;
background-size: cover;
}

.cateGroup > li:nth-child(11) > h3{
background: url('../img/index/img_14.jpg') no-repeat top center;
background-size: cover;
}

.cateGroup > li:nth-child(12) > h3{
background: url('../img/index/img_15.jpg') no-repeat top center;
background-size: cover;
}

.cateGroup > li:nth-child(13) > h3{
background: url('../img/index/img_16.jpg') no-repeat top center;
background-size: cover;
}

.cateGroup > li:nth-child(14) > h3{
background: url('../img/index/img_17.jpg') no-repeat top center;
background-size: cover;
}

.cateGroup > li > ul{
list-style-image: url('../img/common/list_01.png');
padding: 4%;
margin: 0 4%;
}

.cateGroup.col3 > li .groupBox ul{
list-style-image: url('../img/common/list_01.png');
padding: 2% 4%;
margin: 0 4%;
}

.cateGroup > li > ul > li{
text-align: left;
font-size: 100%;
margin: 3% 0;
}

.cateGroup.col3 > li .groupBox ul > li{
text-align: left;
font-size: 100%;
margin: 6% 0;
}

.cateGroup > li > p{
text-align: right;
padding: 0 4%;
margin-bottom: 2%; 
}

.cateGroup > li > p > a:before{
content: '>';
color: transparent;
background: url('../img/common/list_01.png') no-repeat center center;
padding-right: 1%;
}

.cateGroup > li > p > a{
font-size: 90%;
text-decoration: none;
color: rgb(1,88,162);
}


@media screen and (max-width: 768px) {
.cateGroup > li{
}

.cateGroup > li > ul > li{
font-size: 110%;
margin: 6% 0;
}

.longList{
width: 63.6% !important;
}

.hideClass{
display: block;
}

.cateGroup > li{
width: 47%;
}

.longList{
width: 97% !important;
}
}

@media screen and (max-width: 480px) {
.cateGroup > li > ul{
margin-left: 6%;
}

.longList > ul{
width: 40%;
}

.cateGroup > li{
width: 97%;
}

.cateGroup.col3 > li .groupBox{
width: calc(96% - 4px);
}
}

/* btnStyle09 --------------- */
.btnStyle09{
width:100%;
max-width:690px;
text-align:center;
padding:0 2%;
margin:20px auto;
display:block;
position:relative;
box-sizing:border-box;
z-index:3;
}

.btnStyle09 .shadow{
background:rgba(230,18,18,1);
background:linear-gradient(to bottom, rgba(241,102,33,1) 0%, rgba(241,102,33,1) 26%, rgba(243,101,35,1) 100%);
border:1px solid #f36523;
-webkit-box-shadow:0px 2px 4px 1px rgba(0,0,0,0.27);
-moz-box-shadow:0px 2px 4px 1px rgba(0,0,0,0.27);
box-shadow:0px 2px 4px 1px rgba(0,0,0,0.27);
display:block;
position:relative;
box-sizing:border-box;
}

.btnStyle09 a{
background:url(../img/common/arrow_right_orange.png) no-repeat right 20px center;
font-weight:900;
color:#fff;
line-height:1.5;
text-decoration:none;
-webkit-box-shadow:inset 0px 0px 10px 0px rgba(146,97,33,0.44);
-moz-box-shadow:inset 0px 0px 10px 0px rgba(146,97,33,0.44);
box-shadow:inset 0px 0px 10px 0px rgba(146,97,33,0.44);
padding:20px 60px 20px 20px;
display:block;
position:relative;
z-index:4;
}

.btnStyle09 .shadow .txt01{
font-size:140%;
display:block;
}

.btnStyle09 .shadow .txt02{
font-size:120%;
display:block;
}

@media screen and (max-width: 480px) {
.btnStyle09 a{
background-position:right 10px center;
background-size:16px auto;
padding:14px 30px 14px 10px;
}

.btnStyle09 .shadow .txt01{
font-size:120%;
}

.btnStyle09 .shadow .txt02{
font-size:100%;
}
}

/* bnrRight ------------------*/
#bnrRight{
background:url(../img/index/bg_bnr01.jpg) no-repeat center center;
background-size:cover;
width:280px;
height:200px;
-webkit-box-shadow:0px 0px 5px 0px rgba(0,0,0,0.2);
-moz-box-shadow:0px 0px 5px 0px rgba(0,0,0,0.2);
box-shadow:0px 0px 5px 0px rgba(0,0,0,0.2);
position:fixed;
bottom:0;
right:0;
z-index:999;
transition:all 800ms ease-in-out;
opacity:0;
-webkit-transform:translateZ(0);
}

#bnrRight .inner{
padding:25px 15px;
}

#bnrRight .inner .txt{
color:#0057a1;
}

#bnrRight .inner .btn a{
background-color:#0057a1;
color:#fff;
font-size:90%;
text-decoration:none;
padding:4px 20px;
margin-top:20px;
display:inline-block;
box-sizing:border-box;
}

#bnrRight .btm{
background-color:#0057a1;
font-size:90%;
width:100%;
padding:7px 10px;
position:absolute;
bottom:0;
left:0;
box-sizing:border-box;
}

#bnrRight .btm > p{
color:#fff;
text-align:center;
}

#bnrRight .btm > p .txtSmall{
font-size:75%;
}

@media screen and (max-width: 768px) {
#bnrRight{
margin:40px auto;
position:relative;
bottom:auto !important;
right:auto;
opacity:1;
}
}
