@charset "utf-8";

/*All devices************************************************************************************************************************/


/*All************************************************************************************************************************/
body,html {height: 100%;width: 100%;}
body {
	background: #fff url(/img/hik.jpg) repeat center center/150px;
	color: #666;
	font-family: "ヒラギノ丸ゴ Pro", "Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 15px;
	line-height: 2;
	margin: 0px;
	padding: 0px;
	-webkit-text-size-adjust: none;
	overflow-y: scroll;
}

h1,h2,h3,h4,h5,p,ul,ol,li,dl,dt,dd,form,figure,form {
	font-size: 100%;
	font-weight: normal;
	margin: 0px;
	padding: 0px;
}

img {border: none;max-width: 100%;height: auto;vertical-align: middle;}

table {border-collapse:collapse;font-size: 100%;border-spacing: 0;}

ol {padding-left: 40px;padding-bottom: 15px;}

ul {list-style-type: none;}

iframe {width: 100%;height: 100%;}

.check {
	background: #c3b5a2;background: rgba(0,0,0,0.1);
	padding: 5px 10px;border-radius: 4px;
}

/*link******************************************************************/
a {
	color: #666;
	transition: 0.3s;
}
a:hover {
	color: #cd6052;
	text-decoration: none;
}

/*conteiner**************************************************************/
#container {height: 100%;width: 100%;}

/*top image*****************************************************************/

#topimg {
	background: url(/img/hik_top_s.jpg) no-repeat;
	background: url(/img/hik_dot.png) no-repeat left top / 60%, url(/img/hik_top.jpg) no-repeat right bottom / cover;
	height: 100%;
	position: fixed;top: 0px;z-index: -50;
	text-indent: -9999px;
	width: 100%;
}


/*header****************************************************************************/
header {height: 90%;}

header #logo img {
	border-radius: 50%;
	left: 5%;
	position: fixed;
	top: -40px;
	width: 20%;
}

header #smlkn img {
	position: fixed;
	max-width: 90%;
	max-height: 90%;
	right: 0%;
	top: 10%;
	z-index: -40;
}

header #thanks img {
	position: fixed;
	max-width: 90%;
	max-height: 90%;
	right: 0%;
	top: 10%;
	z-index: -40;
}
/*menu*******************************************************************/
@keyframes menu1 {
	0% {opacity: 0;}
	100% {opacity: 1;}
}

#logo,#menu_01,#menu_02,#menu_03,#menu_04 {
	animation-name: menu1;
	animation-duration: 5S;
	animation-fill-mode: both;
}

#menubar img {border-radius: 50%;}

header #logo a:hover,#menubar a:hover {opacity: 0.8;}

#menu_01 {
	animation-delay: 0.2s;
	left: 15%;
	position: fixed;
	top: 27%;
	width: 10%;
}

#menu_02 {
	animation-delay: 0.4s;
	left: 4%;
	position: fixed;
	top: 40%;
	width: 12%;
}

#menu_03 {
	animation-delay: 0.6s;
	left: 11%;
	position: fixed;
	top: 60%;
	width: 9%;
}

#menu_04 {
	animation-delay: 0.8s;
	left: 7%;
	position: fixed;
	top: 75%;
	width: 6%;
}

/*contents***************************************************************/
.contents {
	overflow: hidden;
	padding: 0 4% 50px 30%
}

.contents.n01 {
	background: url(/img/hik1.jpg);
	background: url(/img/hik1.jpg) repeat center top/ 12%;
}

.contents.n02 {
	background: url(/img/hik2.jpg);
	background: url(/img/hik2.jpg) repeat center top/ 12%;
}

.contents.n03 {
	background: url(/img/hik3.jpg);
	background: url(/img/hik3.jpg) repeat center top/ 12%;
}

.contents.n04 {
	background: url(/img/hik4.jpg);
	background: url(/img/hik4.jpg) repeat center top/ 12%;
}

.contents.n05 {
	background: url(/img/hik5.jpg);
	background: url(/img/hik5.jpg) repeat center top/ 12%;
}

.contents h2 {
	color: #333;
	font-size: 40px;
	letter-spacing: 0.2em;
	margin-bottom: 20px;
	text-align: center;
}

.contents h2::before {
	content: "*";
	display: block;
	text-shadow: 20px 10px 0px rgba(255,255,255,0.5);
}
.contents h2 span {
	display: block;
	font-size: 12px;
}

.contents h3 {
 	background: #fff;
 	background: rgba(255,255,255,0.3);
 	border-radius: 30px;
 	letter-spacing: 0.1em;
 	margin-bottom: 20px;
 	padding: 0px 20px;
 	text-align: center;
 }
 
 .contents p {padding: 0 30px 20px;}
 
 .contents p + p {margin-top: -5px;}
 
/*news*********************************************************/
#new dl {padding: 0 30px;}

#new dt {
	color: #cd6052;
	float: left;
	letter-spacing: 0.1em;
	width: 9em;
}

#new dd {padding-left: 9em;}

.new {
	background: #F00;
	border-radius: 2px;
	color: #FFF;
	font-size: 70%;
	line-height: 1.5;
	margin: 0px 5px;
	padding: 2px 5px;
	vertical-align: text-top;
}


/*gallery***************************************************/
 .case img {
 	border-radius: 50%;
 	float: left;
 	margin: 10px 0.5%;
 	width: 24%
 }
 
 /*form************************************************************************************************************************/
input {
	border:0;
	border:solid 0px #EEA34A;
	border-radius: 3px;
	color:#000;
	height: 2em; 
	margin:0 0 20px;
	width: 60%;
	-webkit-appearance: none;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
}

textarea {
	border:0;
	border:solid 0px #EEA34A;
	border-radius: 3px;
	color:#000;
	height: 7em; 
	margin:0 0 20px;
	width: 70%;
	-webkit-appearance: none;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
}

input[type="submit"] {
	background: #c3b5a2;
	background: rgba(0,0,0,0.1);
	border:solid 0px #EEA34A;
	border-radius: 3px;
	height: 50px;
	margin:0 0 20px;
	padding:10px;
	width: 200px;
	-webkit-appearanec: none;
}

input[type="button"] {
	background: #c3b5a2;
	background: rgba(0,0,0,0.1);
	border:solid 0px #EEA34A;
	border-radius: 3px;
	height: 50px;
	margin:0 0 20px;
	padding:10px;
	width: 200px;
	-webkit-appearanec: none;
}

#formWrap {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	max-width: 40%;
	max-height: 90%;
	color:#555;
	line-height:120%;
	font-size:90%;
}

table.formTable {
	width:100%;
	margin:0 auto;
	border-collapse:collapse;
}

table.formTable td,table.formTable th {
	border:1px solid #ccc;
	padding:10px;
}

table.formTable th {
	width:30%;
	font-weight:normal;
	background:#efefef;
	text-align:left;
}

p.error_messe {
	margin:5px 0;
	color:red;
}

/*privacy***************************************************************/
#privacy p {

}
#privacy pre {
	margin-top: 0;
	padding: 0 30px 20px;
	white-space: pre-wrap;
}
#privacy ul {
	padding: 0 30px 20px 60px;
	list-style-type: disc;
}

/*footer****************************************************/
footer {
 	background: url(/img/hik.jpg);
 	background: url(/img/hik.jpg) repeat center top/ 12%;
	clear: both;
	padding: 20px;
	text-align: center;
}

footer a {text-decoration: none;}
footer .pr {display: block;}

/*other***************************************************/
.mb15,.mb1em {margin-bottom: 15px !important;}
.mb30 {margin-bottom: 30px !important;}
.mb50 {margin-bottom: 50px !important;}
.p0 {padding:0 !important;}
.clear {clear: both;}
ul.disc {padding: 0em 25px 15px;list-style: disc;}
.color1, .color1 a {color: #cd6052 !important;}
.pr {font-size: 10px;}
.wl {width: 96%;}
.ws {width: 50%;}
.c {text-align: center;}
.r {text-align: right;}
.l {text-align: left;}
.w50 {overflow: hidden;width: 50%;}
.fl {float: left;}
.fr {float: right;}
.big1 {font-size: 50px;}
.mini1 {font-size: 11px;display: inline-block;line-height: 1.5;}
.sh {display: none;}
.ta1 {margin: 0 auto 30px;width: 100%;}
.ta1 td, .ta1 th {padding: 10px 15px;word-break: break-all;}
.ta1 tr {background: url(../img/seg1.png) repeat-x left bottom;}
.ta1 th.tam {width: auto;	text-align: center;background: url(../img/seg1.png) repeat-x left top,rgba(255,255,255,0.2);}
.ta1 th {width: 140px;text-align: right;}
.ta1 th img {width: 100%;}


#news > dl > dd > ul {
	padding-bottom: 4%;
}
#news > dl > dd > ul::after {
	content: "";
	display: block;
	height: 0;
	visibility: hidden;
	clear: both;
}
#news > dl > dd > ul > li {
	float: left;
	padding: 0 2%;
	width: 10%;
	font-size: 12px;
	text-align: center;
}

/*under800px devices***************************************************/
@media screen and (max-width:800px){
	body.s-n #sub,body.s-n #footermenu,.m-n {display: none;}
	.big1 {font-size: 24px;}
	.w50 {overflow: hidden;width: auto;}
	.fl {float: none;}
	.fr {float: none;}
}

/*under480px devices***************************************************/
@media screen and (max-width:480px){
	body {
		font-size: 12px;
		line-height: 1.5;
	}
	header #logo img {
		position: fixed;
		left: 2%;
		top: 10px;
	}
	#menu_01,#menu_02,#menu_03,#menu_04 {width: 15%;}

	#menu_01 {
		position: fixed;
		left: 4%;
		top: 20%;
	}
	
	#menu_02 {
		position: fixed;
		left: 4%;
		top: 35%;
	}
	
	#menu_03 {
		position: fixed;
		left: 4%;
		top: 50%;
	}
	
	#menu_04 {
		position: fixed;
		left: 6.5%;
		top: 65%;
		width: 10%;
	}
	.contents {padding: 0 4% 50px 25%;}
	
	.contents h2 {
		font-size: 20px;
		letter-spacing: normal;
	}
	
	.contents h2 span {font-size: 10px;}
	
	.contents p {padding: 0 0 20px;}
	
	#new dl {padding: 0;}

	#new dt {
		float: none;
		width: auto;
	}
	
	#new dd {
		padding-left: 0;
		margin-bottom: 8px;
	}
	.ws,.wl {width: 94%;}
	.big1 {font-size: 16px;}
	.sh {display:block;}
	.pc {display:none;}
	.ta1, .ta1 td, .ta1 th {padding: 5px;}
	.ta1 th {width: 100px;}

	#news > dl > dd > ul > li {
		width: 25%;
		padding: 2%;
		font-size: 0;
	}
}