@charset "UTF-8";

/*
Theme Name: common
Version: 1.0
*/


/* =Reset
-------------------------------------------------------------- */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;word-wrap:break-word;overflow-wrap:break-word;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {display: block;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,th,var{font-style:normal;font-weight:normal;}
li{list-style:none;}
caption,th{text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:inherit;}
q:before,q:after{content:'';}
abbr,acronym{border:0;font-variant:normal;}
sup{vertical-align:super;}
sub{vertical-align:text-bottom;}
input,textarea,select,button{font-family:inherit;font-size:inherit;font-weight:inherit;}
input,textarea,select,button{*font-size:100%;}
legend{color:#000;}
img {vertical-align:top;}
input[type="radio"],input[type="checkbox"] {vertical-align: -2px;}
label {cursor: pointer;}


/* =Common
-------------------------------------------------------------- */
body {
	text-align: center;
	line-height: 1;
	-webkit-text-size-adjust: 100%;
}
img {
	max-width: 100%;
	height: auto;
}
input[type="submit"], input[type="reset"] {
	appearance: none;
	cursor: pointer;
}

/* clearfix */
.cf:before, .cf:after {content:"";display:table;}
.cf:after {clear:both;}
.clr {clear: both;}


/* =Styles 
-------------------------------------------------------------- */
body {
	font-family: 'Lato', 'Noto Sans JP', '游ゴシック Medium', '游ゴシック体', 'Yu Gothic Medium', YuGothic, 'ヒラギノ角ゴ ProN', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	color: #383f47;
	background: #fff;
}
* {
	letter-spacing: 0.1em;
}
a {
	text-decoration: none;
	color: #383f47;
}
@media ( min-width: 601px ){
	body {
		font-size: 14px;
	}
	.sp {
		display: none !important;
	}
	.inner {
		max-width: 900px;
		margin: 0 auto;
		padding: 0 20px;
	}
}
@media ( min-width: 961px ){
	.sptab {
		display: none !important;
	}
}
@media ( max-width: 960px ){
	.pc {
		display: none !important;
	}
}
@media ( max-width: 600px ){
	body {
		font-size: 4vw;
	}
	.pctab {
		display: none !important;
	}
	.inner {
		padding: 0 4.4vw;
	}
}


/* header */
body {
	padding-top: 63px;
}
#header {
	position: fixed;
	width: 100%;
	top: 0;
	left: 0;
	padding: 15px 0;
	color: #383f47;
	background: #fff8e3;
	z-index: 1;
}
#header .inner {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
#header a {
	color: #383f47;
	font-weight: bold;
	transition: color .3s;
}
#header a:hover {
	color: #589cd9;
}
#header #logo {
	width: 200px;
}
#header #logo a {
	display: block;
	height: 100%;
}
#header #logo a img {
	width: auto;
}
#header #nav li a {
	display: block;
	padding: 0.5em;
}
@media ( min-width: 961px ){
	#header #nav ul {
		display: flex;
		margin-right: -0.5em;
		justify-content: space-between;
		gap: 1.5em;
	}
	#header .menu_btn {
		display: none;
	}
}
@media ( max-width: 960px ){
	#header #nav {
		position: absolute;
		width: 100%;
		padding: 0 20px;
		top: 100%;
		left: 0;
		background: #fff8e3;
		box-sizing: border-box;
		opacity: 0;
		visibility: hidden;
		transition: opacity .4s, visibility .4s;
	}
	#header:not(.menu_on) #nav {
		display: none;
	}
	#header.menu_on #nav {
		opacity: 1;
		visibility: visible;
	}
	#header #nav ul {
		padding: 0.5em 0;
		border-top: 1px #fff solid;
	}
	#header #nav li {
		margin: 0.5em 0;
	}
	#header .menu_btn {
		position: relative;
		width: 30px;
		height: 22px;
		cursor: pointer;
	}
	#header .menu_btn span {
		position: absolute;
		display: block;
		width: 100%;
		height: 2px;
		background: #383f47;
	}
	#header .menu_btn span:nth-child(1) {
		top: 0;
		transition: transform .4s;
	}
	#header .menu_btn span:nth-child(2) {
		top: 50%;
		transition: opacity .4s;
	}
	#header .menu_btn span:nth-child(3) {
		bottom: 0;
		transition: transform .4s;
	}
	#header.menu_on .menu_btn span:nth-child(1) {
		transform: translateY(13px) rotate(-45deg);
	}
	#header.menu_on .menu_btn span:nth-child(2) {
		opacity: 0;
	}
	#header.menu_on .menu_btn span:nth-child(3) {
		transform: translateY(-13px) rotate(45deg);
	}
}
@media ( min-width: 601px ) and ( max-width: 960px ){
	#header #nav ul {
		font-size: 20px;
	}
}
@media ( max-width: 600px ){
	#header #nav ul {
		font-size: 5.7143vw;
	}
}


/* mv */
#mv {
	background: #fff8e3;
}

@media ( min-width: 601px ){
	#mv {
		padding: 7em 0;
	}
	#mv img {
		width: 13em;
	}
}
@media ( max-width: 600px ){
	#mv {
		padding: 2em 0 3em;
	}
	#mv img {
		width: 9em;
	}
}


/* btn */
.btn {
	flex: 1 1 auto;
	width: 250px;
	margin: 10px;
	padding: 20px 0;
	text-align: center;
	text-transform: uppercase;
	transition: 0.5s;
	background-size: 200% auto;
	color: white;
 /* text-shadow: 0px 0px 10px rgba(0,0,0,0.2);*/
	box-shadow: 0 0 20px #eee;
	border-radius: 40px;
	background-image: linear-gradient(to right, #f6d365 0%, #fda085 51%, #f6d365 100%);
	border: none;
	font-size: 120%;
	font-weight: bold;
}
.btn:hover {
 	background-position: right center;
}


/* section */
.sec + #contact {
	margin-top: -1em;
}
.sec .sec_title {
	font-size: 220%;
	color: #383f47;
	font-weight: bold;
	position: relative;
}
.sec .sec_title::before {
	position: absolute;
	content: '';
	background: url(img/logo_icon.png) no-repeat center center / cover;
	width: 38px;
	height: 20px;
	top: -0.8em;
	right: 0;
	left: 0;
	margin: auto;
}
.sec .sec_title:first-child {
	margin-top: 0;
}
.sec .sec_subtitle {
	position: relative;
	font-size: 140%;
	line-height: 1.4;
}
.sec .sec_subtitle::after {
	position: absolute;
	content: '';
	width: 38px;
	height: 5px;
	background: url(img/subtitle_line.png) no-repeat center center / cover;
	bottom: -1.2em;
	right: 0;
	left: 0;
	margin: auto;
}
@media ( min-width: 601px ){
	.sec {
		padding: 7em 0;
	}
	.sec .sec_title {
		margin: 4em 0 2em;
	}
	.sec .sec_subtitle {
		margin: 4em 0 3em;
	}
}
@media ( max-width: 600px ){
	.sec {
		padding: 4em 0;
	}
	.sec .sec_title {
		margin: 3em 0 1em;
	}
	.sec .sec_subtitle {
		margin: 2.6em 0 2em;
	}
}

/* philosophy */
#philosophy {
	background: #fefaf7;
}
#philosophy .lead {
	margin-top: 5em;
}
#philosophy .lead .main {
	font-size: 150%;
	font-weight: bold;
	margin-bottom: 1.5em;
}
#philosophy .philosophy01 .lead .main {
	color: #fd4b3d;
}
#philosophy .philosophy02 .lead .main {
	color: #4db266;
}
#philosophy .lead .sub {
	line-height: 1.6;
	font-size: 115%;
}
#philosophy .philosophy03 .main {
	font-size: 150%;
	font-weight: bold;
	margin-bottom: 1em;
	color: #54a3dc;
}
#philosophy .philosophy03 .main .mini {
	font-size: 85%;
}
#philosophy .philosophy03 .main span {
	font-size: 130%;
}
#philosophy .philosophy03 ul {
	text-align: left;
	margin-top: 5em;
}
#philosophy .philosophy03 ul li {
	margin-bottom: 4em;
}
#philosophy .philosophy03 ul li:last-child {
	margin-bottom: 0;
}
#philosophy .philosophy03 .sub {
	font-size: 105%;
	line-height: 1.4;
}
@media ( max-width: 960px ){
	#philosophy .lead .main {
		font-size: 115%;
		line-height: 1.4;
	}
	#philosophy .philosophy03 .main {
		font-size: 110%;
		line-height: 1.4;
	}
	#philosophy .philosophy03 .main .mini {
		font-size: 90%;
	}
	#philosophy .lead .sub {
		font-size: 100%;
		text-align: left;
	}
	#philosophy .philosophy03 .sub {
		font-size: 100%;
	}
}


/* service */
#service .lead {
	margin:7em 0 5em;
	line-height: 1.8;
}
.service_list {
	display: flex;
	flex-wrap: wrap;
}
.service_list li {
	box-sizing: border-box;
	border-radius: 5px;
}
.service_list li.service_list01 {
	border: 2px solid #fd4b3d;
}
.service_list li.service_list02 {
	border: 2px solid #4db266;
}
.service_list li.service_list03 {
	border: 2px solid #54a3dc;
}
.service_list li .list_tit {
	padding: 1em 0;
	font-size: 120%;
	color: #fff;
	font-weight: bold;
}
.service_list li.service_list01 .list_tit {
	background: #fd4b3d;
}
.service_list li.service_list02 .list_tit {
	background: #4db266;
}
.service_list li.service_list03 .list_tit {
	background: #54a3dc;
}
.service_list li .in_list {
	padding: 1em 1em 1.2em;
	text-align: left;
	line-height: 1.4;
}
.service_list li .in_list li {
	text-indent: -1.4em;
	padding-left: 1.4em;
	margin-bottom: 1em;
}
.service_list li .in_list li:last-child {
	margin-bottom: 0;
}
.service_list li.service_list01 .in_list li span {
	color: #fd4b3d;
}
.service_list li.service_list02 .in_list li span {
	color: #4db266;
}
.service_list li.service_list03 .in_list li span {
	color: #54a3dc;
}
.service_list li img {
	display: block;
	max-width: 110px;
	margin: 0 auto 1em;
	opacity: 0.7;
}
.service_list li p {
	margin-top: 0.5em;
	line-height: 1.4;
}
.service_list li p span {
	display: inline-block;
}
@media ( min-width: 961px ){
	.service_list {
		justify-content: space-between;
	}
	.service_list li {
		flex: 0 1 32%;
	}
	.service_list li img {
		width: 84%;
	}
}
@media ( max-width: 961px ){
	.service_list {
		flex-direction: column;
	}
	.service_list li {
		flex: 0 1 48%;
		margin-bottom: 2em;
	}
	.service_list li img {
		width: 50%;
	}
}


/* company */
.about_cach {
	line-height: 1.8;
	font-weight: bold;
}
#about .img {
	max-width: 900px;
	margin: 0 auto;
}
.company_tbl {
	margin: 0 auto;
	line-height: 1.8;
}
.company_tbl th {
	padding: 0.8em 1em;
	text-align: right;
	vertical-align: top;
	white-space: nowrap;
}
.company_tbl td {
	padding: 0.8em 1em;
	text-align: left;
}
.company_map iframe {
	width: 100%;
}
@media ( min-width: 601px ){
	.about_cach {
		font-size: 150%;
		margin: 5em 0 4em;
	}
	.company_map iframe {
		height: 350px;
	}
}
@media ( max-width: 600px ){
	.about_cach {
		font-size: 120%;
		margin: 3.5em 0 2.5em;
	}
	.company_map iframe {
		height: 50vw;
	}
}


/* recruit */
.recruit_list {
	display: flex;
	justify-content: center;
	gap: 2em;
}
.recruit_list li {
	padding: 1.5em 1.2em;
	background: #ececec;
}
@media ( max-width: 600px ){
	.recruit_list {
		max-width: 16em;
		margin: 0 auto;
		flex-direction: column;
	}
}


/* contact */
#contact {
	position: relative;
	background: #fefaf7;
}
@media ( min-width: 601px ){
	#contact {
		padding: 7em 0;
	}
}
@media ( max-width: 600px ){
	#contact {
		padding: 4em 0;
	}
}


/* footer */
#footer {
	color: #383f47;
	background: #dcdad6;
	font-weight: bold;
}
#footer .logo {
	width: 180px;
	height: 49.5px;
	margin-bottom: 1em;
}
#footer a {
	color: #383f47;
	transition: color .3s;
}
#footer a:hover {
	color: #fd4d3f;
}
#footer .inner {
	display: flex;
	justify-content: space-between;
}
#footer .info {
	text-align: left;
	line-height: 1.8;
}
#footer .info .tit {
	margin-bottom: 0.5em;
	padding-bottom: 0.3em;
	font-size: 160%;
	border-bottom: 1px #383f47 solid;
}
#footer .info p span {
	display: inline-block;
}
#footer .link li {
	margin: 0.5em 0;
	text-align: left;
}
#footer .link li a {
	line-height: 2;
	white-space: nowrap;
}
#copy {
	padding: 1em 0;
	color: #383f47;
	background: #dcdad6;
	border-top: 1px #383f47 solid;
}
@media ( min-width: 961px ){
	#footer .link {
		min-width: 330px;
	}
}	
@media ( min-width: 961px ){
	#footer {
		padding: 4em 0;
	}
	#footer .inner {
		gap: 3em;
	}
	#footer .link {
		display: flex;
		justify-content: space-between;
		align-items: center;
		gap: 3em;
	}
}
@media ( max-width: 960px ){
	#footer {
		padding: 2em 0;
	}
	#footer .logo {
		margin: 0 auto 1em;
	}
	#footer .inner {
		gap: 1em;
		flex-direction: column;
		align-items: center;
	}
	#footer .inner p {
		text-align: center;
	}
	#footer .link {
		display: flex;
		align-items: center;
		gap: 0 2em;
		flex-wrap: wrap;
		justify-content: center;
	}
	#footer .link li {
		margin: 0;
	}
}

/* fomr */
.form .lead {
	display: inline-block;
	text-align: left;
	margin-bottom: 3em;
	line-height: 1.8;
}
.form .lead .red {
	color: #eb5e28;
}
.form table {
	margin: 0 auto;
}
.form th.req::before {
	content: '※';
	margin-right: 0.3em;
	color: #eb5e28;
}
.form td {
	text-align: left;
}
.form td input[type="text"],
.form td select,
.form td textarea {
	border: 1px solid #d2d2d2;
	background-color: #fff;
	outline: 0;
	transition: border-color .15s, box-shadow .15s;
	box-sizing: border-box;
	border-radius: 3px;
}
.form td input[type="text"]:focus,
.form td select:focus,
.form td textarea:focus {
	border-color: #b9b9b9;
	box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
}
.form td input[type="text"],
.form td select {
	max-width: 100%;
	padding: 0.3em 0.5em;
}
.form td input[type="text"] {
	width: 100%;
	height: 2.4em;
}
.form td select {
	min-height: 2.4em;
	vertical-align: top;
}
.form td textarea {
	width: 100%;
	min-height: 150px;
	padding: 0.3em 0.5em;
	vertical-align: top;
	resize: none;
}
.form .zip {
	display: flex;
	gap: 0.5em;
}
.form .zip span {
	display: inline-block;
	padding: 0 0.5em;
	line-height: 2.4;
	color: #fff;
	background: #00a5c8;
	white-space: nowrap;
	border-radius: 0.3em;
	cursor: pointer;
}
.form td label {
	display: inline-block;
	line-height: 2.4;
}
.form td label:not(:last-child) {
	margin-right: 1em;
}
.form .agree a {
	text-decoration: underline;
}
.form .agree a:hover {
	text-decoration: none;
}
.mw_wp_form .error {
	padding-top: 0.5em;
}
.form .personal_info {
	max-width: 680px;
	margin: 0 auto;
}
.form .personal_info .privacy_box {
	overflow-y: auto;
	box-sizing: border-box;
	border-width: 1px;
	border-style: solid;
	border-color: rgb(208, 208, 208);
	border-image: initial;
	text-align: left;
	background: rgba(255, 255, 255, 0.65);
}
.form .personal_info .privacy_box dl dt {
	font-weight: bold;
}
.form .personal_info .tit {
	font-size: 110%;
	font-weight: bold;
	margin-bottom: 8px;
}
.form .error {
    font-size: 93%;
    color: #B70000;
    display: block;
    padding-top: 0.5em;
}
@media ( min-width: 961px ){
	.form td input[type="text"] {
		width: 500px;
	}
	.form td input.short {
		width: 350px;
	}
	.form .zip {
		width: 300px;
	}
}
@media ( min-width: 601px ) and ( max-width: 960px ){
	.form td input[type="text"] {
		width: 390px;
	}
	.form td input.short {
		width: 280px;
	}
	.form .zip {
		width: 280px;
	}
}
@media ( min-width: 601px ){
	.form th {
		padding: 0.8em 1em;
		text-align: right;
		vertical-align: top;
		white-space: nowrap;
		line-height: 2.4;
	}
	.form td {
		padding: 0.8em 1em;
	}
	.form .agree {
		margin: 3em 0;
	}
	.form .personal_info .text {
    	margin-bottom: 15px;
    	margin-top: 15px;
    	text-align: left;
    }
	.form .personal_info .privacy_box {
		font-size: 14px;
		height: 150px;
		padding: 16px 30px 20px;
		line-height: 1.8;
		margin-bottom: 50px;
	}
	.form .personal_info .privacy_box dl dt {
		font-size: 16px;
		margin-bottom: 10px;
		margin-top: 20px;
	}
}
@media ( max-width: 600px ){
	.form table,
	.form tbody,
	.form tr,
	.form th,
	.form td {
		display: block;
	}
	.form th {
		padding: 0 0 0.5em;
	}
	.form td {
		padding: 0 0 1.5em;
	}
	.form td select {
		width: 100%;
	}
	.form .agree {
		margin: 2em 0;
		font-size: 90%;
	}
	.form .personal_info .text {
    	font-size: 3.2vw;
    	margin-bottom: 3vw;
    }
	.form .personal_info .privacy_box {
		font-size: 2.8vw;
		height: 29.8667vw;
		padding: 2.4vw 2.6667vw;
		line-height: 1.4;
		margin-bottom: 4vw;
	}
	.form .personal_info .privacy_box dl dt {
		font-size: 3.2vw;
		margin-bottom: 2vw;
		margin-top: 3.5vw;
	}
}