@charset "utf-8";

/*----------------------------------------------------------------
 TopPage only
----------------------------------------------------------------*/
/*----------------------------------------------------------------
 base
----------------------------------------------------------------*/
body{
	font-size			: 16px;
	line-height			: 1.50;
}

/*----------------------------------------------------------------
 class
----------------------------------------------------------------*/
.fixed{
	position			: fixed;
	width				: 100%;
}
/*----------------------------------------------------------------
 layout
----------------------------------------------------------------*/
/*-----------------------------------------------------
 area
-----------------------------------------------------*/
#header{
	height				: 695px;
	margin				: 0 0 -70px 0;
}
#header2{
       width : 100%;
	height				: 695px;
  background-image : url(http://keitai-pass.com/index/images/head.jpg);
  background-repeat : no-repeat;
  background-position : center top;
	margin				: 0 0 -70px 0;
}
#footer{
	z-index				: 30;
	height				: 140px;
}

/*-----------------------------------------------------
 section
-----------------------------------------------------*/
.section{
	position			: relative;
	clear				: both;
}
#step01{
	height				: 877px;
	background			: #EAEAEA;
}
#step02{
	height				: 728px;
	background			: #679BBE;
}
#step03{
	background: #FFF;
}
#step04{
	height				: 1187px;
	background			: #EAEAEA;
}
#service{
	background: #FFF;
}
#comparison{
	background: #EAEAEA;
}
#voice{
	background: #FFF;
}
#faq{
	background: #EAEAEA;
}
#work{
	background: #FFF;
}
#inquiry{
	background: #FFF url(../images/inquiry_bg.gif) left top repeat-x;
}
#about{
	background: #679BBE;
}

/*-----------------------------------------------------
 contents
-----------------------------------------------------*/
#contents .container{
	overflow: visible;
}

/*-----------------------------------------------------
 block
-----------------------------------------------------*/
.block{
	position			: relative;
	overflow			: hidden;
	clear				: both;
}

/*----------------------------------------------------------------
 styles
----------------------------------------------------------------*/
/*-----------------------------------------------------
 header
-----------------------------------------------------*/
#header .bg{
	position			: absolute;
	width				: 100%;
  background-image : url(index/images/mv01_bg3.jpg);
  background-repeat : no-repeat;
  background-position : center top;
}
#header .bg img{
	width: 100%;
}
@media screen and (max-width: 1200px) {
	#header .bg img{
	width: 1200px;
}
}
#header .container{
	width				: 1200px;
	height				: 695px;
	padding				: 80px 0 0 0;
	text-align			: right;
}
#header .container h1,
#header .container p{
	position			: relative;
	z-index				: 10;
}

#header .container .image{
	position			: absolute;
	left				: 0px;
	top					: 0px;
	z-index				: 1;
}

/*-----------------------------------------------------
 navigation
-----------------------------------------------------*/
#navigation{
	top					: 0;
	left				: 0;
}

/*-----------------------------------------------------
 contents
-----------------------------------------------------*/
#contents .title,
#contents .title02{
	position: absolute;
}

/*------------------------------------------
 step01
------------------------------------------*/
#step01 .title{
	left: 45px; top: 49px;
}

#step01 .question{
	position			: relative;
	left				: 340px;
	top					: 50px;
	width				: 660px;
	height				: 200px;
	background			: url(../images/step01_bg.png) left top no-repeat;
}

#step01 .question li{
	position: absolute;
}
#step01 .question .q01{
	left: 200px; top: 65px;
}
#step01 .question .q02{
	left: 345px; top: 70px;
}
#step01 .question .q03{
	left: 265px; top: 0px;
}

#step01 .animeTrigger{
	display				: block;
	position			: absolute;
	top					: 450px;
	width				: 10px;
	height				: 10px;
}
#step01 .list{
	position			: absolute;
	left				: 340px;
	top					: 250px;
}
#step01 .text01{
	position			: absolute;
	left				: 340px;
	top					: 667px;
}
#step01 .text02{
	position			: absolute;
	left				: 343px;
	top					: 722px;
}

/*------------------------------------------
 step02
------------------------------------------*/
#step02:before{
	display				: block;
	margin				: 0 auto;
	width				: 175px;
	height				: 45px;
	content				: url(../images/arrow_s-gray.png);
}

#step02 .text01{
	padding				: 29px 0 30px 0;
	text-align			: center;
}

#step02 .choice{
	margin				: 0 auto 40px auto;
	width				: 740px;
	height				: 290px;
}

#step02 .choice .image01{
	float: left;
}
#step02 .choice .image02{
	float: right;
}

#step02 .choice .move{
	display				: block;
	width				: 290px;
	height				: 290px;
}

#step02 .choice .anime01{
	background: url(../images/step02_image01-bg.png) left top no-repeat;
}
#step02 .choice .anime01 .move{
	background: url(../images/step02_image01-anime.gif) center center no-repeat;
}
#step02 .choice .image02{
	background: url(../images/step02_image02-bg.png) left top no-repeat;
}
#step02 .choice .anime02 .move{
	background: url(../images/step02_image02-anime.gif) center center no-repeat;
}

#step02 .choice .text02{
	position			: absolute;
	left				: 320px;
	top					: 129px;
}

#step02 .text03{
	margin				: 0 0 15px 0;
	text-align			: center;
}
#step02 .txt01{
	margin				: 0 auto;
	width				: 745px;
	color				: #FFF;
}
/*------------------------------------------
 step03
------------------------------------------*/
#step03:before{
	display				: block;
	margin				: 0 auto;
	width				: 175px;
	height				: 45px;
	content				: url(../images/arrow_s-blue.png);
}
#step03 .block01{
	overflow			: visible;
	float				: right;
	margin				: 55px 0 0 0;
	width				: 740px;
	padding				: 0 0 45px 0;
}
#step03 .title{
	position			: static;
	padding				: 0 0 33px 0;
}
#step03 .image03{
	position			: absolute;
	left				: -310px;
	top					: 0px;
}
#step03 .advantage{
	overflow			: visible;
	width				: 740px;
	background			: url(../images/step03_text01.png) 326px 62px no-repeat;
}
#step03 .advantage dl{
	width				: 315px;
}
#step03 .advantage .net{
	float: left;
}
#step03 .advantage .real{
	float : right;
}
#step03 .advantage dt{
	margin				: 0 0 15px 0;
	text-align			: center;
}
#step03 .advantage dd{
	margin				: 0 auto;
	width				: 290px;
}
#step03 .advantage .net dt{
	position			: relative;
	left				: -40px;
}
#step03 .txt01{
	padding				: 23px 0;
	background			: #679BBE;
	color				: #FFF;
}

/*------------------------------------------
 step04
------------------------------------------*/
#step04:before{
	display				: block;
	margin				: 0 auto -65px auto;
	width				: 225px;
	height				: 60px;
	content				: url(../images/arrow_l-blue.png);
}
#step04 .text01,
#step04 .text02,
#step04 .btn{
	position: absolute;
}
#step04 .title{
	left: 750px;	top: 125px;
}
#step04 .text01{
	left: 0px;	top: 708px;
}
#step04 .text02{
	left: 0px;	top: 790px;
}
#step04 .btn{
	left: 100px;	top: 1020px;
}

#step04 .smp{
	left				: -19px;
	top					: 70px;
	width				: 715px;
	height				: 600px;
}
#step04 .smp ul,
#step04 .smp li{
	position: absolute;
}

#step04 .smp .image00{
	left: 21px;	top: 85px;
}
#step04 .smp .image01-01{
	left: 196px;	top: 79px;
}

#step04 .smp .animeItem02{
	left				: 214px;
	top					: 145px;
	width				: 230px;
	height				: 380px;
	overflow			: hidden;
}
#step04 .smp .animeItem02 .image02-01{
	bottom: -380px;
}
#step04 .smp .image03-01{
	left: 457px;	top: 97px;
}
#step04 .smp .image03-02{
	left: 0px;	top: 373px;
}
#step04 .smp .image03-03{
	left: 472px;	top: 333px;
}
#step04 .smp .image04-01{
	left: 101px;	top: 0px;
}

/*------------------------------------------
 service
------------------------------------------*/
#service:before{
	display				: block;
	margin				: 0 auto;
	width				: 225px;
	height				: 60px;
	content				: url(../images/arrow_l-gray.png);
}

#service .title{
	left: 35px; top: 22px;
}
#service .title02{
	left: -65px; top: 916px;
}
#service .image01{
	position			: absolute;
	left				: -25px;
	top					: 447px;
}

#service .content{
	overflow: hidden;
}
#service .content .block{
	float				: right;
	width				: 705px;
	padding				: 32px 0 84px 0;
}

#service .content .text01{
	margin				: 0 0 27px 0;
}

#service .service-list{
	padding				: 0 5px;
}
#service .service-list li{
	margin				: 35px 0 0 0;
}
#service .service-list li dl{
	display				: table;
}
#service .service-list li dl dd,
#service .service-list li dl dt{
	display				: table-cell;
	vertical-align		: middle;
}
#service .service-list li dl dt{
	width				: 147px;
}

/*------------------------------------------
 comparison
------------------------------------------*/
#comparison:before{
	display				: block;
	margin				: 0 auto;
	width				: 225px;
	height				: 60px;
	content				: url(../images/arrow_l-white.png);
}

#comparison .title{
	right: -5px; top: 10px;
}
#comparison .title02{
	left: 755px; top: 1250px;
}
#comparison .image01{
	position			: absolute;
	left				: 770px;
	top					: 830px;
}

#comparison .subhead{
	position			: relative;
	left				: -10px;
	padding				: 34px 0 20px 0;
}
#comparison .txt{
	margin				: 0 0 10px 0;
}

#comparison .item{
	margin				: 50px 0 0 0;
}

#comparison .item01 .heading{
	margin				: 0 0 10px 0;
}
#comparison .item01 .txt01{
	margin				: 0 0 35px 0;
}
#comparison .item01 .text01,
#comparison .item01 .text02{
	margin				: 20px 0 0 0;
	width				: 750px;
	text-align			: center;
}

#comparison .item02 .heading{
	margin				: 0 0 20px 0;
}
#comparison .item02 .text{
	width				: 730px;
}
#comparison .item02 .text dt{
	float				: left;
	width				: 330px;
	text-align			: right;
}
#comparison .item02 .text dd{
	float				: right;
	width				: 380px;
}

#comparison .item03 .heading{
	margin				: 0 0 15px 0;
}
#comparison .item03 .attention{
	font-size			: 12px;
}
#comparison .item03 .table01{
	margin				: 0 0 10px 0;
}
#comparison .item03 .subhead01{
	margin				: 40px 0 10px 0;
}
#comparison .item03 .table02{
	margin				: 20px 0 10px 0;
}
#comparison .item03 .text01{
	margin				: 30px 0 0 0;
}

#comparison .btn_inquiry{
	padding				: 50px 0 90px 0;
	text-align			: center;
}

/*------------------------------------------
 voice
------------------------------------------*/
#voice:before{
	display				: block;
	margin				: 0 auto;
	width				: 225px;
	height				: 60px;
	content				: url(../images/arrow_l-gray.png);
}
#voice .title{
	left: -5px; top: 39px;
}
#voice .title02{
	left: 30px; top: 1634px;
}

#voice .voice-block{
	float				: right;
	margin				: 40px 0 0 0;
	width				: 810px;
}
#voice .voice02{
	margin				: 85px 0 -4px 0;
}
#voice .voice-block dt,
#voice .voice-block .txt{
	float				: right;
	width				: 500px;
}
#voice .voice-block dt{
	padding				: 0 0 20px 0;
}
#voice .voice-block .image{
	position			: absolute;
}

#voice .more-heading{
	padding				: 0 0 0 30px;
}
#voice .more-heading img{
	position			: relative;
	vertical-align		: middle;
}
#voice .more-heading .more-heading02{
	top					: 20px;
	left				: -5px;
}
#voice .more-heading .more-heading02 img{
	position			: relative;
}
#voice .more{
	margin				: 40px 0 0 0;
	padding				: 0 0 30px 0;
}
#voice .more li{
	position			: relative;
	clear				: both;
	overflow			: hidden;
	padding				: 0 0 30px 0;
}
#voice .more li dd{
	position			: relative;
	clear				: both;
	overflow			: hidden;
}
#voice .more li dt,
#voice .more li dd .txt{
	float				: right;
	width				: 710px;
}
#voice .more li dt{
	padding				: 0 0 0 40px;
	background			: url(../images/voice_more-icon.png) 0px 3px no-repeat;
	cursor				: pointer;
}
#voice .more li dd .txt{
	padding				: 40px 0 80px 0;
}
#voice .more li dd .image{
	position			: absolute;
	top					: 40px;
}

/*------------------------------------------
 faq
------------------------------------------*/
#faq:before{
	display				: block;
	margin				: 0 auto;
	width				: 225px;
	height				: 60px;
	content				: url(../images/arrow_l-white.png);
}
#faq .title{
	right: 0px; top: -75px;
}
#faq .title02{
	left: 780px; top: 570px;
}

#faq .faq-list{
	margin				: 35px 0 -10px 0;
	width				: 735px;
}
#faq .faq-list dt{
	min-height			: 46px;
	padding				: 0 0 25px 60px;
	background			: url(../images/faq_icon-q.png) left top no-repeat;
	line-height			: 46px;
	font-size			: 18px;
	font-weight			: bold;
	color				: #1B557D;
}
#faq .faq-list dt.double{
	padding				: 3px 0 25px 60px;
	line-height			: 1.22;
}
#faq .faq-list dd{
	padding				: 7px 0 50px 60px;
	background			: url(../images/faq_icon-a.png) left top no-repeat;
}

#faq .btn_inquiry{
	padding				: 10px 0 50px 0;
	text-align			: center;
}

/*------------------------------------------
 work
------------------------------------------*/
#work:before{
	display				: block;
	margin				: 0 auto;
	width				: 225px;
	height				: 60px;
	content				: url(../images/arrow_l-gray.png);
}
#work .title{
	left: 60px; top: 34px;
}
#work .title02{
	left: 0px; top: 807px;
}

#work .image01{
	margin				: 0 0 20px 0;
}
#work .media{
	padding				: 0 0 0 155px;
}
#work .tv,
#work .book{
	float: right;
}
#work .tv{
	margin				: 30px 0 0 0;
	width : 610px;
}
#work .book{
	margin				: 40px 0;
	width : 610px;
}
#work .other{
	margin: 40px 0 0 0;
}
#work .radio{
	margin: 63px 0 0 0;
}
#work .np{
	margin: 30px 0 60px 0;
}


#work .media .heading{
	position			: absolute;
	left				: 0px;
}

#work .other ul li,
#work .media .item{
	display				: inline-block;
	*display			: inline;
	*zoom				: 1;
	padding				: 0 28px 0 0;
	vertical-align		: top;
}
#work .media .item dt{
	padding				: 0 0 8px 0;
	font-size			: 14px;
}
#work .media .item dd{
	font-size			: 12px;
}


#work .radio .txt{
	margin				: 0 0 40px 0;
	padding				: 30px 0 0 0;
}
#work .radio .item iframe{
	margin				: 10px 0 0 0;
}

#work .np .item{
	padding				: 0 55px 0 0;
}

#work .media .non{
	padding: 0;
}

/*------------------------------------------
 inquiry
------------------------------------------*/
#inquiry .title-block{
	margin				: 0 auto 40px auto;
	width				: 1200px;
	height				: 635px;
	background			: url(../images/inquiry_title-bg.jpg) left top no-repeat;
}
#inquiry .title-block .title01{
	position			: absolute;
	left				: 54px;
	top					: 224px;
}
#inquiry .title-block .title02{
	left				: 54px;
	top					: 304px;
}
#inquiry .image01{
	position			: relative;
}
#inquiry .image01 .txt{
	display				: block;
	position			: absolute;
	left				: 470px;
	top					: 160px;
	width				: 450px;
	font-size			: 12px;
}
#inquiry .image02{
	padding				: 0 0 70px 0;
}

#inquiry .heading02{
	height				: 70px;
	padding				: 20px 0 0 0;
	background			: #1c567e;
}
#inquiry .heading02 .container{
	display				: block;
}

#inquiry .check{
	margin				: 0 auto;
	width				: 950px;
}
#inquiry .check:before{
	display				: block;
	margin				: 0 auto;
	width				: 225px;
	height				: 60px;
	content				: url(../images/arrow_l-navy.png);
}

#inquiry .check .heading{
	margin				: 30px 0 0 0;
}
#inquiry .check ul{
	margin				: 0 0 45px 15px;
}
#inquiry .check ul li{
	line-height			: 40px;
}
#inquiry .check ul li label{
	margin				: 0 0 0 15px;
}

#inquiry .check table{
	margin				: 30px 0 55px 15px;
	width				: 875px;
}
#inquiry .check table td,
#inquiry .check table th{
	border				: 1px solid #BBBABA;
	padding				: 14px 15px;
	vertical-align		: top;
	font-weight			: normal;
}
#inquiry .check table th{
	width				: 235px;
	background			: #A8CADF;
}
#inquiry .check table th.required{
	background-image	: url(../images/required.png);
	background-repeat	: no-repeat;
	background-position	: right bottom;
}
#inquiry .check table th.option{
	background-image	: url(../images/option.png);	
	background-repeat	: no-repeat;
	background-position	: right bottom;
}
#inquiry .check table td{
	background			: #FFF;
}

#inquiry .check table .hover{
	background			: #E3EEF5;
}
#inquiry .check table td input[type="text"],
#inquiry .check table td input[type="email"]{
	width				: 360px;
}
#inquiry .check table td input[type="radio"]{
	margin				: 0 5px;
}
#inquiry .check table td label{
	padding				: 0 70px 0 0;
}
#inquiry .check table td textarea{
	width				: 480px;
	height				: 115px;
}

#inquiry .check .submit{
	margin				: 0 0 85px 0;
}
#inquiry .check .submit input{
	margin				: 0 auto;
	display				: block;
	border				: none;
	width				: 800px;
	height				: 114px;
	background			: url(../images/btn_submit.png) left top no-repeat;
	text-indent			: -9999px;
}
#inquiry .check .submit input:hover{
	background			: url(../images/btn_submit-on.png) left top no-repeat;
}
/*------------------------------------------
 about
------------------------------------------*/
#about:before{
	display				: block;
	margin				: 0 auto;
	width				: 225px;
	height				: 60px;
	content				: url(../images/arrow_l-white.png);
}
#about .mission{
	overflow			: visible;
	float				: right;
	margin				: 0 0 15px 0;
	width				: 740px;
}
#about .mission .title{
	left: -216px; top: 26px;
}
#about .mission .txt01{
	margin				: 35px 0 15px 0;
	border				: 1px solid #FFF;
	width				: 675px;
	padding				: 20px;
	background			: #EAEAEA;
	font-size			: 14px;
}
#about .mission .data{
	font-size			: 12px;
	color				: #FFF;
}
#about .mission .data li{
	padding				: 0 0 3px 0;
}
#about .mission .data li dt,
#about .mission .data li dd{
	display				: inline-block;
	*display			: inline;
	*zoom				: 1;
	vertical-align		: top;
}

#about .access .heading{
	border-bottom		: 1px solid #FFF;
	text-align			: center;
}
#about .access .heading span{
	position			: relative;
	bottom				: -25px;
	display				: inline-block;
	*display			: inline;
	*zoom				: 1;
	padding				: 10px 30px;
	background			: #679BBE;
}
#about .access .address{
	margin				: 25px auto 45px auto;
	width				: 420px;
	font-size			: 18px;
	line-height			: 1.67;
	color				: #FFF;
}
#about .access .address address{
	text-align			: center;
}
#about .access .address .fax{
	float				: right;
}

#about .map{
	z-index				: 0;
	line-height			: 1px;
}
#about #map_basic{
	width				: 100%;
	height				: 520px;
}

/*-----------------------------------------------------
 footer
-----------------------------------------------------*/
/* info
-----------------------------------------------------*/
#footer .info{
	height				: 40px;
	line-height			: 40px;
}
#footer .info,
#footer .info a{
	color				: #303030;
}
#footer .info .copy{
	float				: right;
	font-size			: 10px;
}

/* floating footer
-----------------------------------------------------*/
.floating-footer,
.floating-footer .container{
	height				: 100px;
}
.floating-footer{
	left				: 0px;
	z-index				: 200;
	width				: 100%;
	background			: #89A8C8;
	-webkit-transform-style: preserve-3d;
	-webkit-transform	: translateZ(20);
}
.floating-footer li{
	position: absolute;
}

.floating-footer .logo{
	left: 0px;	top: 13px;
}
.floating-footer .tel{
	left: 298px;	top: 12px;¡¡
}
.floating-footer .address{
	left: 645px;	top: 11px;¡¡
}

.floating-footer .address address{
	border				: 1px solid #FFF;
}
.floating-footer .pagetop{
	position			: absolute;
	right				: 0px;
	top					: 15px;
}

.space20{
  height : 20px;
}

.space10{
  height : 10px;
}

.jirei1{
  background-image : url(../images/images/jirei1_01.jpg);
  width : 740px;
  height : 170px;
}

.jirei2{
  background-image : url(../images/images/jirei1_02.jpg);
  background-repeat : repeat-y;
  width : 740px;
}

.jirei3{
  background-image : url(../images/images/jirei1_03.jpg);
  width : 740px;
  height : 44px;
}
.jisei_in{
  width : 680px;
  margin-right : auto;
  margin-left : auto;
}