@charset "UTF-8";

/* ------------------------------------------- CSS Information 
 Style Info:     ブラウザスタイルのリセット設定
----------------------------------------------------------- */  
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,
table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{
margin:0;
padding:0;
border:0;
font:inherit;
font-size:100%;
vertical-align:baseline;
}
ol,ul{list-style-type:none;}
table{border-collapse:collapse;border-spacing:0;}
caption,th,td{text-align:left;font-weight:normal;vertical-align:middle;}
q,blockquote{quotes:none;}
q:before,q:after,blockquote:before,blockquote:after{content:"";content:none;}
a img,abbr,acronym,fieldset{border:none;}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;}
hr,legend{display:none;}
object,embed{vertical-align:top;}
article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block;}

/* ------------------------------------------- CSS Information 
 Style Info:     スタイル設定
----------------------------------------------------------- */  
html,body{
width:100%;
height:100%;
margin:0;
padding:0;
line-height:0;
font-family: "メイリオ","ヒラギノ角ゴ Pro W3",Osaka,"Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック","MS PGothic",Arial,Sans-Serif ;
color:#333333;
font-size:16px;
text-align:center;
background:#ffffff;
}

.b{font-weight:bold;}
.bg{background:#ffec47;}
.ul{text-decoration:underline;}
.big{font-size:20px;line-height:30px;}
.bigest{font-size:24px;line-height:36px;}
.small{font-size:12px;line-height:18px;}
.red{color:#c9171e;}
.i{font-style:italic;font-family:"ヒラギノ角ゴ Pro W3",Osaka,"Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック","MS PGothic",Arial,Sans-Serif !important;}
img{display:block;margin:0 auto;}


/*----- header -----*/
header{
width:100%;
margin:0;
padding:0;
text-align:center;
background:#000c30 url(../img/header_bg.png) no-repeat center top;
}

/*----- slipin -----*/
.slipin{
width:960px;
margin:0 auto;
padding:0;
position:relative;
}
.title_slipin{
width:960px;
position:absolute;
top:-150px;
left:50%;
margin-left:-480px;
animation:tateyure 2s ease infinite;;
transition:transform 2s;
}
.slipin_img{
display:block;
margin:0 auto;
padding:200px 0 0 0;
}

/*----- wrapper -----*/
.wrapper{
width:960px;
margin:0 auto 0 auto;
padding:0;
overflow-y:auto;
}

/*-----title-----*/
.title{
width:960px;
margin:200px auto 0 auto;
position:relative;
}
.title img{
width:960px;
position:absolute;
top:-150px;
left:50%;
margin-left:-480px;
animation:tateyure 2s ease infinite;;
transition:transform 2s;
}
@keyframes tateyure {
0%{transform:translateY(0) }
25%{transform:translateY(-30px) }
100%{transform:translateY(0)}
}

/*-----textbox-----*/
.textbox{
width:900px;
margin:0 auto;
padding:200px 0 0 0;
font-size:18px;
line-height:30px;
text-align:justify;
}
.textbox p,.textbox ul{
margin:0;
padding:0 0 30px 0;
}
.textbox li{
margin:0;
padding:0 0 0 30px;
}
ul.check li{
background:url(../img/li_check.png) no-repeat center left;
line-height:34px;
font-weight:bold;
}
ul.circle li{
background:url(../img/li_circle.png) no-repeat center left;
line-height:34px;
font-weight:bold;
}
.text-right{
text-align:right;
font-size:14px;
}

.textbox dl{
margin:0;
padding:0 0 30px 0;
}
.textbox dt{
width:100%;
background:#000c30;
color:#feda21;
font-size:20px;
line-height:30px;
padding:5px 10px 3px 10px;
box-sizing:border-box;
font-weight:bold;
}
.textbox dd{
margin:0 0 20px 0;
padding:10px;
border:2px solid #000c30;
}
.textbox dd ul{
margin:0;
padding:0;
}
.textbox dd li{
padding:0 0 0 30px;
background:url(../img/li_circle.png) no-repeat center left;
line-height:30px;
}


/*-----image-----*/
.imagebox{
width:270px;
display:inline;
float:right;
text-align:right;
margin:0;
padding:0 0 20px 20px;
}
.imagebox img{
width:100%;
display:block;
margin:0;
padding:0;
}

/*----- user -----*/
.user{
width:100%;
margin:180px 0 60px 0;
padding:180px 0 120px 0;
background:#001348;
box-shadow:0px 0px 300px 0px #000000 inset;
color:#ffffff;
position:relative;
}
.title_user{
width:960px;
position:absolute;
top:-150px;
left:50%;
margin-left:-480px;
animation:tateyure 2s ease infinite;;
transition:transform 2s;
}
@keyframes tateyure {
0%{transform:translateY(0) }
25%{transform:translateY(-30px) }
100%{transform:translateY(0)}
}
.user_text{
width:900px;
margin:0 auto;
padding:30px 0;
text-align:justify;
font-size:16px;
line-height:24px;
}
.user_text p{
margin:0;
padding:0 0 20px 0;
}
.user_name{
margin:0;
padding:0 0 4px 0;
}
.user_img{
float:right;
padding:0 0 20px 20px;
}

/*----- profile -----*/
.profile{
width:100%;
margin:60px 0;
padding:0;
background:#ffffff url(../img/profile_bg.png) no-repeat center top;
}

/*----- cta -----*/
.cta{
width:100%;
margin:200px 0 0 0;
padding:300px 0 120px 0;
padding:0 0 30px 0;
text-align:center;
position:relative;
background:#000c30 url(../img/cta_bg.png) no-repeat center top;
}
.title_cta{
width:960px;
position:absolute;
top:-150px;
left:50%;
margin:0 0 0 -480px;
animation:tateyure 2s ease infinite;;
transition:transform 2s;
}
.cta_box{padding:150px 0 0 0;}
.cta a{display:block;width:800px;margin:0 auto;}
.cta_btn{margin:10px auto;}



/*----- attention -----*/
.attention{
width:900px;
height:150px;
margin:30px auto;
padding:0 10px 10px 10px;
color:#eeeeee;
box-sizing:border-box;
border:1px solid #eeeeee;
background:rgba(0,0,0,0.5);
overflow-y:scroll;
}
.attention dt{
font-size:12px;
line-height:14px;
font-weight:bold;
text-align:left;
border-left:5px solid #009696;
margin:10px 0 5px 0;
padding:0 0 0 5px;
}
.attention dd{
font-size:12px;
line-height:16px;
text-align:justify;
padding:0 0 0 10px;
}

/*-----footer-----*/
footer{
margin:0;
padding:30px 0;
font-size:12px;
width:100%;
min-width:320px;
color:#ffffff;
background:#000000;
text-align:center;
line-height:20px;
overflow:auto;
border-top:1px solid #555555;
}
nav{
margin:0 auto;
padding:0 0 30px 0;
}
nav ul{
text-align:center;
font-size:12px;
line-height:20px;
padding:0 0 0 20px;
}
nav li{
display:-moz-inline-box;
display:inline-block;
/display:inline;
/zoom:1;
list-style-type:none;
padding: 0 20px 0 8px;
background: url(../img/footer.png) no-repeat left center;
}
nav a:link{color:#ffffff;text-decoration:none;}
nav a:visited{color:#eeeeee;text-decoration:none;}
nav a:hover{color:#eeeeee;text-decoration:underline;}
nav a:active{color:#eeeeee;text-decoration:none;}


/* ------------------------------------------- CSS Information 
 Style Info:     サブページ
----------------------------------------------------------- */  
.wrapper_sub{
width:960px;
margin:0 auto;
padding:60px 0;
background:rgba(255,255,255,0.9);
box-shadow:0 0 10px 0 rgba(0,0,0,0.5);
min-height:640px;
}
#tokutei{
width:900px;
margin:0 auto;
padding:0;
line-height:20px;
font-size:14px;
border-collapse:separate;
border-spacing:5px;
}
#tokutei caption,.title_sub{
text-align:center;
font-size:20px;
font-weight:bold;
margin:0;
padding:0 0 20px 0;
}
#tokutei th{
text-align:center;
width:180px;
padding:10px;
background:#ffd800;
color:#333333;
}
#tokutei td{
padding:10px;
text-align:justify;
background:#f3f3f3;
}
#pp{
width:900px;
margin:0 auto;
padding:0;
line-height:24px;
font-size:14px;
text-align:justify;
text-justify:inter-ideograph;
}
.title_pp{
width:100%;
margin:0;
padding:10px 0;
background:#ffd800;
color:#333333;
text-align:center;
font-weight:bold;
font-size:16px;
line-height:30px;
}
#pp dl{
margin:5px 0;
padding:30px 30px 0 30px;
background:#f3f3f3;
}
#pp dt{font-weight:bold;}
#pp dd{padding:0 0 30px 0;}
#pp dd ol{
padding-left:40px; 
list-style-position: outside ;
list-style-type: decimal;
}
#pp dd ol ol{
padding-left:20px; 
list-style-position: outside ;
list-style-type: disc;
}