@charset "utf-8";

/*===========================================*/
/* Browser Reset */
/*===========================================*/

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video ,button {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    vertical-align:baseline;
	font-size:100%;
	font-weight:inherit;
}

*{
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;	
}

h1,h2,h3,h4,h5,h6{
	word-break: break-all;
}

strong,b{
	font-weight:bold;
}

html{
	width:100%;
	height:100%;
	overflow-y:scroll;
}

body {
font-family: "Roboto","ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","游ゴシック", YuGothic, "メイリオ", Meiryo, sans-serif;
font-size:14px;
	width:100%;
	height:100%;
	position:relative;
	line-height:1;
	-webkit-text-size-adjust: 100%;
	word-break:break-all;
	color:#111987;
	min-width:1060px;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { 
    display:block;
}

ol, ul{ list-style:none; }

blockquote, q { quotes:none; }

blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}

ins { text-decoration:none; }
mark { font-weight:bold; }
del { text-decoration: line-through; }
abbr[title], dfn[title] { border-bottom:1px dotted; cursor:help; }


table {
    border-collapse:collapse;
    border-spacing:0;
}

th,td{ vertical-align:middle; }


hr{
	clear:both;
	border-width:0;
	height: 10px;
	margin-top:30px;
}


/* link */
/*===========================================*/

a{
	color:#00B6E8;
	text-decoration:none;
	cursor:pointer;
	outline:none;
-webkit-transition: .2s ease-in-out;
-moz-transition: .2s ease-in-out;
-o-transition: .2s ease-in-out;
transition: .2s ease-in-out;
}

a:hover{
	color:#111987;
	}


a img{
-webkit-transition: .2s ease-in-out;
-moz-transition: .2s ease-in-out;
-o-transition: .2s ease-in-out;
transition: .2s ease-in-out;
}
	 
a:hover img{
filter: alpha(opacity=70);
opacity:.7;
}


::selection {
    background: #FFD60B !important;
}
::-moz-selection {
    background: #FFD60B !important;
}



/* Clear */
/*===========================================*/

.clearfix {zoom:1; overflow: hidden;}
.clearfix:after{
    content: "";
    display: block;
    clear: both;
}
	
.clear{
	clear:both !important;
}

hr.clear { visibility:hidden; }


/*===========================================*/
/* loader */
/*===========================================*/

#loader{
	position:fixed;
	width:100%;
	height:100%;
	display: none;
	z-index: 500001;
}

#loader div{
	width: 125px;
	height:125px;
	text-align:center;
position:absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
}

#fade {
	width: 100%;
	height: 100%;
	min-height:100%;
	display: none;
	background-color:#fff;
	position:fixed;
	top: 0px;
	left: 0px;
	z-index: 500000;
}


/*===========================================*/
/* main */
/*===========================================*/

#wrap{
	width:100%;
	height:100%;
}

#wrap .pg-canvas{
	width:100%;
	height:100%;
	position:fixed;
	z-index:8;
}

#container {
	position:absolute;
	z-index:10;
	width:100%;
}


/*===========================================*/
/* header */
/*===========================================*/

header{
	width:100%;
	position:fixed;
	top:-160px;
	z-index:500;
	background:url(../img/gnav_bk.png) repeat-x top left;
	padding-bottom:40px;
}

#gnav{
	width:1060px;
	margin:0 auto;
}

#gnav li{
	float:left;
	background-image:url(../img/gnav.png);
}

#nav_01{ background-position:0 160px; }
#nav_02{ background-position:-265px 160px; }
#nav_03{ background-position:-530px 160px; }
#nav_04{ background-position:-795px 160px; }


#gnav li a{
	display:block;
	width:265px;
	height:160px;
	background-image:url(../img/gnav.png);
text-indent:100%;
white-space:nowrap;
overflow: hidden;
}

#nav_01 a{ background-position:0 0; }
#nav_02 a{ background-position:-265px 0; }
#nav_03 a{ background-position:-530px 0; }
#nav_04 a{ background-position:-795px 0; }

#gnav li a:hover,.gnav_on{
filter: alpha(opacity=0);
opacity:0;
}

/*===========================================*/
/* title */
/*===========================================*/

#title{
	margin-top:160px;
	height:240px;
	padding-top:50px;
}

h1 span{
	display:inline-block;
	background-position:0 0;
	background-repeat:no-repeat;
text-indent:100%;
white-space:nowrap;
overflow: hidden;
}

#title_txt{
	display:block;
	text-align:center;
}

#title_txt span{ height:89px; }

#title_logo{
	display:block;
	text-align:center;
}

#title_logo span{ height:95px; }

.t_01{ width:68px; background-image:url(../img/title/01.png); }
.t_02{ width:61px; background-image:url(../img/title/02.png); }
.t_03{ width:66px; background-image:url(../img/title/03.png); }
.t_04{ width:47px; background-image:url(../img/title/04.png); }
.t_05{ width:69px; background-image:url(../img/title/05.png); }
.t_06{ width:62px; background-image:url(../img/title/06.png); }
.t_07{ width:64px; background-image:url(../img/title/07.png); }
.t_08{ width:51px; background-image:url(../img/title/08.png); }
.t_09{ width:62px; background-image:url(../img/title/09.png); }
.t_10{ width:67px; background-image:url(../img/title/10.png); }
.t_11{ width:61px; background-image:url(../img/title/11.png); }

.t_12{ width:58px; background-image:url(../img/title/12.png); }
.t_13{ width:66px; background-image:url(../img/title/13.png); }
.t_14{ width:48px; background-image:url(../img/title/14.png); }
.t_15{ width:58px; background-image:url(../img/title/15.png); }
.t_16{ width:58px; background-image:url(../img/title/16.png); }

/*===========================================*/
/* content */
/*===========================================*/

#content{
	width:100%;
	position:absolute;
	top:200px;
	padding-top:510px;
	z-index:9;
	background:url(../img/all_bk.gif) no-repeat top;
}

#what,#this,
#poss,#make{
	width:1000px;
	margin:0 auto;
	padding:0 40px;
}


/*===========================================*/
/* what */
/*===========================================*/

#what{
	height:785px;
	position:relative;
	margin-bottom:370px;
}

#den_prof{
	position:absolute;
	top:-30px;
	right:-40px;
	width:280px;
	height:280px;
	background:url(../img/what/dengenkun_bk.png) no-repeat center center;
}

#den_prof p{
	position:absolute;
	width:280px;
	height:280px;
	top:0px;
	left:0;
	display:block;
	background:url(../img/what/dengenkun_tp.png) no-repeat center center;
	margin:0 !important;
text-indent:100%;
white-space:nowrap;
overflow: hidden;
}

#den_prof img{
	position:relative;
	bottom:-40px;
}

#what h2{
	width:565px;
	height:100px;
	background:url(../img/what/h2.gif) no-repeat;
}

#what dl{
	color:#00B6E8;
	margin-top:40px;
}

#what dl dt{
	font-size:16px;
	font-weight:bold;
	margin-bottom:15px;
}

#what dl dd{
	width:250px;
	float:left;
	padding-bottom:8px;
}

#what dl dd + dd {
  margin-left: 21px;
}

#what dl dd a{
	position:relative;
	top:0;
	display:block;
	font-size:20px;
	background:#00B6E8;
	color:#fff;
	text-align:center;
	padding:20px 0;
	font-weight:bold;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}

#what dl dd a span{
	font-size:11px;
	display:block;
	margin-top:8px;
	font-weight:normal;
}

#what dl dd a:hover{
	position:relative;
	top:8px;
	color:#111987;
	background:#FFD60B;
}



/* slide */

.coda-slider-wrapper {
	width:920px !important;
	position:absolute;
	bottom:0;
}
  
.coda-slider-wrapper .coda-slider {
	width:920px;
	background: #fff;
	border:4px solid #00B6E8;
}
    
.coda-slider-wrapper .coda-slider .panel {
width: 912px;
height:475px;
padding:40px 51px;
}

.coda-slider-wrapper .coda-slider .panel p img{
	margin-top:15px;
}


.coda-slider-wrapper .coda-nav .current {
background: #00B6E8;
}

.coda-slider-wrapper .coda-nav a {
	width:43px;
	height:43px;
	line-height:43px;
	text-align:center;
background: #EAF3F9;
color: #fff;
font-size:23px;
margin-right: 4px;
margin-bottom:4px;
}
    
.coda-slider-wrapper .coda-nav a:hover {
background: #00B6E8;
}
  
  
.coda-slider-wrapper .loading {
height: 100%;
padding: 20px;
text-align: center; 
}

.coda-slider-wrapper .coda-nav-left,
.coda-slider-wrapper .coda-nav-right{
	font-size:50px;
	position:absolute;
	top:50%;
	z-index:40;
}

.coda-slider-wrapper .coda-nav-left{
	left:13px;
}

.coda-slider-wrapper .coda-nav-right{
	right:13px;
}

.coda-slider-wrapper .coda-nav-left a:hover{
	margin-left:-8px;
}

.coda-slider-wrapper .coda-nav-right a:hover{
	margin-right:-8px;
}



.coda-slider-wrapper {
clear: both;
overflow: auto; 
}
  
.coda-slider-wrapper .coda-slider {
float: left;
overflow: hidden;
position: relative; 
}

.coda-slider-wrapper .coda-slider .panel-container {
position: relative; 
}

.coda-slider-wrapper .coda-slider .panel-container .panel {
display: block;
float: left; 
}


.coda-slider-wrapper .coda-nav ul {
padding:0;
clear: both;
display: block;
overflow: hidden;
}

.coda-slider-wrapper .coda-nav ul li {
display: inline; 
}

.coda-slider-wrapper .coda-nav ul li a {
display: block;
float: left;
text-decoration: none; 
}

.coda-slider-wrapper .coda-nav-left-arrow, .coda-slider-wrapper .coda-nav-right-arrow {
cursor: pointer;
float: left;
}

.coda-slider-wrapper .coda-nav-left-arrow a, .coda-slider-wrapper .coda-nav-right-arrow a {
display: block; 
}

.coda-slider-wrapper .coda-nav-left, .coda-slider-wrapper .coda-nav-right {
float: left; 
}

.coda-slider-wrapper .coda-nav-left a, .coda-slider-wrapper .coda-nav-right a {
display: block;
text-align: center;
text-decoration: none; 
}

.coda-slider-wrapper .coda-nav-left, .coda-slider-wrapper .coda-nav-left-arrow {
clear: both; 
}


/*===========================================*/
/* this */
/*===========================================*/

#this{
	margin-bottom:380px;
}

#this h2{
	width:644px;
	height:85px;
	background:url(../img/this/h2.gif) no-repeat top left;
	margin:0 auto;
}

#this ul{
	margin-left:-20px;
	overflow:hidden;
	*zoom:1;
}

#this ul li{
	float:left;
	margin-left:20px;
	margin-top:40px;
}

#this ul li a{
	display:block;
	width:215px;
	height:200px;
	position:relative;
	background-repeat:no-repeat;
	background-position:top center;
	color:#111987;
	font-size:15px;
}


#this ul li:first-child a {
	width:450px;
	background-position:left center;
}

#this ul li a strong{
	position:absolute;
	bottom:0;
	width:100%;
	text-align:center;
}

#this01 a{ background-image:url(../img/this/01/btn.gif);}
#this02 a{ background-image:url(../img/this/02/btn.gif);}
#this03 a{ background-image:url(../img/this/03/btn.gif);}
#this04 a{ background-image:url(../img/this/04/btn.gif);}
#this05 a{ background-image:url(../img/this/05/btn.gif);}
#this06 a{ background-image:url(../img/this/06/btn.gif);}
#this07 a{ background-image:url(../img/this/07/btn.gif);}
#this08 a{ background-image:url(../img/this/08/btn.gif);}
#this09 a{ background-image:url(../img/this/09/btn.gif);}
#this10 a{ background-image:url(../img/this/10/btn.gif);}
#this11 a{ background-image:url(../img/this/11/btn.gif);}

#this01 a:hover{ background-image:url(../img/this/01/btn_on.gif);}
#this02 a:hover{ background-image:url(../img/this/02/btn_on.gif);}
#this03 a:hover{ background-image:url(../img/this/03/btn_on.gif);}
#this04 a:hover{ background-image:url(../img/this/04/btn_on.gif);}
#this05 a:hover{ background-image:url(../img/this/05/btn_on.gif);}
#this06 a:hover{ background-image:url(../img/this/06/btn_on.gif);}
#this07 a:hover{ background-image:url(../img/this/07/btn_on.gif);}
#this08 a:hover{ background-image:url(../img/this/08/btn_on.gif);}
#this09 a:hover{ background-image:url(../img/this/09/btn_on.gif);}
#this10 a:hover{ background-image:url(../img/this/10/btn_on.gif);}
#this11 a:hover{ background-image:url(../img/this/11/btn_on.gif);}


/*===========================================*/
/* poss */
/*===========================================*/

#poss{
	position:relative;
	margin-bottom:340px;
}

#poss h2{
	width:643px;
	height:85px;
	margin:0 auto;
	background:url(../img/poss/h2.gif) no-repeat;
	margin-bottom:60px;
}

#ufo1{
	top:120px;
	right:20px;
}

#ufo2{
	top:260px;
	left:0;
}

.ufo{
position: absolute;
z-index:10;
}


#poss ul li{
	width:920px;
	height:220px;
	position:relative;
}

#poss ul li a{
	color:#111987;
	display:block;
	height:220px;
}

#poss ul li strong{
font-size: 23px;
	padding:0;
	border:0;
	margin:0;
}

#poss ul li p{
	margin:10px 0 15px 0;
}

#poss ul li .btn{
	position:relative;
	top:0;
	display:inline-block;
	*display:inline;
	*zoom:1;
	background:#00B6E8;
	color:#fff;
	padding:10px 60px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
-webkit-transition: .2s ease-in-out;
-moz-transition: .2s ease-in-out;
-o-transition: .2s ease-in-out;
transition: .2s ease-in-out;
}

#poss ul li a:hover .btn{
	position:relative;
	top:8px;
	color:#111987;
	background:#FFD60B;
}

#poss_01,#poss_03{
	left:-40px;
}

#poss_02,#poss_04{
	right:-40px;
}



#poss_01{ background:url(../img/poss/1/bk.gif) no-repeat; }
#poss_03{ background:url(../img/poss/3/bk.gif) no-repeat; }
#poss_04{ background:url(../img/poss/4/bk.gif) no-repeat; }

#poss_01 a{ background:url(../img/poss/1/den.gif) no-repeat 84px 38px; padding: 50px 0 0 320px;}
#poss_02 a{ background:url(../img/poss/2/den.gif) no-repeat 4px 0; padding: 59px 0 0 430px;}
#poss_03 a{ background:url(../img/poss/3/den.gif) no-repeat 425px 50px; padding: 59px 0 0 130px;}
#poss_04 a{ background:url(../img/poss/4/den.gif) no-repeat 324px 75px; padding: 63px 0 0 490px;}

#poss_01 a:hover{ background:url(../img/poss/1/den_on.gif) no-repeat 84px 38px; }
#poss_02 a:hover{ background:url(../img/poss/2/den_on.gif) no-repeat 4px 0; }
#poss_03 a:hover{ background:url(../img/poss/3/den_on.gif) no-repeat 425px 50px; }
#poss_04 a:hover{ background:url(../img/poss/4/den_on.gif) no-repeat 324px 75px; }


/*===========================================*/
/* make */
/*===========================================*/

#make h2{
	width:524px;
	height:85px;
	background:url(../img/make/h2.gif) no-repeat;
	margin-bottom:60px;
}

#make h3{
font-size: 19px;
	padding:0;
	border:0;
	margin:15px 0 10px 0;
}

#make ul{
	margin-left:-26px;
	overflow:hidden;
	zoom:1;
}

#make li{
	width:210px;
	float:left;
	margin-left:26px;
	margin-bottom:130px;
}

#make li p{
	line-height:1.4;
	margin:0;
}

/*===========================================*/
/* end */
/*===========================================*/


#end{
	width:260px;
	height:180px;
	margin:30px auto 80px auto;
}

#end a{
	position:relative;
	top:0;
	display:block;
	width:260px;
	height:180px;
	background:url(../img/end.gif) no-repeat;
text-indent:100%;
white-space:nowrap;
overflow: hidden;
}

#end a:hover{
	position:relative;
	top:4px;
	background:url(../img/end_on.gif) no-repeat;
}


/*===========================================*/
/* top */
/*===========================================*/
#pagetop{
	width:77px;
	height:85px;
	position:fixed;
	right:10px;
	bottom:-85px;
	z-index:100;
}

#pagetop a{
	display:block;
	width:77px;
	height:85px;
	background:url(../img/top.gif) no-repeat;
text-indent:100%;
white-space:nowrap;
overflow: hidden;
}

#pagetop a:hover{
	background:url(../img/top_on.gif) no-repeat;
}


/*===========================================*/
/* print */
/*===========================================*/

@media print { body { -webkit-print-color-adjust: exact; } }


/*===========================================*/
/* all */
/*===========================================*/


.r_img{
	float:right;
	padding-left:40px;
	background:#FFF;
	line-height:0;
}

.r_img img{
	display:inline-block;
	margin:40px 0;
}

.r_img img:first-child{
	margin:0;
}


p{
	line-height:1.9;
	margin:23px 0 0 0;
}

h2{
	position:relative;
	left:-40px;
	margin-top:60px;
text-indent:100%;
white-space:nowrap;
overflow: hidden;
}

h3{
	font-size:23px;
	font-weight:bold;
	padding-bottom:20px;
	margin-bottom:25px;
	border-bottom:1px dashed #111987;
}

h4{
	font-size:21px;
	font-weight:bold;
}

#this div.in_box,
#poss div.in_box{
	display:none;
}

div.in_box{
	width: 920px;
	background: #fff;
	padding:80px 45px 40px 45px;
}

div.in_box:after{
    content: "";
    display: block;
    clear: both;
}

div.in_box p{
	line-height:1.6;
}

div.in_box h3{
font-size: 23px;
    font-weight: bold;
    padding: 40px 0 20px 0;
    margin-bottom: 25px;
    border-bottom: 1px dashed #111987;
    position: absolute;
    top: 4px;
    width: 830px;
    background: #fff;
}

div.in_box h3:after{
    height: 20px;
    content: "";
    background: #fff;
    display: block;
    position: absolute;
    width: 100%;
    bottom: -21px;
}

div.in_box h3 + h4,
.r_img + h4{
	margin-top:30px;
}


div.in_box .r_img img:first-child{
	margin:30px 0 0 0;
}

div.in_box h4 + .r_img{
	margin-top:-60px;
}


.imgbox_x{
	margin-top:40px;
}

.imgbox_x li{
	float:right;
	opacity:1 !important;
}

.imgbox_x li:first-child{
	float:left;
}

.imgbox_x { zoom:1; overflow: hidden; }
.imgbox_x:after{
    content: "";
    display: block;
    clear: both;
}





.notice_box{
	font-size:13px;
	background:#EAF3F9;
	padding:1.3em 2em 1.3em 3em;
	text-indent:-1em;
}


