/********************************* web fonts */
@font-face {
    font-family: 'NotoSansCJKjp-Light';
    src: url('../fonts/Noto-Light.woff') format('woff'),url('../fonts/Noto-Light.eot') format('eot');
}

/********************************* icon fonts */
@font-face {
	font-family: 'icomoon';
	src:url('../fonts/icomoon.eot?4drmoz');
	src:url('../fonts/icomoon.eot?#iefix4drmoz') format('embedded-opentype'),
		url('../fonts/icomoon.woff?4drmoz') format('woff'),
		url('../fonts/icomoon.ttf?4drmoz') format('truetype'),
		url('../fonts/icomoon.svg?4drmoz#icomoon') format('svg');
	font-weight: normal;
	font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
	font-family: 'icomoon';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;

	/* Better Font Rendering =========== */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.icon-calendar:before {
	content: "\e600";
}

.icon-comment:before {
	content: "\e601";
}

.icon-feedly:before {
	content: "\e602";
}

.icon-folder:before {
	content: "\e603";
}

.icon-gototop:before {
	content: "\e604";
}

.icon-gotonext:before {
	content: "\e605";
}

.icon-hatebu:before {
	content: "\e606";
}

.icon-line:before {
	content: "\e607";
}

.icon-pen:before {
	content: "\e608";
}

.icon-pocket:before {
	content: "\e609";
}

.icon-search:before {
	content: "\e60a";
}

.icon-tag:before {
	content: "\e60b";
}

.icon-google-plus:before {
	content: "\ea88";
}

.icon-facebook:before {
	content: "\ea8c";
}

.icon-twitter:before {
	content: "\ea91";
}
/********************************* base */
body{
	background-color: #fff;
	line-height: 100%;
	font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
}
body a:link{
	color:#008fa9;
}
body a:visited{
	color:#666;
}

img.nodisplay{
  display: none;
}
.nobr{
	display: none;
}
.textcenter{
	text-align:center;
}
.textright{
	text-align:right;
}
.textleft{
	text-align: left;
}
.warning{
	color: #f00;
}
.alert{
	font-size: 70%;
}
.wrapper{}
/********************************* navi */
#gototop{
	background-color:#000;
    filter:alpha(opacity=30);
    -moz-opacity: 0.3;
    opacity: 0.3;
    color: #FFF;
    width: 30px;
    height: 25px;
    padding-top: 5px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	text-align: center;
	position: fixed;
	z-index: 100;
}
#gototop a{
	color: #fff;
	text-decoration:none;
}
/********************************* header */
.header-wrp{
	width:100%;
	height: 88px;
	position: fixed;
	z-index: 999;
	border-bottom: solid 3px #008fa9;
	background-color:#fff;
	margin-bottom: 50px;
}
.header{
	width: 100%;
	max-width : 900px;
	margin-left: auto;
	margin-right: auto;
}
.header .logo{
	width: 50%;
	float: left;
	padding-top: 16px;
	margin-top: 8px;
	font-family: 'NotoSansCJKjp-Light';
	letter-spacing: 3px;
	line-height: 120%;
	font-size: 110%;
	color:#008fa9;
}
.header .logo-f{
	letter-spacing: 1px;
}
.header .sitedata{
	width: 195px;
	float: right;
	background:url('../images/logo_tel.png') no-repeat;
	text-indent: -9999px;
	height: 38px;
	margin-top: 24px;

}

/********************************* contents */
.contents-wrp{
	width:100%;
}
.contents{
	width: 100%;
	max-width : 1000px;
	margin-left: auto;
	margin-right: auto;
	background:url('../images/bg.png') repeat-y;
	background-position: 0 100px;
	padding-top: 160px;
}
.section{
	max-width : 900px;
	width: 90%;
	margin-left: auto;
	margin-right: auto;
	padding-bottom: 80px;
}
.section .section-header{
	margin-bottom: 80px;
	font-family: 'NotoSansCJKjp-Light';
}
.section .section-num{
	width: 84px;
	height: 60px;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	background-color: #008fa9;
	color:#fff;
	float: left;
	text-align: center;
	padding-top: 24px;
	margin-right: 16px;
}
.section .section-num .num{
	font-size: 210%;
}
.section .section-num .ti{
	font-size: 65%;
}
.section .section-header h2{
	font-size: 200%;
	color: #008fa9;
	line-height: 120%;
}
.section .section-header .section-subtitle{
	font-size: 50%;
	line-height: 0;
}
.single{
	padding-top: 20px;
	line-height: 100%;
}
.double{
	padding-top: 5px;
	line-height: 120%;
}
.section .section-text{
	line-height: 200%;
	font-size: 110%;
	width: 89%;
	margin-left: 11%;
}
.section .section-text p{
	margin-bottom: 20px;
}

.arrow{
	text-align: center;
	color:#b3b3b3;
	font-size: 150%;
	padding-bottom: 80px;
	
}
#sns{
	margin-bottom: 60px;
	clear:both;
	overflow: hidden;
}
#sns > div{
	float: left;
	width: 19.1%;
	margin-left: 1%;
	color: #fff;
	text-align: center;
	vertical-align:top;
}
#sns > div:first-child{
	margin-left: 0;
}
#sns > div a{
	display: block;
	font-size:12px;
	color: #fff;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	padding: 10px 4px;
	text-decoration:none;
}
#sns .iconfont{
	margin-right:4px;
	position: relative;
	top: 1px;
}
#sns #sns-fb a{
	background-color:#3C5A99;
}
#sns #sns-tw a{
	background-color:#55ACEE;
}
#sns #sns-go a{
	background-color:#dd4b39;
}
#sns #sns-ha a{
	background-color:#1a99cd;
}
#sns #sns-li a{
	background-color:#00c300;
}
/******************************** footer */
.footer{
	width: 50%;
	min-width: 600px;
	margin-left: auto;
	margin-right: auto;
	line-height: 150%;
	font-family: 'NotoSansCJKjp-Light';
	padding-bottom: 80px;
}
.footer h3{
	font-size: 200%;
	color: #008fa9;
	text-align: center;
	margin-bottom: 50px;
}
.btn,
.btn-r{
	margin-bottom: 50px;
}
.btn > a{
	display: block;
	width: 50%;
	height: 35px;
	margin-left: auto;
	margin-right: auto;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	background-color: #008fa9;
	text-decoration: none;
	text-align: center;
	padding-top: 8px;
	font-size: 100%;
}
.btn-r > a{
	display: none;
}
.btn > a:link,
.btn-r > a:link
{
	color: #fff;

}
.btn > a:visited,
.btn-r > a:visited{
	color: #fff;

}
.footer-address{
	width: 70%;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 20px;
}
.footer-name{
	font-size: 20px;
	text-align: center;
}
.copy{
	font-size: 70%;
	margin-bottom: 40px;
	text-align: center;
}

/******************************** contact */

.contact h1{
	font-size: 200%;
	color: #008fa9;
	line-height: 150%;
	text-align: center;
	margin-bottom: 30px;
}
.contact p{
	margin-bottom: 20px;
}
.contact .contactbox .inputbox{
	width: 400px;
	margin-left: auto;
	margin-right: auto;
}
.contact .contactbox .inputbox input,
.contact .contactbox .inputbox textarea{
	width: 300px;
	margin-bottom: 30px;
}
.contact .contactbox .inputbox textarea{
	height: 200px;
}
.contact .contactbox .c-label{
	margin-bottom: 10px;
}
.mess{
	text-align: center;
	margin-bottom: 40px;
}
.mess input{
	width:100px;
}
.m-copyright a,
.m-copyright a:link,
.m-copyright a:visited{
	color: #f2f2f2;
}
.previewbox{
	width: 300px;
	margin-right:auto;
	margin-left: auto;
}
.preview .c-line{
	margin-bottom: 20px;
}
.preview .c-title{
	color:#008fa9;
	margin-bottom: 10px;
}
.error{
	width: 400px;
	margin-right:auto;
	margin-left: auto;
	margin-bottom: 100px;

}