@charset "UTF-8";

@media only screen and (max-width: 767px) {
/* responsive
-------------------------- */
.spSet {display: block !important;}
.pcSet {display: none !important;}
.spService {display: block !important;}
/* element
-------------------------- */
section {
	padding: 30px 10px;
	margin: 0 auto;
	position: relative;
}
/* button
-------------------------- */
.btn_common {
	width: 200px;
	padding: 0 10px;
	font-size: 14px;
	line-height: 45px;
	border: 2px solid #fff;
}
.btn_common:after {
	top: 17px;
	right: 20px;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
}
/* header
-------------------------- */
header {
	height: 64px;
}
header .inner {
	padding: 0;
}
#logo {
	width: calc(100% * 150/680);
	top: 5px;
	left: 10px;
}
#logo img {
	width: 90px;
}
#head_right {
	float: none;
	width: 100%;
	padding: 0;
}
#head_right h1 {
	display: none;
}
a.btn_inquiry {
	display: none;
}
#spnav_opener {
	display: block;
	width: 64px;
	height: 64px;
	position: absolute;
	right: 0;
	top: 0;
	padding: 0;
	background: url(../_img/spnav_close.png) center center no-repeat;
	background-size: 100%;
	cursor: pointer;
}
#spnav_opener.opened {
	background-image: url(../_img/spnav_close.png);
	}
#spnav_opener.closed {
	background-image: url(../_img/spnav_open.png);
	}
#nav {
	display: none;
	position: absolute;
	top: 64px;
	width: 100%;
	padding: 0;
	text-align: left;
	background: rgba(0,0,0,.4);
	height: calc(100vh - 64px);
	border-top: solid 1px #ddd;
	overflow-y: scroll;
	-webkit-overflow-scrolling: touch;
	z-index: 100;
}
#nav li {
	display: block;
	margin: 0;
}
#nav li:before {
	border-top: none;
	border-right: none;
}
#nav li a {
	font-size: 16px;
	width: 100%;
	border-bottom: 1px dotted #ccc;
	background: #fff;
	padding: 15px 25px;
	position: relative;
}
#nav li a:before {
	content: '' !important;
	position: absolute;
	top: 45%;
	left: 10px;
	width: 5px;
	height: 5px;
	border-top: 1px solid #007aae;
	border-right: 1px solid #007aae;
	transform: rotate(45deg);
}
#nav li a:link,
#nav li a:visited {
	color: #007aae !important;
}
#nav li a:hover {
	opacity: 1;
	background: #007aae !important;
	color: #fff !important;
}
#nav li a:hover:before {
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
}
#nav li.li_service a:before {
	background: #666;
	height: 4px;
	width: 4px;
	top: 45%;
	left: 10px;
	border-top: none;
	border-right: none;
	transform: none;
}
#nav li.li_service a:hover {
	background: #fff;
	color: #007aae !important;
}
#nav li.li_service a:hover:before {
	border-top: none;
	border-right: none;
}
#nav .li_service:hover ul {
	display: none;
}
#nav li.spService a {
	background: #f5f5f5;
	padding: 15px 35px;
	line-height: 1.3;
}
#nav li.spService a:before {
	left: 20px;
}
#nav span {
	background: #fff;
	padding: 20px 20px 100px;
}
#nav span a {
	width: 100%;
	max-width: 560px;
	margin: 0 auto;
	display: block;
}
#nav span a img {
	width: 100%;
}
/* footer
-------------------------- */
#back-to-top {
	right: 0;
	bottom: 0;
	width: 50px;
	height: 50px;
}
#back-to-top:after {
	top: 22px;
	right: 16px;
	width: 15px;
	height: 15px;
}
#footCompany {
	width: 100%;
	float: none;
	padding: 30px 0;
	text-align: center;
}
#footCompany img {
	width: 100%;
	max-width: 150px;
	padding: 0 0 10px;
	margin: 0 auto;
}
#footCompany a.btn_inquiry {
	display: block;
	margin: 15px auto 0;
}
#footMenu {
	display: none;
}
/* common_inquiry
-------------------------- */
#inquiryBlock {
	text-align: center;
	padding-bottom: 200px;
}
#inquiryBlock h2 {
	font-size: 22px;
	padding: 0 0 15px;
}
#inquiryBlock p {
	font-size: 13px;
}
#inquiryBlock .btn_common {
	margin: 20px auto 0;
}
#inquiryBlock img.image {
	bottom: 0;
	left: calc(50% - 75px);
	width: 150px;
}
/* common_cdb
-------------------------- */
#cdbBlock {
	text-align: center;
	padding: 30px 10px;
}
#cdbBlock h2 img {
	width: 280px;
	padding: 0 0 15px;
	margin: 0 auto;
}
#cdbBlock p {
	font-size: 13px;
}
.btn_outside {
	margin: 20px auto 0;
}
.btn_outside {
	width: 280px;
	padding: 0 10px;
	margin: 20px auto 0;
	font-size: 14px;
	line-height: 45px;
	border: 2px solid #cacaca;
}
.btn_outside:after {
	top: 13px;
	right: 20px;
}
#cdbBlock img.image {
	position: static;
	width: 260px;
	margin: 30px auto;
}
/* top
-------------------------- */
#top01 img {
	padding: 30px 0 0;
	width: 94%;
	margin: 0 auto;
}
#top01 h2 {
	font-size: 38px;
}
#top01 h2 span {
	font-size: 27px;
}
#top01 p {
	font-size: 12px;
}
.halfLeft {
	width: 100%;
}
.halfRight {
	width: 100%;
	position: static;
}
.halfLeft section {
	max-width: 767px;
	padding: 30px 10px;
	margin: 0;
}
.halfRight section {
	max-width: 767px;
	padding: 30px 10px;
	margin: 0;
}
#top02 h2,
#top03 h2 {
	font-size: 22px;
	padding: 0;
}
#top02 p,
#top03 p {
	font-size: 14px;
}
#top02 img,
#top03 img {
	padding: 0 0 15px;
	max-width: 240px;
}
/* greeting
-------------------------- */
#greeting01 {
	height: 100px;
	padding: 30px 20px;
}
#greeting01 h2 {
	font-size: 20px;
	padding: 0 10px;
}
#greeting01 img {
	right: 20px;
	width: 130px;
}
#greeting02 {
	padding: 30px 20px 45px;
}
#greeting02 h3 {
	font-size: 20px;
	padding: 0 0 20px;
}
#greeting02 p {
	font-size: 14px;
	line-height: 1.6;
}
#greeting02 div {
	width: 150px;
	float: none;
	margin: 2em auto 0;
}
#greeting02 div span {
	padding: 10px 0 0;
	font-size: 12px;
}
/* service
-------------------------- */
#service01 {
	height: 100px;
	padding: 10px 20px;
}
#service01 h2 {
	font-size: 14px;
	line-height: 1.2;
	padding: 0 10px;
}
#service01 h2 span {
	font-size: 12px;
	padding: 0 0 5px;
}
#service01 img {
	bottom: -10px;
	right: 10px;
	width: 160px;
}
#service01 img.a01 {
	bottom: 0;
	right: 10px;
	width: 140px;
}
#service02 {
	padding: 30px 20px 45px;
}
#service02 p {
	font-size: 14px;
	line-height: 1.6;
}
#service02 img {
	margin: 0 auto 30px;
}
#service02 img.a02 {
	margin: 20px auto 0;
}
#service02 div {
	margin: 30px auto 0;
}
#service02 div span {
	font-size: 12px;
}
#service02 h4 {
	font-size: 16px;
	padding: 20px 0 5px;
}
#service02 dl {
	padding: 10px 15px;
	margin: 15px auto;
}
#service02 dt {
	padding: 5px 0 0 10px;
	font-size: 15px;
}
#service02 dt:before {
	top: 12px;
	width: 6px;
	height: 6px;
	border-radius: 3px;
}
#service02 dd {
	padding: 5px 0 10px 10px;
	font-size: 14px;
}
/* works
-------------------------- */
#works01 {
	height: 100px;
	padding: 30px 20px;
}
#works01 h2 {
	font-size: 20px;
	padding: 0 10px;
}
#works01 img {
	right: 0;
	width: 160px;
}
#works02 {
	padding: 30px 20px 45px;
}
#works02 .workBlock {
	width: 100%;
	margin: 0 0 45px;
}
#works02 span.h3_outer {
	width: 100%;
	height: 70px;
	line-height: 35px;
	padding: 35px 20px 0;
	margin: 0 auto 20px;
	text-align: left;
}
#works02 h3 {
	width: 100%;
	height: 50%;
	font-size: 16px;
	padding: 0 20px;
}
#works02 ul {
	margin: 15px 0;
}
#works02 li {
	display: block;
	width: 100%;
	margin: 0 auto 30px;
}
#works02 li img {
	width: 90%;
	max-width: 500px;
}
#works02 li.arrow {
	width: 100%;
	margin: 0 auto 10px;
}
#works02 li.arrow img {
	width: 100%;
	max-width: 46px;
	transform: rotate(0deg);
}
#works02 p {
	font-size: 14px;
	line-height: 1.6;
}
/* company
-------------------------- */
#company01 {
	height: 100px;
	padding: 30px 20px;
}
#company01 h2 {
	font-size: 20px;
	padding: 0 10px;
}
#company01 img {
	right: 20px;
	width: 130px;
}
#company02 {
	padding: 30px 20px 45px;
}
#company02 table {
	font-size: 14px;
}
#company02 th {
	width: 100%;
	padding: 10px 20px;
	display: block;
}
#company02 td {
	width: 100%;
	padding: 10px 20px;
	display: block;
}
/* privacypolicy
-------------------------- */
#privacypolicy01 {
	height: 60px;
	padding: 20px;
}
#privacypolicy01 h2 {
	font-size: 15px;
	padding: 0 10px;
}
#privacypolicy02 {
	padding: 30px 20px 45px;
}
#privacypolicy02 h4,
#box_agree h4 {
	font-size: 16px;
	padding: 0 0 10px !important;
}
#privacypolicy02 div p,
#box_agree div p {
	margin: 5px 0;
	font-size: 14px;
}
#privacypolicy02 div dt,
#box_agree div dt {
	padding: 5px 10px;
	margin: 15px 0 5px;
	font-size: 14px;
}
#privacypolicy02 div dd,
#box_agree div dd {
	padding: 5px 10px;
	font-size: 14px;
}
#privacypolicy02 div ol,
#box_agree div ol {
	margin: 0 0 0 10px;
}
#privacypolicy02 div ul,
#box_agree div ul {
	margin: 5px 0 0 10px;
}
/* inquiry
-------------------------- */
#inquiry01 {
	height: 100px;
	padding: 30px 20px;
}
#inquiry01 h2 {
	font-size: 20px;
	padding: 0 10px;
}
#inquiry01 img {
	right: 20px;
	width: 90px;
}
#inquiry02 {
	padding: 30px 20px;
}
#inquiry02 h4 {
	font-size: 16px;
	line-height: 1.4;
	padding: 0 0 15px;
}
#inquiry02 p {
	font-size: 14px;
	line-height: 1.6;
}
#inquiry02 dl {
	padding: 20px 0 0;
	margin: 25px 0 0;
}
#inquiry02 dt {
	font-size: 16px;
	padding: 0 0 5px 20px;
}
#inquiry02 dt:before {
	width: 8px;
	height: 8px;
	border-radius: 8px;
}
#inquiry02 dd {
	margin: 0 0 15px;
}
input[type="text"],
textarea {
	padding: 10px;
	font-size: 14px;
}
textarea {
	height: 160px;
}
.btn_orange {
	height: 50px;
	padding: 10px;
	margin: 20px auto;
	font-size: 16px;
}
#box_agree {
	height: 160px;
	padding: 10px;
}


/* style
-------------------------- */
.mg_t30 {margin-top: 15px;}







}