@charset "utf-8";

p#text_default,p#text_confirm,p#text_thanks {
	text-align: center;
}

form#mail-form, div#company-prof, div.service-wrap {
	margin: 0;
	padding: 0;
}

form#mail-form, div#company-prof, div.service-wrap {
	width: 100%;
	margin: 20px auto;
	padding: 2em 0;
	background: #ffffff;
	border: 1px solid #cccccc;
	border-radius: 7px;
	box-shadow: 0 0 7px rgba( 0, 0, 0, 0.2 );
	/*font-size: 14px;*/
	line-height: 1.8;
}

form#mail-form dl, div#company-prof dl, div.service-wrap div.service-inner {
	width: 90%;
	margin: 0 auto;
	overflow: hidden;
}

form#mail-form dl dt, div#company-prof dl dt {
	clear: both;
	width: 30%;
	float: left;
	border-top: 1px solid #cccccc;
	padding: 15px 0;
	text-align: right;
	overflow: hidden;
	font-weight: bold;
}

form#mail-form dl dd, div#company-prof dl dd {
	width: 65%;
	float: right;
	border-top: 1px solid #cccccc;
	padding: 15px 0 15px 5%;
}
@media screen and ( max-width: 768px ) {
form#mail-form dl dd, div#company-prof dl dd {
	padding: 0px 0 15px 5%;
}
}

form#mail-form dl dd span.kakunin, div#company-prof dl dd p{
	/*font-size: 16px;*/
}
p.tel-number a{
    color:#333 !important;
}


form#mail-form dl dt:first-child,
form#mail-form dl dt:first-child + dd {
	border: none;
}

div#company-prof dl dt:first-child,
div#company-prof dl dt:first-child + dd {
	border: none;
} 

form#mail-form dl dt span, div#company-prof dl dt span {
	display: block;
	font-size: 12px;
	color: #3377ff;
}

div#company-prof ul, ol {
    margin: 0 0 0 18px;
    padding: 0;
    border: 0;
    vertical-align: baseline;
}

div#company-prof ul li.list {
	/*font-size: 16px;*/
	list-style: disc;
}

span.error_blank {
	font-size: 11px;
}


/* -- for JavaScript ここから -------------------------------------------------------------------------------- */

form#mail-form dl dt span.required,
form#mail-form dl dt span.optional {
	display: inline-block;
	float: left;
	color: #ffffff;
	padding: 4px 10px;
	border-radius: 3px;
}

form#mail-form dl dt span.required {
	background: #d9534f;
	border: 1px solid #d43f3a;
}

form#mail-form dl dt span.optional {
	background: #337ab7;
	border: 1px solid #2e6da4;
}

form#mail-form dl dd span.error_blank,
form#mail-form dl dd span.error_format,
form#mail-form dl dd span.error_match,
form#mail-form span.error_blank {
	display: block;
	color: #ff0000;
	margin-top: 3px;
}


span.loading {
	width: 50px;
	height: 50px;
	border-radius: 50%;
	border-top: 5px solid rgba( 255, 255, 255, 0.2 );
	border-right: 5px solid rgba( 255, 255, 255, 0.2 );
	border-bottom: 5px solid rgba( 255, 255, 255, 0.2 );
	border-left: 5px solid #ffffff;
	-webkit-transform: translateZ( 0 );
	-ms-transform: translateZ( 0 );
	transform: translateZ( 0 );
	-webkit-animation: load-circle 1.0s linear infinite;
	animation: load-circle 1.0s linear infinite;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -30px;
	margin-left: -30px;
}

@-webkit-keyframes load-circle {
	0% {
		-webkit-transform: rotate( 0deg );
		transform: rotate( 0deg );
	}
	100% {
		-webkit-transform: rotate( 360deg );
		transform: rotate( 360deg );
	}
}

@keyframes load-circle {
	0% {
		-webkit-transform: rotate( 0deg );
		transform: rotate( 0deg );
	}
	100% {
		-webkit-transform: rotate( 360deg );
		transform: rotate( 360deg );
	}
}


/* -- for JavaScript ここまで -------------------------------------------------------------------------------- */


form#mail-form input[type="text"],
form#mail-form input[type="email"],
form#mail-form input[type="tel"] {
	max-width: 90%;
	padding: 7px 2%;
	border: 1px solid #cccccc;
	border-radius: 3px;
	background: #fafafa;
	-webkit-appearance: none;
	/*font-size: 100%;*/
	font-family: inherit;
	margin-top: 7px;
}

form#mail-form input[type="text"]:focus,
form#mail-form input[type="email"]:focus,
form#mail-form input[type="tel"]:focus,
form#mail-form textarea:focus {
	box-shadow: 0px 0px 5px #55ccff;
	border: 1px solid #55ccff;
	background: #ffffff;
}

form#mail-form ul li input[type="radio"],
form#mail-form ul li input[type="checkbox"] {
	margin-right: 10px;
	margin-top: 10px;
}

form#mail-form ul li:first-child input[type="radio"],
form#mail-form ul li:first-child input[type="checkbox"] {
	margin-top: 0px;
}

form#mail-form select {
	/*font-size: 100%;*/
	font-family: inherit;
	margin-top: 10px;
}

form#mail-form textarea {
	display: block;
	width: 90%;
	max-width: 90%;
	height: 200px;
	padding: 7px 2%;
	resize: vertical;
	border: 1px solid #cccccc;
	border-radius: 3px;
	background: #fafafa;
	-webkit-appearance: none;
	/*font-size: 100%;*/
	font-family: inherit;
}


form#mail-form ul {
	list-style-type: none;
}

form#mail-form ul li label:hover {
	cursor: pointer;
}

form#mail-form ul.privacy_list {
	list-style-type: decimal;
}
ul.privacy_list li {
    padding-top: 0px;
    padding-right: 5px;
    padding-bottom: 2px;
    padding-left: 0px;
    margin: 0 0 0 20px;
}

div#privacy .inlineframe {
	background-color: #FFFFFF;
    height: 260px;
    overflow: auto;
    overflow-y: scroll;
    overflow-x: hidden;
    margin: 20px 0px 20px 0px;
	padding-right: 20px;
}
div#privacy .inlineframe::-webkit-scrollbar-thumb {
    background: #e93333;
}
div#privacy .inlineframe::-webkit-scrollbar-track {
    background: #ffc4b7;
}
div#privacy .inlineframe::-webkit-scrollbar {
    height: 10px;
}
div#privacy ::-webkit-scrollbar {
    width: 12px;
    height: 12px;
}
div#privacy ::-webkit-scrollbar-thumb {
    border-radius: 1em;
}
div#privacy ::-webkit-scrollbar-track {
    border-radius: 1em;
    background: transparent;
}

form#mail-form input#company {
	width: 60%;
}

form#mail-form input#name_1,
form#mail-form input#name_2,
form#mail-form input#read_1,
form#mail-form input#read_2,
form#mail-form input#postal,
form#mail-form input#phone,
form#mail-form input#schedule {
	width: 30%;
}

form#mail-form input#mail_address,
form#mail-form input#mail_address_c {
	width: 80%;
}

span#space + a {
	display: inline-block;
	padding: 5px 15px;
	border: 1px solid #46b8da;
	border-radius: 3px;
	background: #5bc0de;
	/*font-size: 100%;*/
	color: #ffffff;
	text-decoration: none;
}

span#space + a:hover {
	cursor: pointer;
	background: #31b0d5;
	border: 1px solid #269abc;
}

form#mail-form input#address {
	width: 90%;
}


form#mail-form p#form_button, form#mail-form div#privacy {
	width: 90%;
	margin: 0 auto;
	padding: 15px 0;
	border-top: 1px solid #cccccc;
}

form#mail-form input[type="button"], form#mail-form input[type="submit"] {
	padding: 7px 20px;
	border: 1px solid #66736e;
	border-radius: 3px;
	background: #737f7a;
	font-size: 100%;
	color: #ffffff;
	font-family: inherit;
	-webkit-appearance: none;
}

form#mail-form input[type="button"]:hover {
	cursor: pointer;
	background: #58635e;
	border: 1px solid #4d5854;
}

form#mail-form div.center {
    text-align: center;
}







/* -- responsive ----------------------------------------------------------------------------------------------------------------- */

/* 960pixel start */
@media screen and ( max-width: 960px ) {

form#mail-form, div#company-prof, div.service-wrap div.service-inner {
	/*width: 100%;*/
	/*font-size: 100%;*/
}

form#mail-form dl, div#company-prof dl {
	overflow: visible;
}

form#mail-form dl dt, div#company-prof dl dt {
	width: auto;
	float: none;
	text-align: left;
	padding: 15px 0 5px;
}

form#mail-form dl dd, div#company-prof dl dd {
	width: auto;
	float: none;
	border-top: none;
	/*padding: 0px 0 20px 0px;*/
}

div#company-prof dl dd:last-child {
	padding: 0px 0 0px 5%;
}

form#mail-form dl dt span, div#company-prof dl dt span {
	font-weight: bold;
}

div#company-prof ul, ol {
    margin: 0px 0 0px 20px;
    padding: 0;
}


/* -- for JavaScript ここから -------------------------------------------------------------------------------- */

form#mail-form dl dt span.required,
form#mail-form dl dt span.optional {
	margin-right: 1em;
	margin-bottom: 2em;
}


/* -- for JavaScript ここまで -------------------------------------------------------------------------------- */

form#mail-form input[type="text"],
form#mail-form input[type="email"],
form#mail-form input[type="tel"] {
	margin-top: 0px;
}

form#mail-form input#postal + a {
	padding: 6px 15px 5px;
}

form#mail-form select {
	font-size: 16px;
	margin-top: 0;
}

form#mail-form input#phone,
form#mail-form input#schedule {
	width: 50%;
}

}
/* 960pixel end */

/* 768pixel start */
@media screen and ( max-width: 768px ) {
form#mail-form dl dd span.kakunin, div#company-prof dl dd p{
	font-size: 12px;
}
div#company-prof ul li.list {
	font-size: 12px;
}
}
/* 768pixel end */




/* rental.html sales.html consulting.html */
#sales-s_img div.t-h2 {
	background:url(../img/img_sales_bg.jpg);
	background-position:center center;
	background-size: cover;
}

#rental-s_img div.t-h2 {
	background:url(../img/img_rental_bg.jpg);
	background-position:center center;
	background-size: cover;
}

#consulting-s_img div.t-h2 {
	background:url(../img/img_consulting_bg.jpg);
	background-position:center center;
	background-size: cover;
}

#service-list div.service-top_area {
margin: 20px 0 20px 0;
padding-bottom: 20px;
border-bottom: 1px dotted #999999;
}
#service-list div.service-top_area:last-child {
border-bottom: none;
padding-bottom: 0;
}
/*.service-top_area:last-child {
margin: 30px 0 0 0;
}*/
div.text p{
margin-bottom: 10px;
line-height: 1.6;
overflow: auto;
}
div.text p:last-child{
margin-bottom: 0;
}
.text h5.Ttl-fs18{
text-align: left;
}
div.btn-lineup{
text-align:center;	
}
div.pict-r {
width: 50%;
float:right;
clear:right;
margin:0 0 0 26px;
}
div.pict-l {
width: 50%;
float:left;
clear:left;
margin:0 26px 0 0;
}
div.pict-r300 {
width: 300px;
float:right;
clear:right;
margin:0 0 0 0px;
}
div.pict-l300 {
width: 300px;
float:left;
clear:left;
margin:0 10px 0 0;
}
div.pict-r img, div.pict-l img, div.pict-r300 img, div.pict-l300 img{
max-width:100%;
}
@media (max-width:768px) {
div.service-top_area {
}
div.text {
width: 100%;
text-align: left;
margin-top: 20px;
}
.text h5.Ttl-fs18{
text-align: center;
}
div.pict-r, div.pict-l, div.pict-r300, div.pict-l300 {
width:100%;
float:none;
display:block;
position:relative;
margin: 0;
}
div.pict-r img, div.pict-l img, div.pict-r300 img, div.pict-l300 img {
max-width:80%;
display:block;
margin:0 auto 0px;
}
}

.service-flow_area .flow-inner, .service-faq_area .faq-inner {
position: relative;
max-width: 100%;
margin: 0 auto;
}
.service-flow_area .flow {
position: relative;
counter-reset: num;
}
.service-flow_area .flow::before {
content: "";
position: absolute;
width: 3px;
height: calc(100% - 9em);
background-color: #f0faff;
left: 19px;
top: 5em;
}
@media (min-width: 361px) {
.service-flow_area .flow::before {
height: calc(100% - 6em);
top: 3em; }
}  
.service-flow_area .flow li {
margin-bottom: 20px;
text-align: justify;
padding-left: 50px;
position: relative;
}
@media (min-width: 769px) {
.service-flow_area .flow li { margin-bottom: 40px; }
}
.service-flow_area .flow li::before {
counter-increment: num;
content: counter(num);
position: absolute;
color: #009AA4;
font-size: 28px;
top: 50%;
left: 0;
transform: translateY(-50%);
background-image: url(../img/bg02.svg);
background-size: contain;
background-repeat: no-repeat;
width: 40px;
height: 40px;
line-height: 40px;
text-align: center;
font-family: YakuHanJP_Narrow, "メイリオ", Meiryo, sans-serif;
}
.service-flow_area .flow li span.flow-title {
display: block;
font-weight: bold;
font-size:14px;
line-height: 2em;
}
@media (min-width: 769px) {
.service-flow_area .flow li span.flow-title {
font-size: 16px !important;
}
}
.service-flow_area .cfa-ill {
position: absolute;
width: 15vw;
top: 0;
right: 0;
}
/*@media (min-width: 600px) {
.service-flow_area .cfa-ill {
width: 80px;
top: 50%;
transform: translateY(-50%); }
}*/
.strong-inner {
text-align: left;
/*max-width: 90%;*/
margin: 0 auto;
}
.boder-line {
display: inline-block;
color: #FFFFFF;
border-bottom: 2px solid #FFFFFF;
padding-bottom: 0.1em;
}
.strong-inner ul.strong-nav, .lineup-inner_ac ul.lineup-nav, .lineup-inner_cr ul.lineup-nav, .lineup-inner_ct ul.lineup-nav, .lineup-inner_fc ul.lineup-nav, .trouble-inner ul.trouble-nav {
padding: 20px;
letter-spacing: -0.4em;
border-radius: 5px;
}
.strong-inner ul.strong-nav {
background: #6492a4;
border: 1px solid #6492a4;
}
ul.strong-nav li.check, ul.trouble-nav li.check {
display: block;
margin: 10px 0 0px 0;
letter-spacing: .04em;
padding-left: 1.5em;
padding-bottom: 0.5em;
text-indent: -1.5em;
border-bottom: 1px dashed #FFFFFF;
}
ul.strong-nav li.check:last-child, ul.trouble-nav li.check:last-child {
margin: 10px 0 0px 0;
}
ul.strong-nav li.check span.check-icon::before, ul.trouble-nav li.check span.check-icon::before {
content: "\f058";
font-family: "Font Awesome 5 Free";
margin-right: 6px;
font-weight: 900;
color:#FF3;
}

.lineup-inner_ac ul.lineup-nav {
background: #9e7e87;
border: 1px solid #9e7e87;
}
.lineup-inner_cr ul.lineup-nav {
background: #71aca4;
border: 1px solid #71aca4;
}
.lineup-inner_fc ul.lineup-nav {
background: #a89164;
border: 1px solid #a89164;
}
.lineup-inner_ct ul.lineup-nav {
background: #47a3c9;
border: 1px solid #47a3c9;
}

/* カードレイアウト部分をラッピングし、
Flexboxを指定"space-between"で各アイテムを均等に配置し、
最初と最後のアイテムを端に寄せます。*/
#lineup-wrap {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-pack: justify;
margin: 0 auto;
max-width: 100%;
width: 100%;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-pack: justify;
justify-content: space-between;
}
/* リンクテキストの下線を非表示 */
a.card-link {
text-decoration: none;
}
/* カードレイアウト内の画像を幅いっぱいに表示 */
#lineup-wrap img {
display: block;
max-width: 100%;
height: auto;
margin: 0 auto;
}
.card-figure {
margin: 0;
padding: 0;
}
/* カードレイアウトのタイトル部分 */
#lineup-wrap .card-title {
display: block;
margin: 0.5em 0 0 0;
color: #333;
text-align: center;
font-size: 14px;
}
#lineup-wrap .card-title span {
display: block;
text-align: center;
font-size: 10px;
transform:scale(0.9);
}
.item-box {
/*font-size: 11px;*/
color: #FFFFFF !important;
font-weight: bold;
display: inline-block;
margin: 0px 0 0 0;
padding: 4px 2px 3px 2px;
letter-spacing: 0em;
line-height: 20px;
text-align:center;
}
.item-name {
background: #1e262d;
}
@media screen and (max-width: 560px) {
#lineup-wrap .card-title {
font-size: 12px;
}
}
/* カードレイアウトの説明文部分 */
#lineup-wrap .card-text-tax {
display: block;
margin: 0;
padding: 0em 0.5em 0.5em 0.5em;
color: #818181;
text-align: left;
letter-spacing: .04em;
line-height: 1.5
}
/* カードレイアウトを1カラムで配置 */
#lineup-wrap .card-list {
margin: 0.5em auto;
padding: 1em;
width: 96%;
background: #fff;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.08);
}
/* 画面幅768px以上の場合カードレイアウトを2カラムで配置 */
@media all and (min-width: 768px) {
#lineup-wrap .card-list {
width: calc(96% / 2); /* 96%幅を2で割るという指定 */
}
}
/* 画面幅992px以上の場合カードレイアウトを3カラムで配置 */
@media all and (min-width: 992px) {
#lineup-wrap .card-list {
width: calc(96% / 3);  96%幅を3で割るという指定
}
/* 最後の行が3列より少ない場合左寄せにレイアウトさせる
#lineup-wrap::after{
content: "";
margin: 0.5em auto;
display: block;
width: calc(96% / 3);
} */
}

.trouble-inner ul.trouble-nav {
background: #83aeaa;
border: 1px solid #83aeaa;
}
.triangle{
width: 8%;
border-top: 40px solid #83aeaa;
border-right: 40px solid transparent;
border-left: 40px solid transparent;
margin: 0 auto;
}
.marker{
font-size: 26px;
font-weight: bold;
display: inline-block;
background: linear-gradient(transparent 70%, #ffea2e 70%);
margin: 10px 0 10px 0;
}
.group {
margin: 10px 0 0 0;
}
.group:last-child {
margin: 0px 0 0 0;
}
.group-box {
font-size: 11px;
font-weight: bold;
display: inline-block;
margin: 0px 0 0 0;
padding: 4px 4px 3px 4px;
letter-spacing: 0.1em;
line-height: 20px;
text-align:center;
}
.group-game {
background: #ff2b44;
/*border: 1px solid #ff2b44;
border-radius: 4px;*/
}
.group-care {
background: #954baa;
/*border: 1px solid #954baa;
border-radius: 4px;*/
}
.group-promotion {
background: #fc8d58;
/*border: 1px solid #fc8d58;
border-radius: 4px;*/
}
@media (max-width: 560px) {
.marker{
font-size: 18px;
}
}
@media (max-width: 320px) {
.marker{
font-size: 17px;
}
}

.telmail-inner {
text-align: center;
/*max-width: 90%;*/
margin: 0 auto;
}
.telmail-inner ul.telmail-nav {
margin: 0em;
padding: 20px 0;
letter-spacing: -0.4em;
background: #999999;
border: 1px solid #999999;
border-radius: 5px;
}
.telmail-inner ul.telmail-nav li {
display: inline-block;
padding: 0 10px;
letter-spacing: normal;
vertical-align: middle;
}
.telmail-inner ul.telmail-nav li.mail-f a {
display: block;
width: 380px;
color: #999999;
font-weight: bold;
line-height: 50px;
border: 1px solid #ffffff;
border-radius: 5px;
box-sizing: border-box;
transition: background 0.3s;
text-decoration: none;
background: #ffffff;
}
li.mail-f span, li.tel-n span {
font-size: 18px;
}
.telmail-inner ul.telmail-nav li.mail-f a:hover {
background: #dddddd;
}
.telmail-inner ul.telmail-nav li.mail-f a span.tel-icon::before {
content: "\f0e0";
font-family: "Font Awesome 5 Free";
margin-right: 6px;
font-weight: 900;
}
.telmail-inner ul.telmail-nav li.tel-n {
display: inline-block;
margin-right: 10px;
font-weight: bold;
letter-spacing: .04em;
}
li.tel-n span {
font-size: 22px;
}
.telmail-inner ul.telmail-nav li.tel-n span.tel-icon::before {
content: "\f3cd";
font-family: "Font Awesome 5 Free";
margin-right: 6px;
font-weight: 900;
}
.telmail-inner ul.telmail-nav li.tel-n span {
vertical-align: initial;
color: #ffffff;
}
@media screen and (max-width:812px) {
.telmail-inner ul.telmail-nav {
padding: 20px 20px;
letter-spacing: inherit;
}
.telmail-inner ul.telmail-nav li {
padding: 0;
display: block;
}
.telmail-inner ul.telmail-nav li.mail-f {
margin-bottom: 10px;
}
.telmail-inner ul.telmail-nav li.mail-f:last-child{
bordern-bottom: none;
}
.telmail-inner ul.telmail-nav li.mail-f a {
display: block;
width: 100%;
max-width: 320px;
margin: auto;
padding: 0 20px;
font-weight: bold;
line-height: 30px;
}
li.mail-f span {
font-size: 14px;
}
.telmail-inner ul.telmail-nav li.mail-f a::before {
content: "";
display: inline-block;
width: 12px;
height: 10px;
margin-right: 10px;
vertical-align: middle;
background-size: contain;
}
.telmail-inner ul.telmail-nav li.tel-n {
display: inline-block;
}
li.tel-n span {
font-size: 16px;
}
.telmail-inner ul.telmail-nav li.tel-n span.tel-icon {
padding-left: 16px;
background-size: 12px auto;
}
}
@media screen and (max-width:320px) {
.telmail-inner ul.telmail-nav {
padding: 20px 10px;
}
}

div.faq {
margin-bottom: 18px;
padding-bottom: 18px;
border-bottom: 1px dotted #999999;
}
div.faq:last-child {
margin-bottom: 0px;
padding-bottom: 0px;
border-bottom: none;
}
div.faq p.question {
display: block;
font-size: 14px;
font-weight: bold;
line-height: 1.6em;
padding-left: 1.8em;
text-indent: -1.8em;
margin-bottom: 5px;
}
p.question::before {
content: "\f059";
font-family: "Font Awesome 5 Free";
margin-right: 6px;
font-size: 20px;
font-weight: 900;
color: #F03;
}
div.faq p.answer {
display: block;
padding-left: 2.1em;
text-indent: -2.1em;
margin-bottom: 10px;
}
div.faq p.answer:last-child {
margin-bottom: 0px;
}
p.answer::before {
content: "\f05a";
font-family: "Font Awesome 5 Free";
margin-right: 6px;
font-size: 20px;
font-weight: 900;
color: #06F;
}
@media (min-width: 769px) {
div.faq p.question {
font-size: 16px;
padding-left: 1.6em;
text-indent: -1.6em;
}
div.faq p.answer {
padding-left: 1.9em;
text-indent: -1.9em;
}
}