@media screen and (max-width:670px){
	body{
		padding:60px 0 0;
	}
	input[type="button"],input[type="submit"]{
		-webkit-appearance:none;
		border-radius:0;
	}
              .br-sp { display:none; }
	/* ===== header ===== */
	header{
		background:#fff;
		position:fixed;
		width:100%;
		padding:9px 0;
		min-height:42px;
		z-index:9;
		top:0;
	}
	header.gray{
		background:#999;
	}
	header h1{
		width:190px;
		margin:0 10px;
	}
	header h1 img{
		width:100%;
		z-index: 12;
	}
	header .sns_area{
		position:absolute;
		right:10px;
		top:10px;
		width:150px;
		font-size:0;
	}
	header .sns_area li{
		font-size:12px;
		width:40px;
		display:inline-block;
		margin:0 0 0 10px;
	}
	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.tw{
		display:none;
	}
	header .sns_area li.fb{
		display:none;
	}
	header .sns_area li.ig{
		display:none;
	}
	header .sns_area li.tel{
		display:none;
	}
	header nav{
		display:none;
	}
	header nav ul{
		border-top:#ccc solid 1px;
	}
	header nav ul li{
		border-bottom:#ccc solid 1px;
	}
	header nav ul li a{
		width:auto;
		height:50px;
		line-height:50px;
		display:block;
		color:#000;
		font-weight:bold;
		letter-spacing:0.2em;
		text-decoration:none;
		text-indent:10px;
	}
	header nav ul li a:before{
		content:">";
		display:inline-block;
		vertical-align:middle;
		margin:0 10px 0 0;
		color:#3C97C8;
	}
	header.gray nav ul li a{
		color:#fff;
	}

	/* ===== article ===== */
	.newsimage{
		background:url(../images/img_news.jpg) center;
		background-size:cover;
		-webkit-background-size:cover;
		-moz-background-size:cover;
		width:100%;
		height:240px;
		display:table;
	}
	.aboutimage{
		background:url(../images/img_about.jpg) center;
		background-size:cover;
		-webkit-background-size:cover;
		-moz-background-size:cover;
		width:100%;
		height:240px;
		display:table;
	}
	.serviceimage{
		background:url(../images/img_service.jpg) center;
		background-size:cover;
		-webkit-background-size:cover;
		-moz-background-size:cover;
		width:100%;
		height:240px;
		display:table;
	}
	.recruitimage{
		background:url(../images/img_recruit.jpg) center;
		background-size:cover;
		-webkit-background-size:cover;
		-moz-background-size:cover;
		width:100%;
		height:240px;
		display:table;
	}
	.privacyimage{
		background:url(../images/img_privacy.jpg) center;
		background-size:cover;
		-webkit-background-size:cover;
		-moz-background-size:cover;
		width:100%;
		height:240px;
		display:table;
	}
	.contactimage{
		background:url(../images/img_contact.jpg) center;
		background-size:cover;
		-webkit-background-size:cover;
		-moz-background-size:cover;
		width:100%;
		height:240px;
		display:table;
	}
	article hgroup{
		letter-spacing:0.2em;
		text-align:center;
		position:relative;
		vertical-align:middle;
		display:table-cell;
	}
	.toppage article hgroup{
		display:block;
	}
	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;
		background-size:cover;
		-webkit-background-size:cover;
		-moz-background-size:cover;
		width:100%;
		display:table;
		margin:0 0 85px;
		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;
		position:relative;
		z-index: 5;
	}
	.topimage .textblock h2{
		font-size:36px;
		margin:0 0 20px;
		padding:0;
		line-height:1.5;
		border-bottom:none;
		text-shadow:none;
		color:#fff;
	}
	.topimage .textblock h3{
		font-size:22px;
		color:#fff;
		margin:0 10px;
	}
	.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;
		-webkit-transition: all 1s;
		-moz-transition: all 1s;
		-ms-transition: all 1s;
		-o-transition: all 1s;
		transition: all 1s;
		border:#3C97C8 solid 2px;
		line-height:56px;
		position:absolute;
		bottom:20px;
		left:0;
		right:0;
		text-indent:-9999px;
		z-index: 5;
	}
	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:137px;
		left:0;
		right:0;
		border-radius:14px;
	}
	.toppage article hgroup small{
		top:48px;
	}
	.servicelist p{
		/*width:960px;*/
		margin:40px 20px 0;
		font-size:18px;
		text-align:center;
	}
	.servicelist ul{
		width:100%;
		margin:60px 0;
	}
	.servicelist ul li{
		background:#1E374E;
		text-align:center;
		font-size:24px;
		font-weight:bold;
		line-height:60px;
		margin:0 0 2px;
	}

	.servicelist ul li.service02{
		background:#3C97C8;
	}
	.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{
		display:none;
	}
	/* ===== newslist ===== */
	.newslist,
	.newsdetail{
		padding:0 0 40px;
	}
	.top{
		padding-top:30px;
	}
	.newslist dl{
		margin:30px;
		border-top:#ccc dashed 1px;
	}
	.newslist dl dt{
		padding:20px 0 5px;
	}
	.newslist dl dd{
		padding:0 0 20px;
		border-bottom:#ccc dashed 1px;
	}
	.newslist .btn_news,
	.newsdetail .btn_news{
		margin:0 30px;
		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 .paging{
		font-size:0;
		text-align:center;
	}
	.newslist .paging li{
		display:inline-block;
		margin:0 10px;
	}
	.newslist .paging li:first-child,
	.newslist .paging li:last-of-type{
		display:none;
	}
	.newslist .paging li a{
		background:#1E374E;
		min-width:0px;
		font-size:14px;
		line-height:40px;
		padding:0 10px;
		display:block;
		border-radius:20px;
		color:#fff;
		text-decoration:none;
	}
	.newsdetail h3{
		position:relative;
		margin:30px;
		padding-bottom:10px;
		border-bottom:3px solid #ddd;
		font-size:18px;
		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{
		margin:0 30px 30px;
		padding:0 0 30px;
		border-bottom:#ccc dashed 1px;
	}
	.newsdetail .textarea iframe{
		max-width:100% !important;
		height:auto !important;
	}
	.newsdetail .textarea img{
		max-width:100% !important;
		height:auto !important;
	}
	/* ===== service ===== */
	.service{
		padding:0 0 40px;
	}
	.service > p{
		margin:30px 30px 60px;
		font-size:16px;
		text-align:center;
	}
	.service ul{
		margin:0 auto;
	}
	.service ul li{
	}
	.service ul li:not(:last-child){
		margin-bottom:100px;
	}
	.service ul li figure{
		margin:0 30px 15px;
	}
	.service ul li .textarea{
		padding: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{
		padding:0 0 40px;
	}
	.about > p{
		margin:30px;
		font-size:16px;
		text-align:center;
	}
	.about dl{
		margin:30px 30px 0;
		line-height:2.0;
	}
	.about dl dt{
		background:#eee;
		padding:20px;
		font-weight:bold;
	}
	.about dl dd{
		padding:20px;
	}
	.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;
                border:#fff solid 1px;
                box-sizing:border-box;
              }
	/* ===== privacy ===== */
	.privacy{
		padding:0 0 40px;
	}
	.privacy .lead{
		margin:30px;
		font-size:16px;
		text-align:center;
	}
	.privacy h3{
		position:relative;
		margin: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{
		color:#3C97C8;
		font-size:18px;
		font-weight:bold;
		letter-spacing:0.1em;
		margin:30px;
	}
	.privacy p:not(.lead){
		margin:15px 30px 0;
	}
	.privacy dl{
		margin:0 30px 0;
	}
	.privacy dl dt{
		font-weight:bold;
	}
	.privacy dl dd{
		margin:15px 0 30px;
		padding:0 0 0 15px;
	}
	.privacy ul{
		background:#f3f3f3;
		margin:20px 30px;
		padding:30px 20px;
	}
	.privacy ul li{
		font-size:12px;
		margin:0 0 10px 1em;
	}
	.privacy ul li:before{
		content:"・";
		margin:0 0 0 -1em;
	}
	/* ===== recruit ===== */
	.recruit{
		padding:0 0 40px;
	}
	.recruit .lead{
		margin:30px;
		font-size:16px;
		text-align:center;
	}
	.recruit h3{
		position:relative;
		margin: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{
		color:#3C97C8;
		font-size:18px;
		font-weight:bold;
		letter-spacing:0.1em;
		margin:30px;
	}
	.recruit p:not(.lead){
		margin:0 30px;
	}
	.recruit dl{
		margin:0 30px 0;
		border-bottom:#dedbcc solid 1px;
		line-height:2.0;
	}
	.recruit dl dt{
		background:#eee;
		padding:20px;
		font-weight:bold;
	}
	.recruit dl dd{
		padding:20px;
	}
	.recruit ul.btn_button{
		text-align:center;
	}
	.recruit ul.btn_button li{
		display:inline-block;
		margin:30px 0 0;
	}
	.recruit ul.btn_button li button{
		background:#fff;
		width:260px;
		height:56px;
		border:none;
		color:#3C97C8;
		text-align:center;
		cursor:pointer;
		border:#3C97C8 solid 2px;
		font-size:14px;
		line-height:56px;
	}
	.recruit ul.btn_button li button:hover{
		background:#3C97C8;
		color:#fff;
	}
	/* ===== contact ===== */
	.contact{
		padding:0 0 40px;
	}
	.contact .lead{
		margin:30px;
		font-size:16px;
		text-align:center;
	}
	.contact p:not(.lead){
		margin:30px auto;
	}
	.contact dl{
		margin:30px;
		border-bottom:#ccc solid 1px;
	}
	.contact dl dt{
		line-height:40px;
		padding:20px 0 0;
		border-top:#ccc solid 1px;
	}
	.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{
		min-height:40px;
		padding:20px 0;
	}
	.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:100%;
		height:38px;
		border:#ccc solid 1px;
		font-size:14px;
		padding:0 0 0 10px;
		box-sizing:border-box;
	}
	.contact dl dd select{
		height:38px;
		border:#ccc solid 1px;
	}
	.contact dl dd textarea{
		width:100%;
		height:148px;
		border:#ccc solid 1px;
		font-size:14px;
		line-height:1.5;
		padding:10px;
		box-sizing:border-box;
	}
	.contact ul.btn_submit{
		text-align:center;
	}
	.contact ul.btn_submit li{
		margin:0 5px 15px;
	}
	.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;
		font-weight:bold;
		line-height:51px;
	}
	.contact ul.btn_submit li input[type="submit"]:hover{
		background:#3C97C8;
		color:#fff;
	}


	/* ===== footer ===== */

	footer .btn_topto{
		text-align:right;
		margin:0 10px 10px;
	}
	footer .btn_topto a{
		background:#3C97C8;
		width:40px;
		height:40px;
		display:inline-block;
		border-radius:20px;
	}
	footer .links{
		background:#eee;
		padding:30px 0;
		border-top:#ccc solid 1px;
		border-bottom:#ccc solid 1px;
	}
	footer .links ul li{
		text-align:center;
		margin:0 0 10px;
	}
	footer .links ul li:last-of-type{
		margin:0;
	}
	footer address{
		margin:30px 10px;
		font-style:normal;
		text-align:center;
	}
	footer address a{
	color:#33a0b8;
	text-decoration:none;
	}
	footer address figure{
		width:270px;
		height:60px;
		margin:10px auto;
	}
	footer address h2{
		font-size:18px;
	}
	footer .sns_area{
		font-size:0;
		text-align:center;
	}
	footer .sns_area li{
		width:40px;
		display:inline-block;
		margin:0 5px 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 nav ul{
		font-size:0;
		margin:30px 30px;
	}
	footer nav ul li{
		width:50%;
		font-size:14px;
		line-height:40px;
		display:inline-block;
	}
	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;
	}
}