@charset "UTF-8";

/* --------------------------------------------------
 Base
-------------------------------------------------- */
@import url(//fonts.googleapis.com/earlyaccess/notosansjapanese.css);
 
body,ol,ul,dl,li,dt,dd,table,th,td,input,textarea,select,h1,h2,h3,h4,h5,h6{
color:#313131;
font-weight:normal;
font-family:"ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", 'Noto Sans Japanese', Verdana, Roboto, "Droid Sans", "游ゴシック", YuGothic, "メイリオ", Meiryo, sans-serif; /* Gothic */
font-weight:300;
letter-spacing:0;
margin:0;
padding:0;
-webkit-text-size-adjust:100%;
}

body{
min-width:320px;
line-height:2.4;
font-size:100%;
word-wrap:break-word;
position:relative;
overflow-x:hidden;
}

@media screen and (max-width: 767px) {
body{
font-size:85%;
line-height:1.8;
}
}

img{
max-width:100%;
vertical-align:middle;
}

input{
padding:5px 8px;
}

textarea{
padding:3px;
}

ol{
margin:0px 0px 0px 21px;
}

ol > li{
list-style:decimal outside;
margin:0px 0px 3%;
}

a:link,
a:visited{
color:#313131;
text-decoration:underline;
outline:0;
}

a:hover,
a:active{
color:#444;
text-decoration:none;
}

em{
font-style:normal;
font-weight:bold;
color:#313131;
}

strong{
font-style:normal;
font-weight:bold;
}

/* --------------------------------------------------
 Wrapper
-------------------------------------------------- */
#wrapper{
width:100%;
}


/* --------------------------------------------------
 Pure-drawer
-------------------------------------------------- */
#leftArea{
background-color:#fff;
display:none;
float:left;
left:0;
position:relative;
text-align:center;
top:0;
z-index:999;
}

#leftInner{
box-sizing:border-box;
min-width:300px;
height:102%;
overflow:scroll;
padding:0 0 10%;
width:104%;
}

#leftArea .logo{
max-width:240px;
text-align:center;
margin:30px auto 0;
padding:0 8%;
box-sizing:border-box;
}

#leftArea .logo a{
text-decoration:none;
}

#leftArea .logo .txt01{
font-size:120%;
color:#248cc8;
padding:10px 0 20px;
display:block;
}

#leftArea .gNav{
max-width:240px;
margin:20px auto 30px;
padding:0 2%;
}

#leftArea .gNav li{
line-height:1.8;
text-align:left;
border-bottom:1px solid #d2dce6;
}

#leftArea .gNav li a{
background:url(../img/common/arrow_right_blue.png) no-repeat 98% center;
color:#0f2b77;
padding:7px 7%;
text-decoration:none;
display:block;
position:relative;
}

#leftArea .gNav li a:hover{
opacity:0.7;
}

#leftArea .gNav li.accordion a{
background:url(../img/common/icon_plus_blue.png) no-repeat 98% center;
}

#leftArea .gNav li.accordion a.onclick{
background:url(../img/common/icon_minus_blue.png) no-repeat 98% center;
}

#leftArea .gNav li.accordion a:after{
content:"";
background-color:#fff;
width:100%;
height:1px;
position:absolute;
bottom:0;
left:0;
opacity:0;
transition:all 200ms ease-in-out;
}

#leftArea .gNav li.accordion a.onclick:after{
opacity:1;
}

#leftArea .gNav li.accordion .accordContent li{
border-bottom:none;
}

#leftArea .gNav li.accordion .accordContent li a{
background:url(../img/common/arrow_right_blue.png) no-repeat 98% center;
font-size:90%;
padding:10px 7% 10px 10%;
}

#leftArea .gNav li .txt01{
display:block;
}

#leftArea .gNav li .txt02{
font-size:90%;
color:#ca2b25;
display:block;
}

#leftArea .gNav li.mainSite{
background:#0f2b77;
margin-top:10px;
}

#leftArea .gNav li.mainSite a{
color:#fff;
text-align:center;
padding:15px 7%;
}

#leftArea .gNav li.mainSite a .txt{
background:url(../img/common/icon_build.png) no-repeat left center;
background-size:auto 30px;
display:inline-block;
padding-left:30px;
}

#leftArea .tel{
color:#0f2b77;;
font-size:90%;
max-width:240px;
letter-spacing:0.2em;
line-height:2.4;
margin:30px auto;
padding:0 2%;
box-sizing:border-box;
}

.pure-pusher-container{
height:100%;
position:relative;
}

.pure-pusher{
height:100%;
}

input#pure-toggle-left,
label.pure-toggle-label{
display:none;
}

@media screen and (max-width: 1200px) {
#leftArea{
display:block;
height:100%;
margin-top:0;
overflow:hidden;
position:fixed;
}

.pure-pusher{
overflow-y:auto;
}
}

@media screen and (max-width: 767px) {
#leftArea .gNav li a{
padding-top:10px;
padding-bottom:10px;
}

#leftArea .tel{
font-size:100%;
}
}

@media only screen and (max-width: 40.063em) {
#leftArea .logo{
max-width:300px;
}

#leftArea .gNav{
max-width:300px;
}

#leftArea .tel{
max-width:300px;
}
}

@media screen and (max-width: 480px) {
#leftArea .logo{
max-width:240px;
}

#leftArea .gNav{
max-width:240px;
}

#leftArea .tel{
max-width:240px;
}
}


/* --------------------------------------------------
 Header
-------------------------------------------------- */
#header{
width:100%;
text-align:center;
position:relative;
box-sizing:border-box;
}

#header .inner{
background-color:rgba(255,255,255,1);
transition:all 200ms ease-in-out;
}

#header .inner.fixNav{
background-color:#fff;
width:100%;
position:fixed;
top:0;
left:0;
z-index:999;
box-sizing:border-box;
}

#header #logo{
text-align:left;
margin-right:20px;
display:inline-block;
}

#header #logo a{
text-decoration:none;
}

#header #logo a > img{
max-width:240px;
transition:all 200ms ease-in-out;
}

#header #logo a > .txt01{
color:#248cc8;
display:inline-block;
margin-left:15px;
transition:all 200ms ease-in-out;
font-size: 150%;
font-weight: bold;
}

#header #gNav{
text-align:left;
display:inline-block;
}

#header #gNav > ul{
letter-spacing:-0.4em;
}

#header #gNav > ul > li{
letter-spacing:normal;
display:inline-block;
}

#header #gNav > ul > li a{
color:#0f4b89;
text-decoration:none;
display:block;
}

#header #gNav > ul > li > a{
padding:25px 20px;
position:relative;
transition:all 200ms ease-in-out;
}

#header #gNav > ul > li.active > a{
background-color:#248cc8;
color:#fff;
}

#header #gNav > ul > li > a[href^="#"]{
cursor:default;
}

#header #gNav > ul > li > a:after{
content:"";
background-color:#248cc8;
width:0;
height:5px;
margin:0 auto;
position:absolute;
top:0;
left:0;
right:0;
transition:all 200ms ease-in-out;
}

#header #gNav > ul > li.active a:after{
width:100%;
}

#header #gNav > ul > li:hover a:after{
width:100%;
}

#header #gNav > ul > li.mainSite{
background-color:#0f4b89;
position:relative;
z-index:1002;
transition:all 200ms ease-in-out;
}

#header #gNav > ul > li.mainSite:hover{
background-color:#248cc8;
}

#header #gNav > ul > li.mainSite > a:after{
display:none;
}

#header #gNav > ul > li.mainSite > a{
background:url(../img/common/icon_build.png) no-repeat left 20px center;
background-size:auto 50px;
color:#fff;
padding-left:65px;
transition:all 200ms ease-in-out;
}

#header #gNav ul .subNav{
background-color:rgba(255,255,255,0.7);
width:100%;
visibility:hidden;
opacity:0;
position:absolute;
top:calc(100% - 8%);
left:0;
z-index:999;
transition:all 200ms ease-in-out;
box-shadow:0 3px 5px 0 rgba(0, 0, 0, 0.2);
}

#header #gNav ul .subNav > .upCommBlc{
padding-top:20px;
padding-bottom:20px;
box-sizing:border-box;
}

#header #gNav ul .subNav li{
width:49%;
margin:0 2% 10px 0;
float:left;
display:block;
}

#header #gNav ul .subNav li:nth-of-type(2n){
margin-right:0;
}

#header #gNav ul .subNav li a{
background:#fff url(../img/common/arrow_right_blue.png) no-repeat right 20px center;
font-size:100%;
height:auto;
border:2px solid #248cc8;
line-height:inherit;
padding:7px 5%;
text-align:center;
position:static;
overflow:visible;
opacity:0;
}

#header #gNav ul .subNav li a:hover{
background-image:url(../img/common/arrow_right_white.png);
background-color:#248cc8;
color:#fff;
}

#header #gNav ul .subNav li a:after{
display:none;
}

#header #gNav ul li:hover > .subNav{
top:100%;
visibility:visible;
opacity:1;
}

#header #gNav ul li:hover > .subNav a{
opacity:1;
}

@media screen and (max-width: 1300px) {
}

@media screen and (max-width: 1200px) {
#header #logo{
margin-right:0;
}

#header #logo a{
padding:15px 0;
display:inline-block;
}

#header #logo a > img{
max-width:200px;
}

#header #gNav{
display:none;
}
}

@media screen and (max-width: 1000px) {
}

@media screen and (max-width: 480px) {
#header #logo {
margin-right: -10%;
}

#header #logo a{
padding:16px 0;
}

#header #logo a > img{
max-width:130px;
margin-top: 0;
}

#header #logo a > .txt01{
font-size:90%;
}
}


/* --------------------------------------------------
 Contents
-------------------------------------------------- */
#contents{
width:100%;
position:relative;
z-index:1;
}

@media screen and (max-width: 1000px) {
}

@media screen and (max-width: 767px) {
}

@media screen and (max-width: 480px) {
}



/* --------------------------------------------------
 Footer
-------------------------------------------------- */
#footer{
width:100%;
box-sizing:border-box;
}

#footer .btnPageTop{
text-align:center;
padding:4% 2%;
}

#footer .btnPageTop a{
background:url(../img/common/arrow_up_blue_big.png) no-repeat center top;
background-size:100% auto;
color:#0f2b77;
text-decoration:none;
padding:27px 15px 0;
display:inline-block;
}

#footer .copyright{
background-color:#0f2b77;
color:#fff;
font-size:90%;
text-align:center;
padding:10px 2%;
}

@media screen and (max-width: 1000px) {
}

@media screen and (max-width: 767px) {
#footer .btnPageTop{
padding-top:20px;
padding-bottom:20px;
}
}

@media screen and (max-width: 480px) {
}