html{
    height: 100%;
    overflow-x: hidden;
}

.curtains{
    width: 100%;
    z-index:1;
    position:relative;
}

.curtains>li{
    -webkit-transform:translateZ(0);
    background: white;
    position: fixed;
    display:block;
    top: 0;
    left: 0;
    width: 100%;
    min-height: 100%;
    overflow: hidden;
    z-index:1;
}
.curtains>li.hidden{ visibility: hidden}
.curtains>li:first-child{z-index:2;}


/* RESET */
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-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}


/* Clearfix */
.cf:before,
.cf:after { content:"";display:table; }
.cf:after { clear:both; }
.cf { zoom:1;}

/* Base Style */
body {
    color:#000;
    -webkit-font-smoothing: antialiased;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

h1,h2,h3,h4,h5,h6{ font-weight:bold}
strong{font-weight:bold;}
hr{background: #333;border: 0;height: 2px;margin: 12px auto 8px;width: 60px;}

a{color:#1074ce;text-decoration:none;outline:none}
a:hover{color:#0a487f;}


/* Header
------------------------------- */
header, footer{
	position: fixed;
	width: 96%;
	min-width: 1000px;
	padding: 40px 2% 20px;
	background: #fff;
	z-index: 9999
}
header h1, footer h1{
	float: left;
	line-height: 1
}
header p{
	position: absolute;
	top: 15px;
	right: 2%;
	font-size: 13px
}
header #gnav, footer #gnav{
	float: right;
}
#gnav li{
	float: left;
	margin: 15px 0 0 35px;
	text-indent: -9999px
}
#gnav li a{
	display: block;
	width: 40px;
	height: 13px;
	background: url(../img/bg_nav.png) no-repeat
}
#gnav #gn2 a{ background-position: -75px 0; width: 97px}
#gnav #gn3 a{ background-position: -326px 0; width: 74px}
#gnav #gn4 a{ background-position: -206px 0; width: 85px}
#gnav #gn5 a{ background-position: -435px 0; width: 105px}
#gnav #gn6 a{ background-position: -681px 0; width: 98px}

#gnav li a:hover{ opacity: 0.5}

#menu{
    position:fixed;
    top:20px;
    left:20px;
    z-index:20;
    padding:10px;
    background-color:#000;
}
#menu li{margin:0}
#menu a{
	margin:0;
	color:#FFF;
}

/* Sliding panels */
.curtains>li {
    background:#e6e6e6 url(img/blizzard.png);
	text-align: center
}
.curtains>li .inner{
	width: 1000px;
	margin: 0 auto;
}

.curtains li h2{
	margin: 184px 0 65px
}
.curtains li h2 span{
	display: inline-block;
	padding-top: 25px;
	font-size: 15px;
}
.curtains li p{
	line-height: 1.8
}
.fSP{ display: none !important}

/* Section 1
----------------------------------------*/
#sec1{
    background: url(../img/img_cover.jpg) no-repeat;
    background-size:cover;
}
#sec1 h2{
	padding-left: 30px;
	text-align: left
}
#sec1 #linkScroll{
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	padding: 15px 0 10px;
	background: #e6e6e6
}

/* Section 2
----------------------------------------*/
#sec2 h3{
	margin-bottom: 25px
}
#sec2 p{
	margin-bottom: 80px;
	font-size: 17px;
	line-height: 2.4
}

/* Section 3
----------------------------------------*/
.inBloc{
	display: inline-block;
	text-align: left
}
#sec3 h3{
	margin-bottom: 24px;
	font-size: 22px;
}
#sec3 .inBloc{
	position: relative;
	padding: 20px 0 60px 270px;
}
#sec3 .imgBox{
	position: absolute;
	top: 0;
	left: 0
}

/* Section 4
----------------------------------------*/
#liSrv1 li{
	position: relative;
	float: left;
	width: 46%;
	margin-bottom: 30px;
	padding-left: 4%;
	text-align: left;
	font-size: 20px;
	font-weight: bold;
}
#liSrv1 li span{
	position: absolute;
	top: -5px;
	left: 0;
	display: inline-block;
	margin-right: 10px;
	font-size: 30px;
	line-height: 1;
	color: #7ac943;
	border-bottom: 2px solid #7ac943
}
#flow{
	clear: both;
	margin-top: 40px;
	padding: 35px 0 50px;
	background: #000;
	color: #fff
}
#flow h3{
	margin-bottom: 30px;
	font-size: 22px;
	letter-spacing: 1px
}
.ulTxt{
	text-decoration: underline
}
#flow div div{
	margin: 10px 0 0;
	padding: 20px 0;
	background: #f2f2f2;
	border-radius: 15px;
	color: #000
}
#flow h4{
	font-size: 25px;
}
#flow h4 img{
	vertical-align: middle
}
#liSrv2{
	display: inline-block;
	margin-top: 15px;
	padding-top: 15px;
	border-top: 3px solid #000
}
#liSrv2 li{
	display: inline;
	padding: 0 10px;
}
#liSrv2 li:before{
	content: "□ "
}

/* Section 5
----------------------------------------*/
#sec5 dl{
	float: left;
	margin: 0 2% 0 0;
	text-align: left;
	font-size: 14px
}
#sec5 dl dt{
	float: left;
	width: 100px;
	margin-bottom: 20px;
}
#sec5 dl dd{
	margin: 0 0 20px 100px
}
.w60{ width: 58%}
.w40{ width: 38%}
#sec5 h3{
	clear: both;
	margin-bottom: 20px;
	padding: 30px 0 15px;
	border-bottom: 2px solid #000;
	text-align: left
}
.liCmp{
	float: left;
	width: 33%;
	margin-bottom: 65px;
	text-align: left;
}
.liCmp li{
	margin-bottom: 15px
}
.liCmp li:before{
	content: "■ "
}
#map_canvas{
	width: 100%;
	height: 300px
}

/* Section 6
----------------------------------------*/
#sec6 h3{
	margin-bottom: 25px
}
#sec6 .w45, #sec6 .w55{
	float: left;
	text-align: left
}
.w55{ width: 55%}
.w45{ width: 45%}

#sec6 p{
	margin-bottom: 30px;
	font-size: 14px;
}
#sec6 a{
	color: #000
}
#sec6 table{
	width: 100%
}
#sec6 th, #sec6 td{
	width: 30%;
	vertical-align: middle;
	padding: 1% 2.5%;
	font-size: 14px;
	background: #fff;
	border: 10px solid #e6e6e6;
	border-left: none
}
#sec6 th{
	font-weight: bold
}
#sec6 td{
	width: 60%;
	border-right: none
}
#sec6 input[type="text"], #sec6 textarea{
	width: 94%;
	padding: 3%;
	border: none
}
.rTxt{
	text-align: right
}
#sendBtn{
	width: 254px;
	height: 30px;
	background: url(../img/bg_sendBtn.png) no-repeat 0 100%;
	border: none;
	text-indent: -9999px;
	cursor: pointer
}
#sendBtn:hover{
	background-position: 0 0
}
#toTop{
	clear: both;
	padding: 150px 0 75px;
	text-align: center
}
footer{
	position: static;
	width: 96%;
	height: 58px;
	min-width: 1000px;
	padding: 15px 2% 0;
	background: #f7f7f7;
	z-index: 1
}

@media screen and (max-width:480px){

.fPC, #gnavSP, footer{ display: none !important}
.fSP{ display: block !important}

header{
	width: 100%;
	min-width: 100%;
	padding: 40px 0 0;
}
header h1{
	float: none;
	width: 60%;
	margin-bottom: 10px;
}
header h1 img{
	width: 100%;
	height: auto
}
header p{
	position: absolute;
	top: 15px;
	right: 2%;
	font-size: 10px
}

#toggle{
	display: block;
	position: absolute;
	top: 35px;
	right: 10px;
	width: 40px;
	height: 40px;
	background: #000;
	text-indent: -9999px
}
#toggle a{
	display: block;
	position: relative;
	padding: 12px 0 10px;
	color: #fff;
	text-align: center;
	text-decoration: none;
}
#toggle:before{
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	left: 10px;
	width: 20px;
	height: 20px;
	margin-top: -10px;
	background: #fff;
}
#toggle a:before, #toggle a:after{
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	left: 10px;
	width: 20px;
	height: 4px;
	background: #000
}
#toggle a:before{
	margin-top: -6px;
}
#toggle a:after{
	margin-top: 2px;
}
#gnavSP{ margin-top: 10px}
#gnavSP li a{
	display: block;
	padding: 15px 20px;
	background: #000;
	color: #fff;
	border-bottom: 1px solid #222
}

header .inner,
.curtains>li .inner{
	width: 92%;
	padding: 0 4%
}

.curtains li h2{
	margin: 120px 0 20px
}
.curtains li h2 span{
	padding-top: 15px;
	font-size: 13px;
}
.curtains li h2 img{
	width: auto !important;
	height: 40px !important;
}

.curtains li p, .curtains li li{
	font-size: 14px
}

/* Section 1
----------------------------------------*/
#sec1{
    background-size: auto 50%;
	background-position: 100% bottom
}
#sec1 h2{
	padding: 0;
	text-align: center
}
#sec1 h2 img{
	width: 80% !important;
	height: auto !important
}


/* Section 2
----------------------------------------*/
#sec2 p{
	margin-bottom: 40px;
	font-size: 18px;
	line-height: 1.6
}

/* Section 3
----------------------------------------*/
.inBloc{
	display: inline-block;
	text-align: left
}
#sec3 h3{
	margin-bottom: 24px;
	font-size: 18px;
	line-height: 1.4
}
#sec3 .inBloc{
	position: relative;
	padding: 20px 15px 0 50%;
}
#sec3 .imgBox{
	left: 15px;
	width: 40%;
}
#sec3 .imgBox img, .w100{
	width: 100% !important;
	height: auto !important
}

/* Section 4
----------------------------------------*/
#liSrv1 li{
	float: none;
	width: 92%;
	padding-left: 8%;
	font-size: 18px;
	line-height: 1.4
}
#liSrv1 li span{
	position: absolute;
	top: 0;
	font-size: 25px;
	line-height: 1;
}
#flow h3{
	font-size: 18px;
	line-height: 1.4
}
#flow div div{
	margin: 10px 0 0;
	padding: 20px 0;
	background: #f2f2f2;
	border-radius: 15px;
	color: #000
}
#flow h4{
	font-size: 18px;
}
#liSrv2{
	width: 90%;
	margin: 15px auto 0;
}
#liSrv2 li{
	padding: 0 10px 0 0;
}

/* Section 5
----------------------------------------*/
#sec5 dl{
	float: none;
	margin: 0;
}
.w60, .w40{ width: 100%}

.liCmp{
	float: none;
	width: 100%;
	margin-bottom: 0;
	text-align: left;
}

/* Section 6
----------------------------------------*/
#sec6 .w45, #sec6 .w55{
	float: none
}
.w55, .w45{ width: 100%}

#sec6 th, #sec6 td{
	border: 3px solid #e6e6e6;
}
.rTxt{
	margin-top: 20px;
	text-align: center
}

#toTop{
	clear: both;
	padding: 50px 0 0;
	text-align: center
}

}