@charset "utf-8";


/* CSS ドキュメント */
/*========================*/
/*
main_color:#eb68a3;
sub_color:#fbc2db;
sub_blue:#00a1e9;
sub_pink:#e968a1;
*/

/*1.WRAP
============*/
/*2.HEADER
============*/
/*3.TOP
============*/
/*4.MENU
============*/
/*4.RECRUIT
============*/
/*5.GUIDE
============*/
/*6.ABOUT
============*/
/*7.CONTACT
============*/
/*8.FOOTER
============*/

/*========================*/

h2 {
	font-size: 36px;
}

h2#main_title {
	font-size: 36px;
	letter-spacing: 10px;
}

h2,p {background-image: url(../../img/pix.gif);}


/*=========================
	WRAP
=========================*/
#wrap {
	background: #fff;
	overflow: hidden;
}


/*=========================
	HEADER
=========================*/
header {
	background: #eb68a3;
}

header a:hover {
	opacity: 0.5;
}

header nav {
	background: #fbc2db;
}

#head_logo {
	text-align: justify;
	text-justify: distribute-all-lines;
	font-size: 0;
}

#head_logo:after {
	content:"";
	display: inline-block;
	width: 100%;
	line-height:0;
	height: 0;
}

.head_item,.head_item2,.head_item3 {
	display: inline-block;
	vertical-align: middle;
}

.header-tel {
	line-height: 1em;
}

.logo {
	max-width: 250px;
}


/*=========================
	TOP
=========================*/
#top_img {
	background:linear-gradient(90deg,#ffedf5 0%,#ffedf5 50%,#fff 50%,#fff 100%);
}

/*=========================
	MAIN
=========================*/

#main {
	background: url(../../img/main_back.jpg) center center no-repeat;
	background-size: cover;
}

#main_pr p {
	width: 20%;
	display: inline-block;
	vertical-align: middle;
}

#main_pr p:nth-child(even) {
	width: 54px;
	margin: 0 5%; 
}
/*3PR
***********/


/*=========================
	MENU
=========================*/
#menu {
-webkit-background-size: 100px 100px;
-moz-background-size: 100px 100px;
background-size: 100px 100px;
background-color: #ffedf5;
background-image: -webkit-gradient(linear, 0 0, 100% 100%,
            color-stop(.25, #fff), color-stop(.25, transparent),
            color-stop(.5, transparent), color-stop(.5, #fff),
            color-stop(.75, #fff), color-stop(.75, transparent),
            to(transparent));
background-image: -webkit-linear-gradient(-45deg, #fff 25%, transparent 25%,
          transparent 50%, #fff 50%, #fff 75%,
          transparent 75%, transparent);
background-image: -moz-linear-gradient(-45deg, #fff 25%, transparent 25%,
          transparent 50%, #fff 50%, #fff 75%,
          transparent 75%, transparent);
background-image: -ms-linear-gradient(-45deg, #fff 25%, transparent 25%,
          transparent 50%, #fff 50%, #fff 75%,
          transparent 75%, transparent);
background-image: -o-linear-gradient(-45deg, #fff 25%, transparent 25%,
          transparent 50%, #fff 50%, #fff 75%,
          transparent 75%, transparent);
background-image: linear-gradient(-45deg, #fff 25%, transparent 25%,
          transparent 50%, #fff 50%, #fff 75%,
          transparent 75%, transparent);
}

h2#menu_title {
	background: #fff;
}

/*menu_item
***********/
.menu_item {
    width: 30%;
    display: inline-block;
    height: 26em;
    vertical-align: top;
    background: #fff; 
    position: relative;
    padding: 15px;
    margin: 15px 0 30px 17px;
    border: 1px solid #ccc;
    box-sizing: border-box;
    transition: all 0.5s;
}

.point {
    border-radius: 50%;
    width: 70px;
    height: 70px;
    line-height: 70px !important;
    background: #eb68a3;
    border: 1px solid #eb68a3;
    position: absolute;
    top: -15px;
    left: -15px;
    z-index: 10;
    color: #fff;
   	box-sizing: border-box;
    transition: all 0.5s;
}

.menu_item:hover {
	border: 1px solid #eb68a3;
}

.menu_item:hover .point {
	color: #eb68a3;
	border: 1px solid #eb68a3;
	background: #fff;
	transition: all 0.5s;
}

.menu_item h2 {
	line-height: 1.2em;
}


/*=========================
	RECRUIT
=========================*/
/*企業向け
****************/
#company {
	position: relative;
	background: #00a1e9;
	z-index: 100;
}

/*矢印
***************/
#company:after {
	width: 0;
	border: 35px solid transparent;
	border-bottom-color: #00a1e9;
	border-top-width: 0;
	content: "";
	display: block;
	top: -35px;
	left: 0;
	right: 0;
	margin: auto; 
	position: absolute;
}

/*背景
***************/
#recruit_back {
	background: url(../../img/recruit_back.jpg) center center no-repeat;
	background-size: contain;
}

/*タイトル
***************/
#recruit_back h2 img {
	max-width: 910px; 
}

/*依頼・見積
***************/
#company_item {
	text-align: center;
	text-justify: distribute-all-lines;
	line-height: 0;
	font-size: 0;
}

#company_item:after {
  content:"";
  display: inline-block;
  width: 100%;
  line-height:0;
  height: 0;
}

#company .sigoto,#company .mitsumori {
	display: inline-block;
	width: 48%;
	font-size: 20px;
	line-height: 2em;
	color: #fff;
	margin-bottom: 5px;
}

#company .sigoto {
	background: #62de87;
}

#company .mitsumori {
	background: #ff8471;
}

/*問合せリンク
***************/
#company .link {
	width: 100%;
	max-width: 600px;
	font-size: 30px;
	line-height: 2em;
	transition: all 0.5s;
-webkit-background-size: 4px 4px;
-moz-background-size: 4px 4px;
background-size: 4px 4px;
background-color: #ffb500;
background-image: -webkit-gradient(linear, 0 0, 100% 100%,
            color-stop(.25, #ffd911), color-stop(.25, transparent),
            color-stop(.5, transparent), color-stop(.5, #ffd911),
            color-stop(.75, #ffd911), color-stop(.75, transparent),
            to(transparent));
background-image: -webkit-linear-gradient(-45deg, #ffd911 25%, transparent 25%,
          transparent 50%, #ffd911 50%, #ffd911 75%,
          transparent 75%, transparent);
background-image: -moz-linear-gradient(-45deg, #ffd911 25%, transparent 25%,
          transparent 50%, #ffd911 50%, #ffd911 75%,
          transparent 75%, transparent);
background-image: -ms-linear-gradient(-45deg, #ffd911 25%, transparent 25%,
          transparent 50%, #ffd911 50%, #ffd911 75%,
          transparent 75%, transparent);
background-image: -o-linear-gradient(-45deg, #ffd911 25%, transparent 25%,
          transparent 50%, #ffd911 50%, #ffd911 75%,
          transparent 75%, transparent);
background-image: linear-gradient(-45deg, #ffd911 25%, transparent 25%,
          transparent 50%, #ffd911 50%, #ffd911 75%,
          transparent 75%, transparent);
}

#company .link a {
	transition: all 0.5s;
}

#company .link:hover {
	transition: all 0.5s;
-webkit-background-size: 4px 4px;
-moz-background-size: 4px 4px;
background-size: 4px 4px;
background-color: #ff6d24;
background-image: -webkit-gradient(linear, 0 0, 100% 100%,
            color-stop(.25, #ffb500), color-stop(.25, transparent),
            color-stop(.5, transparent), color-stop(.5, #ffb500),
            color-stop(.75, #ffb500), color-stop(.75, transparent),
            to(transparent));
background-image: -webkit-linear-gradient(-45deg, #ffb500 25%, transparent 25%,
          transparent 50%, #ffb500 50%, #ffb500 75%,
          transparent 75%, transparent);
background-image: -moz-linear-gradient(-45deg, #ffb500 25%, transparent 25%,
          transparent 50%, #ffb500 50%, #ffb500 75%,
          transparent 75%, transparent);
background-image: -ms-linear-gradient(-45deg, #ffb500 25%, transparent 25%,
          transparent 50%, #ffb500 50%, #ffb500 75%,
          transparent 75%, transparent);
background-image: -o-linear-gradient(-45deg, #ffb500 25%, transparent 25%,
          transparent 50%, #ffb500 50%, #ffb500 75%,
          transparent 75%, transparent);
background-image: linear-gradient(-45deg, #ffb500 25%, transparent 25%,
          transparent 50%, #ffb500 50%, #ffb500 75%,
          transparent 75%, transparent);
}

#company .link:hover a {
	color: #fff;
	transition: all 0.5s;
}

/*個人向け
****************/
#staff {
	position: relative;
	background: #eb68a3;
	z-index: 100;
}

/*矢印
***************/
#staff:after {
	width: 0;
	border: 35px solid transparent;
	border-top-color: #eb68a3;
	border-bottom-width: 0;
	content: "";
	display: block;
	bottom: -35px;
	left: 0;
	right: 0;
	margin: auto; 
	position: absolute;
}

/*背景
***************/
#staff_back {
	background: url(../../img/staff_back.jpg) bottom center no-repeat;
	background-size: contain;
	position: relative;
}

/*タイトル
***************/
#staff_back h2.white {
	width: 100%;
	font-size: 24px;
	line-height: 2em;
	background: #000;
}

/*テキスト
***************/
#staff_back p.white {
	line-height: 1em;
}

p.staff_txt {
	position: absolute;
	left: 0;
	bottom: 50px;
	width: 28%;
	max-width: 300px;
}

p.circle_txt {
	position: absolute;
	bottom: 50px;
	right: 0;
	font-size: 36px;
	line-height: 1.2em;
	font-weight: bold;
	width: 200px;
	padding: 60px 0;
	border-radius: 50%;
	background: #fff;
	color: #c3011b;
	text-decoration: underline;
	transform: rotate( -15deg );
}


/*=========================
	GUIDE
=========================*/
#guide {
	background: url(../../img/guide_back.jpg) top center no-repeat;
	background-size: cover;
}

#guide h2 img {
	max-width: 555px;
}

#guide h2.guide_title {
	line-height: 2em;
	background: #ffb700;
}

#guide_pr p {
	display: inline-block;
	vertical-align: middle;

}

#guide_box {
	position: relative;
	background: #e968a1;
}

/*item1
***************/
#guide_box_item {
	width: 660px;
}

.guide_box_img {
	width: 25%;
	display: inline-block;
	vertical-align: middle;
}

.guide_box_title {
	display: inline-block;
	vertical-align: middle;
	line-height: 1.5em;
	letter-spacing: -3px;
	background: url(../../img/guide_box_line.png) top left repeat;
}

/*item2
***************/
#guide_box_item2 {
	background: #fff;
	border-radius: 10px;
	box-sizing: border-box;
}

#guide_box_item2 p,#guide_box_item2 h2 {
	width: 100%;
	max-width: 840px;
	line-height: 1.7em;
	letter-spacing: -1px;
}

/*サポート
***************/
#guide_sopport {
	max-width: 840px;
}

.guide_support_box {
	width: 49%;
	max-width: 400px;
	display: inline-block;
	vertical-align: top;
}

/*table
***************/
#guide_table h2 {
	background: #000;
	font-size: 24px;
	line-height: 2em;
	width: 800px;
}

#guide_table table {
	width: 820px;
	border-collapse: separate;
	border-spacing: 10px;
	box-sizing: border-box;
}

#guide_table table tr {
	border-bottom: 10px solid transparent;
}

#guide_table table th {
	display: table-cell;
	background: #000;
	color: #ffd70f;
	font-weight: bold;
	line-height: 2em;
	text-align: center;
	vertical-align: middle;
}

#guide_table table td {
	background: #fff;
	line-height: 2em;
	text-align: left;
	padding: 10px 0 10px 0.5em;
	margin-bottom: 10px;
}

/*リンク
***************/
#guide_table .link {
	background: #000;
	font-size: 24px;
	font-weight: bold;
	line-height: 2em;
	width: 800px;
	transition: all 0.5s;
-webkit-background-size: 4px 4px;
-moz-background-size: 4px 4px;
background-size: 4px 4px;
background-color: #ffb500;
background-image: -webkit-gradient(linear, 0 0, 100% 100%,
            color-stop(.25, #ffd911), color-stop(.25, transparent),
            color-stop(.5, transparent), color-stop(.5, #ffd911),
            color-stop(.75, #ffd911), color-stop(.75, transparent),
            to(transparent));
background-image: -webkit-linear-gradient(-45deg, #ffd911 25%, transparent 25%,
          transparent 50%, #ffd911 50%, #ffd911 75%,
          transparent 75%, transparent);
background-image: -moz-linear-gradient(-45deg, #ffd911 25%, transparent 25%,
          transparent 50%, #ffd911 50%, #ffd911 75%,
          transparent 75%, transparent);
background-image: -ms-linear-gradient(-45deg, #ffd911 25%, transparent 25%,
          transparent 50%, #ffd911 50%, #ffd911 75%,
          transparent 75%, transparent);
background-image: -o-linear-gradient(-45deg, #ffd911 25%, transparent 25%,
          transparent 50%, #ffd911 50%, #ffd911 75%,
          transparent 75%, transparent);
background-image: linear-gradient(-45deg, #ffd911 25%, transparent 25%,
          transparent 50%, #ffd911 50%, #ffd911 75%,
          transparent 75%, transparent);
}

#guide_table .link a {
	transition: all 0.5s;
}

#guide_table .link:hover {
	transition: all 0.5s;
-webkit-background-size: 4px 4px;
-moz-background-size: 4px 4px;
background-size: 4px 4px;
background-color: #ff6d24;
background-image: -webkit-gradient(linear, 0 0, 100% 100%,
            color-stop(.25, #ffb500), color-stop(.25, transparent),
            color-stop(.5, transparent), color-stop(.5, #ffb500),
            color-stop(.75, #ffb500), color-stop(.75, transparent),
            to(transparent));
background-image: -webkit-linear-gradient(-45deg, #ffb500 25%, transparent 25%,
          transparent 50%, #ffb500 50%, #ffb500 75%,
          transparent 75%, transparent);
background-image: -moz-linear-gradient(-45deg, #ffb500 25%, transparent 25%,
          transparent 50%, #ffb500 50%, #ffb500 75%,
          transparent 75%, transparent);
background-image: -ms-linear-gradient(-45deg, #ffb500 25%, transparent 25%,
          transparent 50%, #ffb500 50%, #ffb500 75%,
          transparent 75%, transparent);
background-image: -o-linear-gradient(-45deg, #ffb500 25%, transparent 25%,
          transparent 50%, #ffb500 50%, #ffb500 75%,
          transparent 75%, transparent);
background-image: linear-gradient(-45deg, #ffb500 25%, transparent 25%,
          transparent 50%, #ffb500 50%, #ffb500 75%,
          transparent 75%, transparent);
}

#guide_table .link:hover a {
	color: #fff;
	transition: all 0.5s;
}


/*=========================
	ABOUT
=========================*/
#about {
	background: #fff;
}

#about_title {
	line-height: 1.3em;
	max-width: 595px;
	border-bottom: 1px solid #e968a1;
}

#about_box {
	background: #e968a1;
}

.about_img {
	width: 50%;
	display: inline-block;
	vertical-align: middle;
}

/*table
***************/
#about table {
	width: 49%;
	color: #fff;
	font-size: 16px;
	border-collapse: separate;
	display: inline-table;
	vertical-align: middle;
}

#about table th {
	width: 30%;
	font-weight: bold;
	text-align: center;
}

#about table td {
	text-align: left;
	line-height: 1.3em;
}


/*=========================
	CONTACT
=========================*/
#contact_title {
	line-height: 1.3em;
	max-width: 595px;
	border-bottom: 1px solid #e968a1;
}

#contact_table h2 {
	max-width: 800px;
	line-height: 2em;
	font-size: 4vmin;
	background: #e968a1;
}

.mem {font-size: 0.7em;}

/*table
***************/
#contact_table table {
	width: 800px;
	border-collapse: collapse;
	border-bottom: 1px solid #ccc;
}

#contact_table table th {
	max-width: 240px;
	font-weight: bold;
	padding: 25px 0;
	border-top: 1px solid #ccc;
	text-indent: 1em;
	vertical-align: middle;
}

#contact_table table td {
	padding: 25px 0;
	border-top: 1px solid #ccc;
	vertical-align: middle;
}

input.txt,textarea {
	width: 100%;
	box-sizing: border-box;
	line-height: 2em;
}

input[type="submit"],input[type="button"],.back_link {
	-webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 0;
	color: #fff;
    background: #e968a1;
    border: none;
    line-height: 2em;
    font-size: 18px;
}

.back_link {
	width: 4em;
}


/*=========================
	FOOTER
=========================*/
footer {
	background: #e968a1;
}

footer a:hover {
	opacity: 0.5;
}

#footer_logo {
	text-align: justify;
	text-justify: distribute-all-lines;
	font-size: 0;
}

#footer_logo:after {
	content:"";
	display: inline-block;
	width: 100%;
	line-height:0;
	height: 0;
}

.footer_item {
	display: inline-block;
	vertical-align: middle;
}