@charset "utf-8";
*{
	margin:0;
	padding:0;
	list-style:none;
}
html{
	/*background:#3C97C8;*/
}
body{
	background:#fff;
	font-family:  -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Noto Sans JP", "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, arial, Meiryo, sans-serif;
	font-size:16px;
	line-height:1.8;
	color:#333;
}
.clearfix{
	zoom:100%;
	min-height:0px;
}
.clearfix:after{
	content:"";
	display:block;
	clear:both;
}

img{
	vertical-align:top;
}
article a{
	color:#33a0b8;
	text-decoration:none;
}
article a:hover{
		text-decoration:underline;
}
a img{
	border:none;
}
@media screen and (min-width:671px){
	html{
		min-width:990px;
	}
	/* ===== header ===== */
	header{
		position:fixed;
		width:100%;
		padding:10px 0;
		height:85px;
		top:0;
		z-index:3;
	}
	header.gray{
		background:#999;
		/*background:rgba(141,192,49,0.6);*/
		z-index:9;
	}
	header h1{
		position:absolute;
		left:0;
		right:0;
		width:270px;
		margin:auto;
		bottom:0;
		text-align:center;
	}
	header h1 img{
		width:100%;
		z-index:12;
	}
	header .sns_area{
		text-align:right;
		font-size:0;
		margin:0 0 10px;
	}
	header .sns_area li:not(.tel){
		width:40px;
	}
	header .sns_area li.tel_sp{
		display:none;
	}
	header .sns_area li{
		width:40px;
		display:inline-block;
		margin:0 10px 0 0;
	}
	header .sns_area li a{
		background:#1E374E;
		display:block;
		width:auto;
		height:40px;
		border-radius:20px;
		-webkit-transition: all 1s;
		-moz-transition: all 1s;
		-ms-transition: all 1s;
		-o-transition: all 1s;
		transition: all 1s;
	}
	header .sns_area li:first-child a{
		background:#3C97C8;
	}
	header .sns_area li.tel{
		background:#fff;
		width:auto;
		height:40px;
		border-radius:20px;
	}
	header .sns_area li.mail a:hover{
		background:url(../images/icon_mail_hover.png) no-repeat center #fff;
		background-size:cover;
		-webkit-background-size:cover;
		-moz-background-size:cover;
	}
	header .sns_area li.tw a:hover{
		background:url(../images/icon_tw_hover.png) no-repeat center #fff;
		background-size:cover;
		-webkit-background-size:cover;
		-moz-background-size:cover;
	}
	header .sns_area li.fb a:hover{
		background:url(../images/icon_fb_hover.png) no-repeat center #fff;
		background-size:cover;
		-webkit-background-size:cover;
		-moz-background-size:cover;
	}
	header .sns_area li.ig a:hover{
		background:url(../images/icon_ig_hover.png) no-repeat center #fff;
		background-size:cover;
		-webkit-background-size:cover;
		-moz-background-size:cover;
	}
	header .sns_area li a:hover img{
		opacity:0;
	}
	header nav{
		width:990px;
		margin:0 auto;
	}
	header nav ul li{
		width:180px;
		float:left;
		text-align:center;
	}
	header nav ul li.nav02{
		margin:0 270px 0 0;
	}
	header nav ul li a{
		width:auto;
		height:34px;
		display:block;
		color:#000;
		font-weight:bold;
		letter-spacing:0.2em;
		text-decoration:none;
		line-height:34px;
		border-bottom:#3C97C8 solid 1px;
		-webkit-transition: all 1s;
		-moz-transition: all 1s;
		-ms-transition: all 1s;
		-o-transition: all 1s;
		transition: all 1s;
	}
	header nav ul li.nav02 a,
	header nav ul li.nav03 a{
		border-bottom:#1E374E solid 1px;
	}
	header nav ul li a:hover{
		border-bottom:#fff solid 1px;
	}
	.toppage header nav ul li a,
	header.gray nav ul li a{
		color:#fff;
	}
	/* ===== article ===== */
	.newsimage{
		background:url(../images/img_news.jpg) center fixed;
		background-size:cover;
		-webkit-background-size:cover;
		-moz-background-size:cover;
		height:265px;
		padding:195px 0 0;
	}
	.aboutimage{
		background:url(../images/img_about.jpg) center fixed;
		background-size:cover;
		-webkit-background-size:cover;
		-moz-background-size:cover;
		height:265px;
		padding:195px 0 0;
	}
	.serviceimage{
		background:url(../images/img_service.jpg) center fixed;
		background-size:cover;
		-webkit-background-size:cover;
		-moz-background-size:cover;
		height:265px;
		padding:195px 0 0;
	}
	.recruitimage{
		background:url(../images/img_recruit.jpg) center fixed;
		background-size:cover;
		-webkit-background-size:cover;
		-moz-background-size:cover;
		height:265px;
		padding:195px 0 0;
	}
	.privacyimage{
		background:url(../images/img_privacy.jpg) center fixed;
		background-size:cover;
		-webkit-background-size:cover;
		-moz-background-size:cover;
		height:265px;
		padding:195px 0 0;
	}
	.contactimage{
		background:url(../images/img_contact.jpg) center fixed;
		background-size:cover;
		-webkit-background-size:cover;
		-moz-background-size:cover;
		height:265px;
		padding:195px 0 0;
	}
	article hgroup{
		letter-spacing:0.2em;
		text-align:center;
		position:relative;
	}
	article h2{
		font-size:42px;
		font-weight:bold;
		line-height:1.0;
		display:inline-block;
		margin:0 auto;
		padding:0 0 20px;
		border-bottom:#e5e5e5 solid 1px;
		text-shadow:-1px -1px 5px #fff,1px 1px 5px #fff;
	}
	.topimage{
		background:url(../images/mainimage.jpg) center fixed;
		background-size:cover;
		-webkit-background-size:cover;
		-moz-background-size:cover;
		width:100%;
		padding:105px 0 60px;
		margin:0 0 85px;
		display:table;
		position:relative;
	}
	.topimage:after{
		content: "";
		background: rgba(60,151,200,0.25);
		width: 100%;
		display: block;
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		z-index: 1; 
	}
	.topimage .textblock{
		display:table-cell;
		vertical-align:middle;
		text-align:center;
		line-height:1.0;
		position:relative;
		z-index: 5; 
	}
	.topimage .textblock h2{
		font-size:60px;
		margin:0 0 40px;
		padding:0;
		line-height:1.5;
		border-bottom:none;
		text-shadow:none;
		color:#fff;
		letter-spacing:0.1em;
	}
	.topimage .textblock h3{
		font-size:24px;
		color:#fff;
	}
	.topimage a{
		background:url(../images/icon_arw.png) no-repeat #3C97C8;
		background-size:cover;
		-webkit-background-size:cover;
		-moz-background-size:cover;
		width:40px;
		height:40px;
		border-radius:22px;
		display:block;
		margin:0 auto;
		text-decoration:none;
		text-align:center;
		-webkit-transition: all 1s;
		-moz-transition: all 1s;
		-ms-transition: all 1s;
		-o-transition: all 1s;
		transition: all 1s;
		border:#3C97C8 solid 2px;
		position:absolute;
		bottom:20px;
		left:0;
		right:0;
		text-indent:-9999px;
		z-index: 5;
	}
	.topimage a:hover{
		background:url(../images/icon_arw_hover.png) no-repeat #fff;
		background-size:cover;
		-webkit-background-size:cover;
		-moz-background-size:cover;
	}
	article hgroup small{
		background:#fff;
		width:110px;
		margin:auto;
		padding:7px;
		color:#3C97C8;
		font-size:14px;
		font-weight:bold;
		line-height:1.0;
		position:absolute;
		z-index:1;
		top:48px;
		left:0;
		right:0;
		border-radius:14px;
	}
	.servicelist p{
		/*width:960px;*/
		margin:40px 20px 0;
		font-size:18px;
		text-align:center;
	}
	.servicelist ul{
		width:100%;
		margin:60px 0;
		display:table;
	}
	.servicelist ul li{
		background:#1E374E;
		width:33%;
		display:table-cell;
		text-align:center;
		font-size:24px;
		font-weight:bold;
		line-height:60px;
	}
	.servicelist ul li.service02{
		background:#3C97C8;
		width:34%;
		border-left:#fff solid 1px;
		border-right:#fff solid 1px;
		box-sizing:border-box;
	}
	.servicelist ul li figure{
		height:270px;
		position:relative;
	}
	.servicelist ul li.service01 figure{
		background:url(../images/top_service01.jpg) center top;
		background-size:cover;
		-webkit-background-size:cover;
		-moz-background-size:cover;
	}
	.servicelist ul li.service02 figure{
		background:url(../images/top_service02.jpg) center top;
		background-size:cover;
		-webkit-background-size:cover;
		-moz-background-size:cover;
	}
	.servicelist ul li.service03 figure{
		background:url(../images/top_service03.jpg) center top;
		background-size:cover;
		-webkit-background-size:cover;
		-moz-background-size:cover;
	}
	.servicelist ul li a{
		width:100%;
		height:330px;
		display:block;
		color:#fff;
		text-decoration:none;
	}
	.servicelist ul li a figcaption{
		background:rgba(255,255,255,0.9);
		color:#333;
		position:absolute;
		width:100%;
		height:270px;
		padding:30px;
		box-sizing:border-box;
		-webkit-transition: all 1s;
		-moz-transition: all 1s;
		-ms-transition: all 1s;
		-o-transition: all 1s;
		transition: all 1s;
		opacity:0;
		font-size:14px;
		line-height:1.6;
	}
	.servicelist ul li a:hover figcaption{
		opacity:1;
	}
	/* ===== newslist ===== */
	.newslist,
	.newsdetail{
		margin:105px 0 0;
		padding:0 0 40px;
	}
	.top{
		padding-top:40px;
	}
	.newslist dl{
		width:960px;
		margin:30px auto;
		border-bottom:#ccc dashed 1px;
	}
	.newslist dl dt{
		width:160px;
		padding:20px 0;
		float:left;
		border-top:#ccc dashed 1px;
	}
	.newslist dl dd{
		width:800px;
		padding:20px 0;
		float:left;
		border-top:#ccc dashed 1px;
	}
	.newslist .btn_news,
	.newsdetail .btn_news{
		width:960px;
		margin:0 auto;
		text-align:right;
	}
	.newslist .btn_news a,
	.newsdetail .btn_news a{
		color:#333;
		line-height:20px;
		text-decoration:none;
	}
	.newslist .btn_news a:before,
	.newsdetail .btn_news a:before{
		content:">";
		width:20px;
		height:20px;
		text-align:center;
		line-height:20px;
		display:inline-block;
		background:#3C97C8;
		color:#fff;
		margin:0 10px 0 0;
		border-radius:10px;
		vertical-align:middle;
	}
	.newslist .btn_news a:hover,
	.newsdetail .btn_news a:hover{
		text-decoration:underline;
	}
	.newslist .paging{
		font-size:0;
		text-align:center;
	}
	.newslist .paging li{
		display:inline-block;
		margin:0 10px;
	}
	.newslist .paging li a{
		background:#1E374E;
		min-width:20px;
		font-size:14px;
		line-height:40px;
		padding:0 10px;
		display:block;
		border-radius:20px;
		color:#fff;
		text-decoration:none;
		-webkit-transition: all 1s;
		-moz-transition: all 1s;
		-ms-transition: all 1s;
		-o-transition: all 1s;
		transition: all 1s;
	}
	.newslist .paging li a:hover{
		background:#fff;
		color:#1E374E;
	}
	.newsdetail h3{
		position:relative;
		width:960px;
		margin:30px auto 30px;
		padding-bottom:10px;
		border-bottom:3px solid #ddd;
		font-size:24px;
		font-weight:bold;
		letter-spacing:0.1em;
	}
	.newsdetail h3:after{
		content:"";
		display:block;
		position:absolute;
		left:0;
		bottom:-3px;
		width:33%;
		height:3px;
		background:#3C97C8;
	}
	.newsdetail .textarea{
		width:960px;
		margin:0 auto 30px;
		padding:0 0 30px;
		border-bottom:#ccc dashed 1px;
	}
	/* ===== service ===== */
	.service{
		margin:105px 0 0;
		padding:0 0 40px;
	}
	.service > p{
		width:960px;
		margin:30px auto 60px;
		font-size:18px;
		text-align:center;
	}
	.service ul{
		width:960px;
		margin:0 auto;
	}
	.service ul li{
		display:table;
	}
	.service ul li:not(:last-child){
		margin-bottom:280px;
	}
	.service ul li figure{
		width:50%;
		display:table-cell;
		vertical-align:middle;
		padding:0 30px 0 0;
	}
	.service ul li .textarea{
		width:50%;
		display:table-cell;
		vertical-align:middle;
		padding:0 0 0 30px;
	}
	.service ul li .textarea h3{
		position:relative;
		margin:0 0 30px;
		padding-bottom:10px;
		border-bottom:3px solid #ddd;
		font-size:24px;
		font-weight:bold;
		letter-spacing:0.1em;
	}
	.service ul li .textarea h3:after{
		content:"";
		display:block;
		position:absolute;
		left:0;
		bottom:-3px;
		width:33%;
		height:3px;
		background:#3C97C8;
	}
	.service ul li .textarea h4{
		color:#3C97C8;
		font-size:18px;
		font-weight:bold;
		letter-spacing:0.1em;
		margin:30px 0;
	}
	/* ===== about ===== */
	.about{
		margin:105px 0 0;
		padding:0 0 40px;
	}
	.about > p{
		width:960px;
		margin:30px auto 60px;
		font-size:18px;
		text-align:center;
	}
	.about dl{
		width:960px;
		margin:30px auto 0;
		line-height:2.0;
	}
	.about dl dt{
		width:230px;
		margin:0 0 20px;
		padding:20px 20px 0 0;
		float:left;
		border-top:#dedbcc solid 1px;
	}
	.about dl dd{
		width:710px;
		margin:0 0 20px;
		padding:20px 0 0;
		float:left;
		border-top:#dedbcc solid 1px;
	}
	.about figure{
		padding:20px 0 0;
	}
              .about a[href^="http"] {
                             background:url(../images/linkico.png) no-repeat right center;
                             padding-right:18px;
                             margin-right:5px;
              }
               .about a[href^="https://sanyou-kominato.com/"] {
                             background:none;
                             padding-right:0px;
                             margin-right:0px;
               }
               #map_canvas_01 {
                width: 100%;
                height: 450px;
				float:left;
				border-right:#fff solid 1px;
				box-sizing:border-box;
               }
	/* ===== privacy ===== */
	.privacy{
		margin:105px 0 0;
		padding:0 0 40px;
	}
	.privacy .lead{
		width:960px;
		margin:30px auto 60px;
		font-size:18px;
		text-align:center;
	}
	.privacy h3{
		width:960px;
		position:relative;
		margin:30px auto 30px;
		padding-bottom:10px;
		border-bottom:3px solid #ddd;
		font-size:24px;
		font-weight:bold;
		letter-spacing:0.1em;
	}
	.privacy h3:after{
		content:"";
		display:block;
		position:absolute;
		left:0;
		bottom:-3px;
		width:33%;
		height:3px;
		background:#3C97C8;
	}
	.privacy h4{
		width:960px;
		color:#3C97C8;
		font-size:18px;
		font-weight:bold;
		letter-spacing:0.1em;
		margin:30px auto;
	}
	.privacy p:not(.lead){
		width:960px;
		margin:15px auto 0;
	}
	.privacy dl{
		width:960px;
		margin:0 auto 0;
	}
	.privacy dl dt{
		font-weight:bold;
	}
	.privacy dl dd{
		margin:15px 0 30px;
		padding:0 0 0 15px;
	}
	.privacy ul{
		width:960px;
		background:#f3f3f3;
		margin:0 auto 0;
		padding:30px 20px;
	}
	.privacy ul li{
		margin:0 0 10px 1em;
	}
	.privacy ul li:before{
		content:"・";
		margin:0 0 0 -1em;
	}
	
	/* ===== recruit ===== */
	.recruit{
		margin:105px 0 0;
		padding:0 0 40px;
	}
	.recruit .lead{
		width:960px;
		margin:30px auto 60px;
		font-size:18px;
		text-align:center;
	}
	.recruit h3{
		width:960px;
		position:relative;
		margin:30px auto 30px;
		padding-bottom:10px;
		border-bottom:3px solid #ddd;
		font-size:24px;
		font-weight:bold;
		letter-spacing:0.1em;
	}
	.recruit h3:after{
		content:"";
		display:block;
		position:absolute;
		left:0;
		bottom:-3px;
		width:33%;
		height:3px;
		background:#3C97C8;
	}
	.recruit h4{
		width:960px;
		color:#3C97C8;
		font-size:18px;
		font-weight:bold;
		letter-spacing:0.1em;
		margin:30px auto;
	}
	.recruit p:not(.lead){
		width:960px;
		margin:0 auto;
	}
	.recruit dl{
		width:960px;
		margin:0 auto 0;
		border-bottom:#dedbcc solid 1px;
		line-height:2.0;
	}
	.recruit dl dt{
		width:230px;
		margin:0 0 20px;
		padding:20px 20px 0 0;
		float:left;
		border-top:#dedbcc solid 1px;
	}
	.recruit dl dd{
		width:710px;
		min-height:28px;
		margin:0 0 20px;
		padding:20px 0 0;
		float:left;
		border-top:#dedbcc solid 1px;
	}
	.recruit ul.btn_button{
		text-align:center;
		font-size:0;
	}
	.recruit ul.btn_button li{
		display:inline-block;
		margin:30px 0 0;
	}
	.recruit ul.btn_button li button{
		background:#fff;
		width:260px;
		height:56px;
		display:block;
		color:#3C97C8;
		text-align:center;
		cursor:pointer;
		border:#3C97C8 solid 2px;
		font-size:14px;
		line-height:51px;
		text-decoration:none;
		font-weight:bold;
		-webkit-transition: all 1s;
		-moz-transition: all 1s;
		-ms-transition: all 1s;
		-o-transition: all 1s;
		transition: all 1s;
	}
	.recruit ul.btn_button li button:hover{
		background:#3C97C8;
		color:#fff;
	}
	/* ===== contact ===== */
	.contact{
		margin:105px 0 0;
		padding:0 0 40px;
	}
	.contact .lead{
		width:960px;
		margin:30px auto 60px;
		font-size:18px;
		text-align:center;
	}
	.contact p:not(.lead){
		width:960px;
		margin:30px auto;
	}
	.contact dl{
		width:960px;
		margin:30px auto;
		border-bottom:#ccc solid 1px;
	}
	.contact dl dt{
		width:30%;
		min-height:40px;
		line-height:40px;
		padding:20px 0;
		border-top:#ccc solid 1px;
		float:left;
	}
	.contact dl dt.must:before{
		background:#3C97C8;
		width:40px;
		height:40px;
		content:"必須";
		margin:0 10px 0 0;
		display:inline-block;
		text-align:center;
		color:#fff;
		border-radius:20px;
	}
	.contact dl dt:not(.must){
		text-indent:50px;
	}
	.contact dl dd{
		width:70%;
		min-height:40px;
		line-height:40px;
		padding:20px 0;
		border-top:#ccc solid 1px;
		float:left;
	}
	.contact dl dd .red{
		color:#f00;
		font-weight:bold;
		margin:0 0 10px;
	}
	.contact dl dd ul li{
		display:inline-block;
		margin:0 10px 0 0;
	}
	.contact dl dd input[type="text"]{
		width:670px;
		height:38px;
		border:#ccc solid 1px;
		font-size:14px;
		padding: 0 0 0 10px ;
	}
	.contact dl dd select{
		height:38px;
		border:#ccc solid 1px;
	}
	.contact dl dd textarea{
		width:670px;
		height:148px;
		border:#ccc solid 1px;
		font-size:14px;
			line-height:1.5;
		padding: 10px 10px 10px 10px ;
	}
	.contact ul.btn_submit{
		text-align:center;
	}
	.contact ul.btn_submit li{
		display:inline-block;
	}
	.contact ul.btn_submit li input[type="submit"]{
		background:#fff;
		width:260px;
		height:56px;
		border:none;
		color:#3C97C8;
		text-align:center;
		cursor:pointer;
		border:#3C97C8 solid 2px;
		font-size:14px;
		line-height:51px;
		font-weight:bold;
		-webkit-transition: all 1s;
		-moz-transition: all 1s;
		-ms-transition: all 1s;
		-o-transition: all 1s;
		transition: all 1s;
	}
	.contact ul.btn_submit li input[type="submit"]:hover{
		background:#3C97C8;
		color:#fff;
	}


	/* ===== footer ===== */
	footer .btn_topto{
		text-align:right;
		margin:0 10px 20px;
	}
	footer .btn_topto a{
		background:url(../images/icon_topto.png) no-repeat #3C97C8;
		background-size:cover;
		-webkit-background-size:cover;
		-moz-background-size:cover;
		width:40px;
		height:40px;
		display:inline-block;
		border-radius:20px;
		text-decoration:none;
		text-align:center;
		-webkit-transition: all 1s;
		-moz-transition: all 1s;
		-ms-transition: all 1s;
		-o-transition: all 1s;
		transition: all 1s;
		text-indent:-9999px;
	}
	footer .btn_topto a:hover{
		background:url(../images/icon_topto_hover.png) no-repeat center #fff;
		background-size:cover;
		-webkit-background-size:cover;
		-moz-background-size:cover;
	}
	footer .links{
		background:#eee;
		padding:30px 0 0;
		border-top:#ccc solid 1px;
		border-bottom:#ccc solid 1px;
	}
	footer .links ul{
		width:918px;
		font-size:0;
		margin:0 auto;
	}
	footer .links ul li{
		width:246px;
		min-height:60px;
		display:inline-block;
		margin:0 30px 30px;
	}
	footer .inner{
		width:990px;
		margin:40px auto 0;
		display:table;
	}
	footer address{
		display:table-cell;
		height:60px;
		position:relative;
		padding:0 0 0 280px;
		box-sizing:border-box;
		font-style:normal;
	}
	footer address figure{
		width:270px;
		height:60px;
		position:absolute;
		top:0;
		left:0;
	}
	footer address h2{
		font-size:18px;
	}
	footer .sns_area{
		display:table-cell;
		width:150px;
		vertical-align:middle;
		text-align:right;
		font-size:0;
	}
	footer .sns_area li{
		width:40px;
		display:inline-block;
		margin:0 10px 0 0;
	}
	footer .sns_area li a{
		background:#3C97C8;
		display:block;
		width:auto;
		height:40px;
		border-radius:20px;
		-webkit-transition: all 1s;
		-moz-transition: all 1s;
		-ms-transition: all 1s;
		-o-transition: all 1s;
		transition: all 1s;
	}
	footer .sns_area li.tw a:hover{
		background:url(../images/icon_tw_hover.png) no-repeat center #fff;
		background-size:cover;
		-webkit-background-size:cover;
		-moz-background-size:cover;
	}
	footer .sns_area li.fb a:hover{
		background:url(../images/icon_fb_hover.png) no-repeat center #fff;
		background-size:cover;
		-webkit-background-size:cover;
		-moz-background-size:cover;
	}
	footer .sns_area li.ig a:hover{
		background:url(../images/icon_ig_hover.png) no-repeat center #fff;
		background-size:cover;
		-webkit-background-size:cover;
		-moz-background-size:cover;
	}
	footer .sns_area li a:hover img{
		opacity:0;
	}
	footer nav ul{
		text-align:center;
		font-size:0;
		margin:30px 0;
	}
	footer nav ul li{
		font-size:14px;
		display:inline-block;
		margin:0 20px;
	}
	footer nav ul li:before{
		content:">";
		display:inline-block;
		vertical-align:middle;
		margin:0 10px 0 0;
		color:#3C97C8;
	}
	footer nav ul li a{
		color:#333;
		text-decoration:none;
	}
	footer nav ul li a:hover{
		text-decoration:underline;
	}
	footer small{
		background:#3C97C8;
		width:100%;
		height:60px;
		display:block;
		line-height:60px;
		text-align:center;
		color:#fff;
	}
}