.sp,
.nodisplay{display:none}

/*html5*//**/
article,aside,canvas,details,figcaption,figure,
footer,header,hgroup,menu,nav,section,summary{display:block;}

html {
  visibility: hidden;
}
html.wf-active {
  visibility: visible;
}

* {margin:0;padding:0;}

body {
margin:0;padding:0;
background:#fff url() no-repeat left top;
font-family: heisei-maru-gothic-std, sans-serif,Meiryo, "ヒラギノ丸ゴ Pro W4", "ヒラギノ角ゴ Pro W3", Verdana, Arial;
font-weight: 400;
font-style: normal;
font-size:14px;
position:relative;
text-align:center;

min-width:320px;
}
.bold{font-family: heisei-maru-gothic-std, sans-serif;font-weight: 800;font-style: normal;}

a{outline:none;}
a:link,a:visited{text-decoration:none;color:#005AA4}
a:hover,a:active{text-decoration:none;color:#DD8334}

p,li,dt,dl {line-height:1.6}
li {list-style-type:none;}
img {border:0;width:auto;height:auto}
img, div, input { behavior: url(../js/iepngfix.htc) }

.wide{letter-spacing:0.2em}
.caution{color:#D83033}

address {font-style:normal;}

.clear {clear:both;}

header{position:relative;}
#contents{position:relative;}
footer{position:relative;}

a.button{
    width:auto;height:70px;line-height:70px;vertical-align:middle;
    border-radius:1px;color:#ffffff;
}

/*HEADER*//**/
header{background:#75c5ef;color:#ffffff;min-height:160px;}
header h1,
header nav{
    position:absolute;left:0;right:0;
    height:40px;line-height:40px;vertical-align:middle;
    width:96%;max-width:1080px;padding:0 2%;margin:auto auto auto auto;
}
@media (max-width: 999px)  {
    header{border-top:80px solid #0074c1;}
    header h1{top:-78px;}
    header nav{top:-38px;}
}
@media (min-width: 1000px)  {
    header{border-top:40px solid #0074c1;}
    header h1,
    header nav{top:-38px;}
}
header h1{text-align:left;}
header nav ul{text-align:right;height:40px;line-height:40px;vertical-align:middle;}
header nav ul li{display:inline;width:auto;border-right:1px solid #ffffff;padding:0 15px;}
header nav ul li:last-child{border-right:none}
header nav ul li a{color:#ffffff!important;}
header h2{
    background-image:url("../img/common/bg_header.png");
    background-position:center;
    background-repeat:repeat-x;
    background-size:cover;    
    font-size:xxx-large;padding:36px 0;line-height:1.4}
header h2 span.subtitle{
    display:block;vertical-align:middle;font-size:large;
}

/*FOOTER*//**/
.common_nav{}
.common_nav p{font-size:x-large;color:#ff7800}
.common_nav p img{width:300px;height:auto;margin:10px auto 30px auto;}
.common_nav ul{width:96%;padding:0 2%;max-width:1080px;margin:auto auto auto auto;}
@media (max-width: 999px)  {
    .common_nav ul li{display:block;margin:10px 0;}
}
@media (min-width: 1000px)  {
    .common_nav ul li{display:inline;width:32%;}
}
.common_nav ul li a,
.common_nav p a{display:inline-block;padding:0 20px;margin:0 15px}
.common_nav ul li a{font-size:large;width:calc(30% - 30px);max-width:calc(11em + 40px);}
.common_nav ul li:nth-of-type(1) a{background:#5ebdee}
.common_nav ul li:nth-of-type(2) a{background:#2499d6}
.common_nav ul li:nth-of-type(3) a{background:#0074c1}
.common_nav p a.button{background:#ff7800;font-size:x-large;margin:30px}


footer{background:#0074c1;color:#ffffff;padding-top:30px}
footer h1 span{display:block;font-size:medium;}
footer h1 img{width:240px;height:auto;margin:10px 0 20px 0}
footer nav{margin:10px 0;}
footer nav ul{width:auto;text-align:center;}
footer nav ul li{display:inline;padding:0 15px;border-right:1px solid #ffffff}
footer nav ul li:last-child{border-right:none}
footer nav ul li a{color:#ffffff!important}
footer p{}
footer p a{color:#ffffff!important;}
footer p img{width:100px;height:auto;margin:10px}
footer p.copy{font-size:small}

/*COMMON*//**/
.sub main article{padding:40px 0;}
.sub main article h3{font-size:x-large;line-height:1.8;margin:10px 0;}
.sub main article p.left{
    font-size:large;
    text-align:left;width:96%;padding:0 2%;max-width:750px;margin:auto auto auto auto;
}




/*INDEX*//**/
#index header{}
#index header h2{}
#index header h2 span{
    display:block;width:calc(18em + 20px);font-size:medium;
    vertical-align:middle;color:#0074c1;background:#ffffff;
    border-radius:20px;padding:10px 10px 6px 10px;margin:auto auto auto auto;
}
#index header h2 img{width:450px;height:auto;}

#index main{}
#index main article.top{height:480px;width:100%;
    background-image:url("../img/common/bg_index_header.png"),
        url("../img/common/bg_index_header_photo.png");
    background-position:center bottom;
    background-repeat:repeat-x;
    background-size:contain,cover;
}
#index main article.top p{font-size:large;line-height:1.8;}
#index main article.top p:nth-of-type(1){padding-top:350px;}
#index main article.top p:nth-of-type(2){line-height:20px;vertical-align:middle;}
#index main article.top p:nth-of-type(2) img{
    display:inline-block;margin:auto 10px auto 10px;height:24px;width:auto;
}

#index main article.ng{max-height:550px;width:100%;padding-bottom:100px;
    background-image:url("../img/common/bg_index_ng.png");
    background-position:center bottom;
    background-repeat:no-repeat;
    background-size:cover;
    
}
#index main article.ng h3{font-size:x-large;color:#464694;padding:40px 0 0 0;}
#index main article.ng div{
    width:96%;max-width:1080px;padding:0 2%;margin:40px auto auto auto}
#index main article.ng div p{
    text-align:center;
    display:inline-block;width:32%;max-width:360px;
    font-size:x-large;color:#392992;
}
#index main article.ng div p img{
    display:block;margin:auto auto 20px auto;
    width:100%;max-width:288px;height:auto;}

#index main article.ok{max-height:480px;width:100%;padding-top:100px;
    position:relative;
    background-image:url("../img/common/bg_index_ok.png");
    background-position:center top;
    background-repeat:no-repeat;
    background-size:cover;
}
#index main article.ok h3{position:absolute;top:-70px;}
#index main article.ok img.okimage{width:96%;height:auto;padding:0 2%;max-width:1080px;}
#index main article.ok p{font-size:large;padding:30px 0;}

/*system*//**/
#system main article.guide{padding:30px 0;width:100%;}
#system main article h3{color:#FF4144}

#system main article.guide p.qanda_link{
    display:block;width:14em;margin:30px auto 30px auto;
    font-size:x-large;padding:10px;background:#59C3DD;border-radius:1px}
#system main article.guide p.qanda_link span{font-size:large;}
#system main article.guide p.qanda_link a{color:#ffffff;
}
#system main article.overview,
#system main article.qanda,
#system main article.company{background:#fffbe7}
#system main article.overview h3 img{
    height:28px;width:auto;vertical-align:middle;margin:-8px 10px 0 10px;}

#system main article.overview section{
    width:96%;padding:0 2%;max-width:1080px;margin:auto auto auto auto;
}
#system main article.overview section div{
    width:32%;max-width:360px;display:inline-block;
    vertical-align:top;
}
#system main article.overview section div h4{
    font-size:80px;margin:20px 0 10px 0;height:80px;line-height:80px;vertical-align:middle;
    position:relative;text-align:center;
}
#system main article.overview section div:nth-of-type(odd) h4{color:#fdcd65;}
#system main article.overview section div:nth-of-type(even) h4{color:#e09999;}
#system main article.overview section div h4 span{
    position:absolute;left:0;right:0;
    color:#0074c1;font-size:x-large;}
#system main article.overview section div h4.l2 span{
    line-height:36px;
    position:absolute;top:5px;left:0;right:0;text-align:center;
}
#system main article.overview section div p{
    text-align:left;width:90%;margin:auto auto auto auto;font-size:medium;line-height:1.8;
}

#system main article.qanda{}
#system main article.qanda p{font-size:medium;padding-bottom:20px;}
#system main article.qanda dl{width:96%;padding:0 2%;max-width:710px;margin:auto auto auto auto;}
#system main article.qanda dl dt,
#system main article.qanda dl dd{width:calc(100% - 40px);max-width:710px;text-align:left;line-height:1.6;position:relative;}
#system main article.qanda dl dt{padding:30px 0px 0 40px;}
#system main article.qanda dl dt:first-child{border-top:1px dashed #FF7678}
#system main article.qanda dl dd{padding:20px 0px 20px 40px;border-bottom:1px dashed #FF7678}
#system main article.qanda dl dt span{
    position:absolute;top:10px;left:0;
    content:"Q";color:#3F9C31;font-size:xx-large}
#system main article.qanda dl dd span{
    position:absolute;top:0;left:0;
    content:"A";color:#FF5456;font-size:xx-large}

#system main article.company table{
    width:96%;padding:0 2%;max-width:750px;margin:auto auto auto auto;
    border-collapse:separate;border-spacing:0 2px;
}
#system main article.company table tr th,
#system main article.company table tr td{
    vertical-align:middle;
    padding:12px 8px 8px 8px;font-size:medium;text-align:left;border-top:1px dashed #FF7E80;
}
#system main article.company table tr:last-child th,
#system main article.company table tr:last-child td{
    border-bottom:1px dashed #FF7E80;
}
#system main article.company table tr th{width:8em;}
#system main article.company table tr td{width:auto;}
#system main article.company table tr td a{color:#FF7E80!important}    


/*flow*//**/
#flow main article.guide{padding:30px 0;width:100%;}
#flow main article h3{color:#ff7800;}
#flow main article.step{background:#e2efdc}
#flow main article.step section{
    position:relative;
    width:96%;padding:0 2%;max-width:1080px;margin:auto auto auto auto;
}
#flow main article.step section img.arrow{
    position:absolute;top:80px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
}
@media (max-width: 1130px)  {
    #flow main article.step section img.arrow{width:50%;max-width:552px;height:auto;}
}
#flow main article.step section div{
    width:24%;max-width:270px;display:inline-block;
    vertical-align:top;text-align:center;
}
#flow main article.step section div h4{
    font-size:x-large;margin:30px auto 20px auto;text-align:center;color:#1875ff;}
#flow main article.step section div h4 span{font-size:large;padding-right:1em;}
#flow main article.step section div p{
    text-align:left;width:90%;margin:auto auto auto auto;font-size:medium;line-height:1.8;
}

/*fee*//**/
#fee main article.guide{padding:30px 0;width:100%;}
#fee main article h3{color:#33a671}
#fee main article.fee{background:#ffe0e0;}
#fee main article.fee section{
    width:96%;padding:0 2%;max-width:750px;margin:auto auto auto auto;
}
#fee main article.fee section table{
    max-width:750px;border-collapse: separate;border-spacing:0 2px;}
#fee main article.fee section table tr th,
#fee main article.fee section table tr td{
    vertical-align:middle;line-height:1.8;
    font-size:medium;text-align:left;width:auto;padding:10px;}
#fee main article.fee section table tr th{background:#33a671;color:#ffffff;}
#fee main article.fee section table tr td{background:#8dd5b4;}
#fee main article.fee section:nth-of-type(1) table tr th{width:12em;}
#fee main article.fee section:nth-of-type(2) table tr th{width:20em;}
#fee main article.fee section h4{
    font-size:medium;margin:20px auto 10px auto;text-align:center;color:#33a671;}
#fee main article.fee section:nth-of-type(2){padding-top:10px}
#fee main article.fee section:nth-of-type(2) p{font-size:medium;padding:10px 0;}
#fee main article.fee section:nth-of-type(2) table tr td{background:#33a671;color:#ffffff;}

/*contact*//**/
#contact main article.guide{padding:30px 0;width:100%;}
#contact main article h3{color:#115ABC}
#contact main article.guide ul.left{
    font-size:large;
    text-align:left;width:96%;padding:0 2%;max-width:750px;margin:auto auto auto auto;}
#contact main article.guide ul.left li{margin:0 0 10px 0;}
#contact main article.guide p{
    display:inline-block;border-radius:1px;padding:10px;margin:10px;
    font-size:medium;color:#ffffff;width:auto;   
}
#contact main article.guide p.ok{background:#33a671;}
#contact main article.guide p.ng{background:#FF3538;}

#contact main article.form{background:#bddeff;}
#contact main article.form table{
    text-align:left;width:96%;padding:0 2%;max-width:750px;margin:auto auto auto auto;
    border-collapse: separate;border-spacing:0 2px;
}
#contact main article.form table tr th,
#contact main article.form table tr td{
    vertical-align:middle;line-height:1.8;
    font-size:large;text-align:left;width:auto;padding:10px;}
#contact main article.form table tr th{background:#115ABC;color:#ffffff;width:10em}
#contact main article.form table tr td{background:#ffffff;}
#contact main article.form table tr td input[type='text'],
#contact main article.form table tr td input[type='email'],
#contact main article.form table tr td textarea{padding:8px;line-height:1.6;}
#contact main article.form table tr td input[type='text']{width:14em}
#contact main article.form table tr td input[type='email']{width:90%}
#contact main article.form table tr td textarea{width:90%;height:200px;}
#contact main article.form input[type='submit']{
    line-height:auto;padding:10px 0;margin:20px 0;border-radius:1px;
    border:none;
    display:inline-block;color:#FFFFFF;background:#115ABC;
    text-align:center;text-decoration:none;
    font-size:medium;cursor: pointer;
    width:200px;
}
#contact main article.pp div{
    text-align:left;width:96%;padding:10px 2%;max-width:730px;margin:auto auto auto auto;
    height:400px;border:1px solid #8C8C8C;overflow-y: scroll;font-size:medium;
}
#contact main article.pp div dl dt{padding-top:10px;}
#contact main article.pp div dl dd{padding-bottom:10px;}