@charset 'UTF-8';

body, html{
  -webkit-text-size-adjust: none;
}

body{
	font-family: "Hiragino Kaku Gothic ProN","メイリオ", sans-serif;
	color:#404040;
	font-size:12px;
}

/*------------------------------------------------
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, sub, sup, 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{
  margin: 0;
  padding: 0;
}

table{
  border-collapse: collapse;
  border-spacing: 0;
}

fieldset, img{
  border: 0;

  vertical-align: bottom;
}

address, caption, cite, code, dfn, em, strong, var{
  font-style: normal;
  font-weight: normal;
}

ol, ul{
  list-style: none;
}

caption, th{
  font-weight: normal; 
  text-align: left;
}

h1, h2, h3, h4, h5, h6{
  font-size: 100%;
  font-weight: normal;
}

area{
  border: none;

  outline: none;
}

abbr, acronym{
  border: 0;
}

a{
	color:#1c72af;
}
a:hover{
	text-decoration:none;
}

a img:hover{
  opacity: 0.5;
  filter: alpha(opacity=50);
  -ms-filter: "alpha(opacity=50)";
}

.clearfix:after, .box:after, dl:after,ul:after,.inner:after,.tabContent:after{
  display: block;
  clear: both; 
  content: '';
}

.clearfix, .box, dl, ul,.inner,.tabContent{
  zoom: 1;
}

/*------------------------------------------------
contents
------------------------------------------------*/

#wrapper{
	margin:0 auto;
	min-width:980px;
 	background:url(../img/contents_bg.png);
}

.main-area{
	background:url(../img/mainimg.jpg) center top no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	position:relative;
	width:100%;
	height:696px;
	text-align:center;
	margin-bottom:40px;
}

.main-area .box{
	position:relative;
	width:980px;
	height:696px;
	margin:0 auto;
}

.main-area .social{
	position:absolute;
	top:34px;
	right:20px;
}
.main-area .tit{
	position:absolute;
	left:84px;
	top:229px;
}
.main-area .logo{
	position:absolute;
	left:22px;
	top:18px;
}
.main-area .pat{
	position:absolute;
	left:83px;
	top:30px;
}
.main-area .txt1{
	position:absolute;
	left:135px;
	bottom:154px;
}
.main-area .txt2{
	position:absolute;
	left:8px;
	bottom:18px;
}
.main-area .special{
	position:absolute;
	right:-14px;
	bottom:148px;
}
.main-area nav{
	position:absolute;
	top:553px;
}
.main-area ul{
	position:relative;
	margin-right:-16px;
	zoom: 1;/* for IE6,7 */
	width:996px;
}
.main-area ul li{
	float:left;
	margin-right:16px;
}

.main-area ul .mv{
	margin:-2px 0 0;
}

.contents{
	margin:0 auto;
}

.contents section .tit{
	margin:0 auto 40px;
	text-align:center;
}


/*
introduction
-----------------------------------------------*/
#introduction .tit{
	margin-bottom:80px !important;
	text-align:center;
}
#introduction .inner{
	position:relative;
	width:980px;
	margin:0 auto;
	margin-bottom:108px;
	border:1px solid #a2163d;
	border-radius: 20px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
}
#introduction{
	margin-bottom:75px;
}
#introduction dl{
	display:table;
}
#introduction dt{
	display:table-cell;
	width:126px;
	height:48px;
}
#introduction dd{
	display:table-cell;
	width:699px;
	padding-left:25px;
	height:48px;
	vertical-align:middle;
}
#introduction dl{
	margin-top:20px;
}
#introduction .sec1 .inner{
	height:653px;
}
#introduction .sec1 h2{
	background:url(../img/contents_bg.png);
	position:absolute;
	top:-55px;
	left: 0;
	right: 0;
	margin: auto;
	width:516px;
	height:90px;
	padding:0 17px 0 24px;
}
#introduction .sec1 h2 img{
	display:block;
	margin:0 auto;
}
#introduction .sec1 .detail{
	position:absolute;
	width:870px;
	left:100px;
	bottom:30px;
}
#introduction .sec1 figure{
	position:absolute;
	left:86px;
	top:63px;
}

#introduction .sec2{
	margin-bottom:108px;
}
#introduction .sec2 .inner{
	height:653px;
}
#introduction .sec2 h2{
	background:url(../img/contents_bg.png);
	position:absolute;
	top:-55px;
	left: 0;
	right: 0;
	margin: auto;
	width:671px;
	height:90px;
	padding:0 22px 0 24px;
}
#introduction .sec2 figure{
	position:absolute;
	left:86px;
	top:56px;
}
#introduction .sec2 .detail{
	position:absolute;
	width:870px;
	left:100px;
	bottom:38px;
}

#introduction .sec3{
	margin-bottom:108px;
}
#introduction .sec3 .inner{
	height:642px;
}
#introduction .sec3 h2{
	background:url(../img/contents_bg.png);
	position:absolute;
	top:-52px;
	left: 0;
	right: 0;
	margin: auto;
	width:930px;
	height:82px;
	padding:0 5px 0 5px;
}
#introduction .sec3 figure{
	position:absolute;
	left:86px;
	top:108px;
}
#introduction .sec3 .detail{
	position:absolute;
	width:870px;
	left:100px;
	bottom:48px;
}
#introduction .sec3 dd p{
	margin:15px 0 20px;
}
#introduction .sec3 dd span{
	display:block;
}

#introduction .sec4 .inner{
	height:653px;
	margin-bottom:0;
}
#introduction .sec4 h2{
	background:url(../img/contents_bg.png);
	position:absolute;
	top:-50px;
	left: 0;
	right: 0;
	margin: auto;
	width:640px;
	height:82px;
	padding:0 5px;
}
#introduction .sec4 figure{
	position:absolute;
	left:190px;
	top:48px;
}
#introduction .sec4 .detail{
	position:absolute;
	width:870px;
	left:100px;
	bottom:56px;
}


/*
method
-----------------------------------------------*/
#method a{
	color:#1c72af;
}
#method .inner{
	width:980px;
	margin:0 auto;
}
#method .inner div{
	float:left;
	width:333px;
	box-sizing:border-box;
}
#method .inner div .box{
	float:none;
	width:297px;
	background:#fff;
	border:1px solid #a2163d;
    -webkit-border-bottom-right-radius: 15px;  
    -webkit-border-bottom-left-radius: 15px;  
    -moz-border-radius-bottomright: 15px;  
    -moz-border-radius-bottomleft: 15px;
	text-align:center;
	min-height:210px;
}
#method .inner div h3{
	-webkit-border-top-left-radius: 15px;
	-webkit-border-top-right-radius: 15px;
	-moz-border-radius-topleft: 15px;
	-moz-border-radius-topright: 15px;
	background:#a2163d;
	width:297px;
	padding:24px 0;
	text-align:center;
}

#method .step1{
	background:url(../img/arr1.png) right center no-repeat;
	padding-right:20px !important;
	margin-right:8px !important;
}
#method .step1 .box{
	padding:18px 0 16px 0;
}
#method .step1 figure{
	margin:23px 0 20px;
}
#method .step1 a{
	font-size:17px;
}
#method .step2{
	background:url(../img/arr1.png) right center no-repeat;
	padding-right:20px !important;
	margin-right:4px !important;
}
#method .step2 .box{
	padding-top:44px;
}
#method .step3{
	float:right !important;
	width:297px !important;
}
#method .step3 .box{
	padding-top:23px;
}
#method .step3 figure{
	padding:13px 0 0;
}

/*
entry
-----------------------------------------------*/
#entry{
	margin:75px 0 0;
}
#entry .inner{
	width:980px;
	margin:0 auto;
}

#entry ul.tab {
	position:relative;
	margin-right:-16px;
	zoom: 1;/* for IE6,7 */
	width:996px;
	overflow:hidden;
}
#entry ul.tab li {
    float: left;
	width:316px;
	height:72px;
    margin-right: 16px;
    cursor: pointer;
}

#entry ul.tab span{
	width:316px;
	height:72px;
	text-indent:-9999px;
	display:block;
}
#entry ul.tab .tab1{
	background:url(../img/entry_tab1.png) no-repeat;
}
#entry ul.tab .tab2{
	background:url(../img/entry_tab2.png) no-repeat;
}
#entry ul.tab .tab3{
	background:url(../img/entry_tab3.png) no-repeat;
}
#entry ul.tab .tab1:hover,
#entry ul.tab .tab1 .active{
	background:url(../img/entry_tab1_on.png) no-repeat;
}
#entry ul.tab .tab2:hover,
#entry ul.tab .tab2 .active{
	background:url(../img/entry_tab2_on.png) no-repeat !important;
}
#entry ul.tab .tab3:hover,
#entry ul.tab .tab3 .active{
	background:url(../img/entry_tab3_on.png) no-repeat !important;
}
#entry ul.tab li .active {
    background-color: #999;
    color: #fff;
}
#entry .box{
    clear: both;
	background:#fff;
    border: 1px solid #8d1938;
    padding: 30px 38px 25px;
	box-sizing:border-box;
    width: 980px;
}
#entry div.tabContent {
    display: none;
}
#entry div.active {
    display: block;
}
#entry .tabContent div{
	float:left;
	width:450px;
	height:370px;
	box-sizing:border-box;
}
#entry .tabContent h3{
	padding-bottom:25px;
}

#entry .tabContent p{
	font-size:12px;
	padding-bottom:2px;
}
#entry .mb p{
	padding-bottom:11px;
}
#entry .tabContent div.step1{
	padding:0 20px 19px 0;
	border-right:1px solid #dcdcdc;
	border-bottom:1px solid #dcdcdc;
}
#entry .tabContent div.step2{
	padding:0 0 19px 20px;
	border-bottom:1px solid #dcdcdc;
}
#entry .tabContent div.step3{
	padding:20px 20px 0 0;
	border-right:1px solid #dcdcdc;
}
#entry .tabContent div.step4{
	padding:20px 0 0 20px;
}
#entry .tabContent div.step1 h3{
	padding-bottom:5px;
}
#entry .btn{
	margin:40px 0 0;
}
#entry .entry-btn{
	margin:30px 0 0;
}
#entry .entry-btn p{
	float:left;
}
#entry .entry-btn p+p{
	float:right;
}

/*
qa
-----------------------------------------------*/
#qa{
	margin:75px 0 0;
}
#qa .inner{
	width:980px;
	margin:0 auto;
}

#qa dl{
	margin-bottom:0;
}

#qa dt{
	background:url(../img/i_q.png) 18px 18px no-repeat;
	border:1px solid #aa2425;
	box-sizing:border-box;
	padding:30px 0 30px 78px;
	width:980px;
}

#qa dd{
	color:#545454;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-weight:bold;
	padding:20px 25px 30px 69px;
	background:url(../img/i_a.png) 18px 18px no-repeat;
	font-size:14px;
	line-height:28px;
	text-align:justify;
}

#qa dd p{
	margin:0 0 20px;
}

#qa dd a{
	text-decoration:underline;
}
#qa dd a:hover{
	text-decoration:none;
}

#qa dd span{
	display:inline-block;
	font-size:11px;
	line-height:18px !important;
}

/*
movie
-----------------------------------------------*/
#movie{
	margin:75px 0 0;
}
#movie p{
	padding:0 0 10px;
	color:#fff;
	font-size:16px;
}
#movie .inner{
	background: rgba(0,0,0,0.78);
	margin:0 auto;
	padding:35px 0;
	text-align:center;
}

#pagetop{
	width:980px;
	margin:25px auto 40px;
	text-align:right;
}
#pagetop img{
	text-align:right;
}

#footer:after{
  content: ".";
  display: block;
  clear: both;
  height: 0;
  visibility: hidden;
}
#footer{
	text-align:center;
	padding:40px 0;
	color:#000;
	background: rgba(0,0,0,0.05);
}
#footer .f-logo{
	float:left;
	width:40px;
	margin:0 29px 0 0;
}
#footer .copyright{
	float:left;
	padding:24px 0 0;
}

#footer .inner{
	width:980px;
	margin:0 auto;
	box-sizing:border-box;
	padding-left:237px;
}