@charset "UTF-8";
/* CSS Document */
@import url("html5reset-1.6.1");

/*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;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}
 
body {
    line-height:1;
}
 
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { 
    display:block;
}
 
nav ul {
    list-style:none;
}
 
blockquote, q {
    quotes:none;
}
 
blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}
 
a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}
 
/* change colours to suit your needs */
ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}
 
/* change colours to suit your needs */
mark {
    background-color:#ff9;
    color:#000; 
    font-style:italic;
    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;
}
 
/* change border colour to suit your needs */
hr {
    display:block;
    height:1px;
    border:0;   
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}
 
input, select {
    vertical-align:middle;
}s

/*------*/

*{
	margin:0;
	box-sizing: border-box;
}
html, body{
	height:100%;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:16px;
	/*min-height:500px;*/
	text-align:center;
	color:#333;
}
body{
	background-color:#F8F8F8;
}
section{
	line-height:1.6em;
	/*padding:10px 0;*/
	margin-bottom:40px;
}
p{
	margin-bottom:1.6em;
}

table{
	width:100%;
	border-collapse: collapse;
	border-spacing: 0px 1px;
	margin-bottom:40px;
}
th{
	background-color:#F5F5F5;
	text-align:center;
	line-height:1.3em;
	font-weight:normal;
}
td, th{
	border:solid 1px #CCC;
	padding:4px 8px;
}
table caption{
	text-align:right;
	font-size:90%;
}
ul{
	margin-left:-1em;
}

dl dt{
	
}

dl dd{
		margin-top:-1.6em;
		margin-left:6em;
}

#contactform textarea{
	
}
#contactform td, #contactform th{
	
	border:none;
	background:none;
}
#contactform th{
	width:auto;
	font-size:14px;
	text-align:right;
	/*vertical-align:top;*/
	/*padding-top:0.5em;*/
	vertical-align: middle;
}
#contactform tr:nth-child(6) th{
	/*vertical-align:top;
	padding-top:1em;*/
}
#contactform th .required,
#contactform th .unrequired{
	display:inline-block;
	vertical-align:middle;
	background:#000;
	padding:4px 10px;
	font-size:12px;
	border-radius:12px;
	margin-left:0.8em;
	letter-spacing:0em;
	color:#FFF;
}
#contactform th .unrequired{
	background:#ccc;
	color:#000;
}
#contactform input,
#contactform textarea{
	width:100% !important;
	font-size:16px;
	height:28px;
	border:solid 1px #CCC;
	border-radius:3px;
}
#contactform textarea{
	height:10em !important;
}
#contactform button,
#contactform input[type="submit"],
#contactform input[type="reset"]{
	padding:1em;
	height:auto;
	background:#000;
	border:solid 1px #CCC;
	border-radius:3px;
	font-size: 18px;
	width: 47% !important;
	letter-spacing: 0em;
	margin-left:1%;
	margin-right:1%;
	color:#FFF;
	text-shadow:rgba(0,0,0,0.48) 0 0 3px;
}


.contact iframe,iframe{
	width:100%;
	border:none;
	border:solid 1px #CCC !important;
	margin-bottom:50px;
}

/*〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜*/
#headnav{
	display:block;
	position:relative;
	height:180px;
	background:url(../images/headBG.gif) #FFF;
}

#homebtn{
	display:block;
	position:absolute;
	width:210px;
	height:130px;
	top:50%;
	margin-top:-66px;
	left:50%;
	margin-left:-105px;
	background:url(../images/logo.png) no-repeat;
	transition: all 200ms 0s ease;
}
#homebtn:hover{
	-webkit-filter: brightness(80%);
filter: brightness(80%);
}
#homebtn a{
	display:block;
	width:210px;
	height:130px;
}
#homebtn a span{
	display:none;
}
#mailform{
	position: absolute;
	top:0px;
	right:calc(50% - 500px);
	display:block;
	width:190px;
	height:60px;
	background:url(../images/ICON-mail.png) no-repeat 0 0 #000;
	padding-left:80px;
	padding-top:10px;
	color:#FFF;
	text-decoration:none;
	line-height:1.4em;
	text-align:left;
	box-sizing: border-box;
	transition: all 400ms 0s ease;
}
#mailform:hover{
	/*box-shadow:rgba(0,0,0,0.25) 0px 0px 0px 1px;
	top:-1px;*/
	color:#FFF;
	background-color:#444;
}

#topimg{
	height:450px;
	width:100%;
	max-width:1000px;
	margin:0 auto;
	background:#000;
	padding:0 calc((100% - 1000px) / 2);
	border-bottom:solid 50px #FFF;
}

#navigation{
	height:50px;
	width:100%;
	max-width:1000px;
	margin:0 auto;
	background:#FFF;
	padding:0 calc((100% - 1000px) / 2);
	border-bottom:solid 5px #333;
	/*margin-bottom:4px;*/
}
#navigation ul{
	width:100%;
	max-width:1000px;
	margin-left:0px;
}
#navigation ul li{
	
	display:block;
	width:20%;
	height:50px;
	line-height:50px;
	padding:0;
	margin:0;
	float:left;
	/*background:#FF0;*/
	

}
#navigation ul li a{
	display:block;
	text-decoration:none;
	font-size:18px;
	color:#333;
	border-bottom:solid 5px #000;
	transition: all 400ms 0s ease;
}
#navigation ul li a:hover{
	border-bottom:solid 5px #00913A;
}

#navigation ul li:nth-child(4) a{
	color:#999;
}
#navigation ul li:nth-child(4) a:hover{
	border-bottom:solid 5px #000;
}


.wrapper{
	width:100%;
	background:#0F0;
}

.content{
	margin: 0 auto;
	padding:0 0px;
	width:100%;
	max-width:800px;
	background:#F00;
	text-align:left;
	padding:50px calc((100% - 800px) / 2) 0;
	padding-top:50px;
}
.content h1{
	display:block;
	width:1000px;
	margin-left:-100px;
	padding-left:100px;	
	font-size:28px;
	font-weight:normal;
	margin-bottom:50px;
	box-sizing: border-box;
	line-height:1.2em;
}
.content h1 small{
	font-size:14px;
}

.content h2{
	font-size:21px;	
	font-weight:normal;
}

.content img{
	padding:0 100px;
	background:#000;
}

.type-a{
	background:#F1F5F3;
}
.type-a h1{
	border-bottom:solid 5px #769E89;
}

.type-b{
	background:#F1F5F3;
}
.type-b h1{
	border-bottom:solid 5px #775D97;
}
.type-c{
	background:#FFF;
}
.type-c h1{
	border-bottom:solid 5px #000;
}
.type-d{
	background:#EFEFEF;
}
.type-d h1{
	border-bottom:solid 5px #000;
}

.fullwidth{
	margin: 0 auto;
	/*position: absolute;*/
	width:100%;
	left:0px;
	text-align:left;
}
.fullwidth h1{
	background:#775D97;
	font-size:36px;
	color:#FFF;
	padding:20px 0;
	text-align:center;
	font-weight:normal;
	border-bottom:none !important;
	margin-bottom:30px;
}
.fullwidth p{
	width:100%;
	max-width:800px;
	padding:0 calc((100% - 800px) / 2);
	
}
/*〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜*/

#company table td{
	border:none;
	border-bottom:solid 1px #000;
	padding:16px 0;
	font-size:18px;
}
#company table tr:last-child td{
	border:none;
}
/*〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜*/

#footer{
	display:block;
	width:100%;
	padding:20px 0 100px 0;
	border-top:solid 5px #000;
	background:#FFF;
}

#page2top{
	display:block;
	/*width:190px;*/
	/*height:50px;*/
	background:#000;
	color:#FFF;
	padding:12px 16px;
	position:fixed;
	bottom:20px;
	right:20px;
	border-radius:3px;
	font-size:14px;
	text-decoration:none;
	transition: all 200ms 0s ease;
}
#page2top:hover{
	background:#444;
}

#cr{
	position: absolute;
	bottom:0;
	left:50%;
	z-index:101;
	margin-left:-111px;
}
.skippr-nav-container{
	/*display:none;*/
}



/*〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜*/

.btn{
	display:block;
	width:100%;
	padding:20px 20px 20px 60px;	
	background:url(../images/arrow-right.gif) no-repeat 30px center;
	border:solid 1px #CCC;
	border-radius:3px;
	text-align:left;
	font-size:100%;
	text-decoration:none;
	color:#333;
}
.btn:hover{
	background-color:#F5F5F5;
}
.btn:active{
	color:#444;
}

/*〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜*/

.clear{
	display:block;
	line-height:1px;
	height:1px;
}

.inlineimg{
	vertical-align:middle;
}

.mb20{
	margin-bottom:20px;
}
.mb30{
	margin-bottom:30px;
}
.mb40{
	margin-bottom:40px;
}
.mb50{
	margin-bottom:50px;
}

.pb50{
	padding-bottom:50px;
}

/*〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜*/
/*1024px*/
@media screen 
	and (max-width: 1024px) {
}

/*768px*/
@media screen 
	and (max-width: 768px) {
}

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


/*320px*/
@media screen 
	and (max-width: 414px) {
		
}
@media screen 
	and (orientation:landscape)
	and (max-width: 736px) {
		
		
}
@media screen 
	and (orientation:landscape)
	and (max-width: 568px) {
	
}
@media screen 
	and (max-width: 320px) {
		
}
